Skip to content

Commit 36db0f3

Browse files
yours7himanshuyours7himanshu
committed
added some more responsiveness
1 parent bebc572 commit 36db0f3

File tree

6 files changed

+26
-26
lines changed

6 files changed

+26
-26
lines changed

‎admin/src/components/Assignment/Assignment.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ const Assignment = () => {
7272
<div className="w-full max-w-3xl bg-white p-8 rounded-xl shadow-xl">
7373
<form onSubmit={handleSubmit} className="space-y-8">
7474
<div className="space-y-6">
75-
<h1 className="text-4xl font-bold text-indigo-600 text-center">
75+
<h1 className="text-4xl max-md:text-2xl font-bold text-indigo-600 text-center">
7676
Create New Assignment
7777
</h1>
7878

‎admin/src/components/Quiz/CreateQuiz.jsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -72,7 +72,7 @@ const CreateQuiz = () => {
7272

7373
return (
7474
// Removed ml-[25%], changed w-screen to w-full. Added p-4 for some spacing.
75-
<div className="w-full flex justify-center items-center h-screen p-4">
75+
<div className="w-full flex justify-center items-center max-md:mt-10 h-screen p-4">
7676

7777
<form
7878
onSubmit={handleSubmit}

‎admin/src/components/Teachers/StudentMarksAttendance.jsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -46,9 +46,9 @@ const StudentMarksAttendance = () => {
4646
};
4747

4848
return (
49-
<div className="min-h-screen bg-gray-100 w-full flex flex-col items-center justify-center py-12 md:py-16 px-4"> {/* Changed w-screen, py, added px-4 and flex for centering */}
50-
<div className="max-w-3xl w-full mx-auto bg-white shadow-lg rounded-lg p-6 md:p-8"> {/* Removed ml-[34%], added w-full, adjusted padding */}
51-
<h2 className="text-2xl font-semibold text-gray-800 mb-6 text-center md:text-left">Student Marks & Attendance</h2> {/* Centered text on mobile */}
49+
<div className="min-h-screen bg-gray-100 w-full flex flex-col items-center justify-center py-12 md:py-16 px-4"> {/* Changed w-screen, py, added px-4 and flex for centering */}
50+
<div className="max-w-3xl w-full max-md:mt-10 mx-auto bg-white shadow-lg rounded-lg p-6 md:p-8"> {/* Removed ml-[34%], added w-full, adjusted padding */}
51+
<h2 className="text-2xl max-md:text-xl font-semibold text-gray-800 mb-6 text-center md:text-left">Student Marks & Attendance</h2> {/* Centered text on mobile */}
5252
<form onSubmit={handleSubmit} className="space-y-6">
5353
<div className="grid grid-cols-1 md:grid-cols-2 gap-4 md:gap-6"> {/* Adjusted gap */}
5454
<div className="flex flex-col">

‎admin/src/pages/Announcement.jsx

Lines changed: 11 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@ import { useState } from "react";
2020
import scholar from "../assets/scholar.png";
2121
import axios from "axios";
2222
import { toast } from "react-toastify";
23-
import SendIcon from "@mui/icons-material/Send";
23+
// import SendIcon from "@mui/icons-material/Send";
2424
import AppLayout from "../layout/AppLayout";
2525
const Announcement = () => {
2626
const [category, setCategory] = useState("");
@@ -71,10 +71,10 @@ const Announcement = () => {
7171
<div className="flex flex-col items-center justify-center"> {/* This parent ensures children can be centered or full width as needed */}
7272
<div className="text-center mb-5 w-full"> {/* Added w-full to allow content below to be properly centered or max-width constrained */}
7373
<div className="inline-flex flex-col sm:flex-row justify-center items-center gap-4 bg-white px-6 py-3 rounded-xl shadow-md border border-violet-100 max-w-xl mx-auto"> {/* Removed ml-56, added max-w-xl mx-auto, responsive flex direction */}
74-
<h1 className="text-2xl sm:text-3xl font-semibold text-violet-700"> {/* Removed ml-10, responsive text */}
74+
<h1 className="text-2xl sm:text-3xl font-semibold text-black max-md:text-xl"> {/* Removed ml-10, responsive text */}
7575
Post College Announcement
7676
</h1>
77-
<img className="w-12 h-12 sm:w-16 sm:h-16 object-contain" src={scholar} alt="Scholar icon" /> {/* Responsive image size */}
77+
<img className="w-12 max-md:hidden h-12 sm:w-16 sm:h-16 object-contain" src={scholar} alt="Scholar icon" /> {/* Responsive image size */}
7878
</div>
7979
</div>
8080

@@ -85,7 +85,7 @@ const Announcement = () => {
8585
name="announcement category"
8686
value={category}
8787
onChange={(e) => setCategory(e.target.value)}
88-
className="w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-violet-500 focus:border-transparent transition-all duration-200 bg-gray-50 hover:bg-gray-100"
88+
className="w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all duration-200 bg-gray-50 hover:bg-gray-100 outline-none"
8989
>
9090
<option value="chose">Choose Category </option>
9191
<option value="Exams">Exams</option>
@@ -110,7 +110,7 @@ const Announcement = () => {
110110
name="studentCourse"
111111
value={course}
112112
onChange={(e) => setCourse(e.target.value)}
113-
className="w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-violet-500 focus:border-transparent transition-all duration-200 bg-gray-50 hover:bg-gray-100"
113+
className="w-full p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all duration-200 bg-gray-50 hover:bg-gray-100 outline-none"
114114
required
115115
>
116116
<option value="Branch">Choose Course For Announcement</option>
@@ -137,7 +137,7 @@ const Announcement = () => {
137137
onChange={(e) => {
138138
setBranch(e.target.value);
139139
}}
140-
className="w-full outline-none p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-violet-500 focus:border-transparent transition-all duration-200 bg-gray-50 hover:bg-gray-100"
140+
className="w-full outline-none p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all duration-200 bg-gray-50 hover:bg-gray-100 "
141141
/>
142142

143143
<textarea
@@ -148,15 +148,15 @@ const Announcement = () => {
148148
}}
149149
placeholder="Enter Announcement Description"
150150
rows="6"
151-
className="w-full outline-none p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-violet-500 focus:border-transparent transition-all duration-200 bg-gray-50 hover:bg-gray-100 resize-none"
151+
className="w-full outline-none p-3 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-transparent transition-all duration-200 bg-gray-50 hover:bg-gray-100 resize-none"
152152
></textarea>
153153
</div>
154154

155155
<div className="flex gap-4 pt-4">
156156
<button
157157
type="submit"
158158
disabled={loading}
159-
className="flex-1 bg-gradient-to-r from-green-600 to-green-500 text-white py-3 px-6 rounded-lg font-medium hover:from-green-500 hover:to-green-400 transition-all duration-200 flex items-center justify-center gap-2 disabled:opacity-70"
159+
className="flex-1 bg-gradient-to-r from-green-600 to-green-500 text-white py-3 px-6 rounded-lg font-medium hover:from-green-500 hover:to-green-400 transition-all duration-200 flex items-center justify-center gap-2 disabled:opacity-70 max-md:p-2 "
160160
>
161161
{loading ? (
162162
<span className="flex items-center gap-2">
@@ -168,16 +168,16 @@ const Announcement = () => {
168168
</span>
169169
) : (
170170
<>
171-
Post Announcement
172-
<SendIcon sx={{ height: "20px" }} />
171+
Post
172+
{/* <SendIcon sx={{ height: "20px" }} className="max-md:hidden" /> */}
173173
</>
174174
)}
175175
</button>
176176

177177
<button
178178
onClick={handleClick}
179179
type="button"
180-
className="flex-1 bg-gradient-to-r from-blue-600 to-blue-500 text-white py-3 px-6 rounded-lg font-medium hover:from-blue-500 hover:to-blue-400 transition-all duration-200"
180+
className="flex-1 bg-gradient-to-r from-blue-600 to-blue-500 text-white py-3 px-6 rounded-lg font-medium hover:from-blue-500 hover:to-blue-400 transition-all duration-200 max-md:p-2 max-md:h-14"
181181
>
182182
Clear Form
183183
</button>

‎admin/src/pages/QuestionGenerator.jsx

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -121,19 +121,19 @@ const NotesUpload = () => {
121121
<div className="max-w-4xl mx-auto">
122122
{/* Header Section */}
123123
<div className="mb-10 text-center">
124-
<h1 className="text-3xl font-extrabold text-gray-900 sm:text-4xl tracking-tight mb-3">
124+
<h1 className="text-3xl max-md:mt-10 font-extrabold text-gray-900 sm:text-4xl tracking-tight mb-3">
125125
<span className="bg-clip-text text-transparent bg-gradient-to-r from-blue-600 to-indigo-600">
126126
PDF to Questions: Smart Question Generator
127127
</span>
128128
</h1>
129-
<p className="text-sm text-gray-600 max-w-2xl mx-auto">
129+
<p className="text-sm max-md:m-3 text-gray-600 max-w-2xl mx-auto">
130130
Quickly generate questions from your PDF notes with our AI-powered question generator.
131131

132132
</p>
133133
</div>
134134

135135
{/* Main Content */}
136-
<div className="bg-white rounded-2xl shadow-xl overflow-hidden">
136+
<div className="bg-white rounded-2xl max-md:h-[calc(100vh-300px)] shadow-xl overflow-hidden">
137137
{/* Upload Section */}
138138
<div className="p-8">
139139
<div
@@ -149,17 +149,17 @@ const NotesUpload = () => {
149149
onDrop={handleDrop}
150150
>
151151
{!pdfFile ? (
152-
<div className="space-y-6">
153-
<div className="flex justify-center">
154-
<div className="w-20 h-20 rounded-full bg-blue-100 flex items-center justify-center">
152+
<div className="space-y-6 ">
153+
<div className="flex justify-center ">
154+
<div className="w-20 h-20 max-md:h-[50%] rounded-full bg-blue-100 flex items-center justify-center">
155155
<Upload
156156
size={40}
157157
className="text-blue-600"
158158
/>
159159
</div>
160160
</div>
161161
<div>
162-
<p className="text-xl font-semibold text-gray-800">
162+
<p className="text-xl m font-semibold text-gray-800">
163163
Drag and drop your PDF file here
164164
</p>
165165
<p className="text-gray-500 mt-2">or</p>

‎admin/src/shared/Sidebar.jsx

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -77,12 +77,12 @@ const Sidebar = () => {
7777
<ul className="flex flex-col px-3 w-full h-full"> {/* Removed md:ml-10, added px-3 */}
7878
{/* Fixed Logo */}
7979
{/* Added p-4 and background to this sticky div. Note: p-4 on this div inside a px-3 ul means logo area has more effective padding. This could be adjusted if needed. */}
80-
<div className="sticky top-3 z-20 p-3 max-md:mt-10 max-md:w-[300px] rounded-full mb-8 border-blue-500 border "> {/* Added -mx-3 to make this div full-bleed against parent's px-3 */}
80+
<div className="sticky top-3 z-20 p-3 rounded-full mb-8 border-blue-500 border max-md:hidden "> {/* Added -mx-3 to make this div full-bleed against parent's px-3 */}
8181
<Logo />
8282
</div>
8383
{/* Scrollable nav items */}
84-
<div className="flex flex-col gap-5 overflow-y-auto hide-scrollbar flex-1 py-2"> {/* Removed px-4 */}
85-
<div className="flex gap-4">
84+
<div className="flex flex-col gap-5 overflow-y-auto hide-scrollbar flex-1 py-2 "> {/* Removed px-4 */}
85+
<div className="flex gap-4 max-md:mt-20 ">
8686
<li
8787
onClick={() => handleNavigation("/dashboard")}
8888
className={`list-style-none flex items-center gap-4 font-medium focus:bg-blue-400 p-3 w-full cursor-pointer hover:text-gray-700 transition-all duration-75 ${

0 commit comments

Comments
 (0)