@@ -68,95 +68,89 @@ const Assignment = () => {
68
68
} ;
69
69
70
70
return (
71
- < div className = "min-h-screen w-full flex ml-[23%]" >
72
- < div className = "flex w-full gap-8" >
73
- { /* Sidebar */ }
74
-
75
- < div className = "form-details flex justify-center items-center h-screen w-[70%]" >
76
- < form
77
- onSubmit = { handleSubmit }
78
- className = "w-full h-[90%] lg:w-3/4 p-6 bg-white rounded-lg shadow-md"
79
- >
80
- < div className = "space-y-6" >
81
- < h1 className = "text-3xl font-semibold text-gray-800 text-center" >
82
- Post New Assignment: Empower Your Students with Engaging Challenges!
83
- </ h1 >
84
-
85
- { /* Title Input */ }
86
- < div >
87
- < label className = "block text-gray-600 font-medium" > Title</ label >
88
- < input
89
- type = "text"
90
- placeholder = "Enter assignment title"
91
- value = { title }
92
- required
93
- className = "w-full mt-2 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
94
- onChange = { ( e ) => setTitle ( e . target . value ) }
95
- />
96
- </ div >
97
-
98
- { /* Description Input */ }
99
- < div >
100
- < label className = "block text-gray-600 font-medium" > Description</ label >
101
- < input
102
- type = "text"
103
- placeholder = "Enter assignment description"
104
- value = { description }
105
- required
106
- className = "w-full mt-2 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
107
- onChange = { ( e ) => setDescription ( e . target . value ) }
108
- />
109
- </ div >
110
-
111
- { /* Questions Input */ }
112
- < div >
113
- < label className = "block text-gray-600 font-medium" > Questions</ label >
114
- < input
115
- type = "text"
116
- placeholder = "Enter assignment questions"
117
- value = { questions }
118
- required
119
- className = "w-full mt-2 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
120
- onChange = { ( e ) => setQuestions ( e . target . value ) }
121
- />
122
- </ div >
123
-
124
- { /* Deadline Input */ }
125
- < div >
126
- < label className = "block text-gray-600 font-medium" > Deadline</ label >
127
- < input
128
- type = "date"
129
- value = { deadline }
130
- required
131
- className = "w-full mt-2 p-3 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-green-500"
132
- onChange = { ( e ) => setDeadline ( e . target . value ) }
133
- />
134
- </ div >
135
-
136
- < div >
137
- < label className = "block text-gray-600 font-medium" > Upload PDF</ label >
138
- < input
139
- type = "file"
140
- accept = "application/pdf"
141
- required
142
- onChange = { ( e ) => setPdfFile ( e . target . files [ 0 ] ) }
143
- className = "mt-2 block w-full text-sm text-gray-500 file:py-2 file:px-4 file:border file:border-gray-300 file:rounded-md file:text-sm file:font-semibold file:bg-indigo-50 file:text-indigo-700 hover:file:bg-indigo-100"
144
- />
145
- </ div >
146
-
147
- { /* Submit Button */ }
148
- < div className = "flex justify-center" >
149
- < button
150
- disabled = { loading }
151
- type = "submit"
152
- className = "w-full p-3 bg-green-500 text-white font-medium rounded-md disabled:opacity-50"
153
- >
154
- { loading ? "Posting..." : "Post Assignment" }
155
- </ button >
156
- </ div >
71
+ < div className = "min-h-screen ml-[20%] bg-gray-100 flex items-center justify-center py-12 px-4 sm:px-6 lg:px-8" >
72
+ < div className = "w-full max-w-3xl bg-white p-8 rounded-xl shadow-xl" >
73
+ < form onSubmit = { handleSubmit } className = "space-y-8" >
74
+ < div className = "space-y-6" >
75
+ < h1 className = "text-4xl font-bold text-indigo-600 text-center" >
76
+ Create New Assignment
77
+ </ h1 >
78
+
79
+ { /* Title */ }
80
+ < div >
81
+ < label className = "block text-gray-700 font-medium mb-1" > Title</ label >
82
+ < input
83
+ type = "text"
84
+ placeholder = "Enter assignment title"
85
+ value = { title }
86
+ required
87
+ className = "w-full p-3 border border-gray-300 rounded-md focus:ring-2 focus:ring-indigo-500 focus:outline-none"
88
+ onChange = { ( e ) => setTitle ( e . target . value ) }
89
+ />
157
90
</ div >
158
- </ form >
159
- </ div >
91
+
92
+ { /* Description */ }
93
+ < div >
94
+ < label className = "block text-gray-700 font-medium mb-1" > Description</ label >
95
+ < input
96
+ type = "text"
97
+ placeholder = "Enter assignment description"
98
+ value = { description }
99
+ required
100
+ className = "w-full p-3 border border-gray-300 rounded-md focus:ring-2 focus:ring-indigo-500 focus:outline-none"
101
+ onChange = { ( e ) => setDescription ( e . target . value ) }
102
+ />
103
+ </ div >
104
+
105
+ { /* Questions */ }
106
+ < div >
107
+ < label className = "block text-gray-700 font-medium mb-1" > Subject</ label >
108
+ < input
109
+ type = "text"
110
+ placeholder = "Enter subject name"
111
+ value = { questions }
112
+ required
113
+ className = "w-full p-3 border border-gray-300 rounded-md focus:ring-2 focus:ring-indigo-500 focus:outline-none"
114
+ onChange = { ( e ) => setQuestions ( e . target . value ) }
115
+ rows = { 4 }
116
+ />
117
+ </ div >
118
+
119
+ { /* Deadline */ }
120
+ < div >
121
+ < label className = "block text-gray-700 font-medium mb-1" > Deadline</ label >
122
+ < input
123
+ type = "date"
124
+ value = { deadline }
125
+ required
126
+ className = "w-full p-3 border border-gray-300 rounded-md focus:ring-2 focus:ring-indigo-500 focus:outline-none"
127
+ onChange = { ( e ) => setDeadline ( e . target . value ) }
128
+ />
129
+ </ div >
130
+
131
+ { /* PDF Upload */ }
132
+ < div >
133
+ < label className = "block text-gray-700 font-medium mb-1" > Upload PDF</ label >
134
+ < input
135
+ type = "file"
136
+ accept = "application/pdf"
137
+ required
138
+ onChange = { ( e ) => setPdfFile ( e . target . files [ 0 ] ) }
139
+ className = "mt-1 block w-full text-sm text-gray-500 file:py-2 file:px-4 file:border file:border-gray-300 file:rounded-md file:text-sm file:font-semibold file:bg-indigo-50 file:text-indigo-700 hover:file:bg-indigo-100"
140
+ />
141
+ </ div >
142
+
143
+ < div className = "pt-4" >
144
+ < button
145
+ disabled = { loading }
146
+ type = "submit"
147
+ className = "w-full py-3 bg-indigo-600 hover:bg-indigo-700 text-white font-semibold rounded-md transition-colors duration-200 disabled:opacity-50"
148
+ >
149
+ { loading ? "Posting..." : "Post Assignment" }
150
+ </ button >
151
+ </ div >
152
+ </ div >
153
+ </ form >
160
154
</ div >
161
155
</ div >
162
156
) ;
0 commit comments