generated from muhtadeetaron/nextjs-template
fix(ui): improve ui/ux and visibility
This commit is contained in:
@ -100,7 +100,7 @@ export default function MockScreen() {
|
||||
<h1 className="text-2xl font-semibold my-5">
|
||||
{user?.preparation_unit}
|
||||
</h1>
|
||||
<div className="border border-[#c0dafc] flex flex-col gap-4 w-full rounded-[25px] p-4">
|
||||
<div className="border border-[#c0dafc]/50 flex flex-col gap-4 w-full rounded-[25px] p-3">
|
||||
{mocks.length > 0 ? (
|
||||
mocks.map((mocks) => (
|
||||
<div key={mocks.test_id}>
|
||||
@ -110,11 +110,11 @@ export default function MockScreen() {
|
||||
`/exam/pretest?type=mock&test_id=${mocks.test_id}`
|
||||
)
|
||||
}
|
||||
className="w-full border-2 border-[#B0C2DA] py-4 rounded-[10px] px-6 space-y-2 text-left hover:bg-gray-50 transition-colors"
|
||||
className="w-full border-1 border-[#B0C2DA] py-3 rounded-[10px] px-6 space-y-2 text-left hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<h3 className="text-xl font-medium">{mocks.name}</h3>
|
||||
<h3 className="text-lg font-medium">{mocks.name}</h3>
|
||||
<div className="flex space-x-2">
|
||||
<p className="text-md font-normal bg-slate-500 w-fit px-3 py-1 rounded-full text-white">
|
||||
<p className="text-sm font-normal bg-slate-500 w-fit px-3 py-1 rounded-full text-white">
|
||||
{mocks.unit}
|
||||
</p>
|
||||
</div>
|
||||
|
||||
@ -6,7 +6,7 @@ import Header from "@/components/Header";
|
||||
import DestructibleAlert from "@/components/DestructibleAlert";
|
||||
import BackgroundWrapper from "@/components/BackgroundWrapper";
|
||||
import { API_URL, getToken } from "@/lib/auth";
|
||||
import { Loader, RefreshCw } from "lucide-react";
|
||||
import { Loader, RefreshCw, Star, StarHalf } from "lucide-react";
|
||||
import { useAuthStore } from "@/stores/authStore";
|
||||
|
||||
type Subject = {
|
||||
@ -91,11 +91,11 @@ export default function PaperScreen() {
|
||||
<BackgroundWrapper>
|
||||
<div>
|
||||
<Header displayTabTitle="Subjects" />
|
||||
<div className="mx-10 pt-10 overflow-y-auto">
|
||||
<div className="mx-10 pt-5 overflow-y-auto">
|
||||
<h1 className="text-2xl font-semibold mb-5">
|
||||
{user?.preparation_unit}
|
||||
</h1>
|
||||
<div className="border border-[#c0dafc] flex flex-col gap-4 w-full rounded-[25px] p-4">
|
||||
<div className="border border-[#c0dafc]/50 flex flex-col gap-4 w-full rounded-[20px] p-3">
|
||||
{subjects.length > 0 ? (
|
||||
subjects
|
||||
.filter((subject) => subject.unit === user?.preparation_unit)
|
||||
@ -107,10 +107,15 @@ export default function PaperScreen() {
|
||||
`/exam/pretest?type=subject&test_id=${subject.subject_id}`
|
||||
)
|
||||
}
|
||||
className="w-full border-2 border-[#B0C2DA] py-4 rounded-[10px] px-6 space-y-2 text-left hover:bg-gray-50 transition-colors"
|
||||
className="w-full border-1 border-[#B0C2DA] py-4 rounded-[10px] px-6 space-y-2 text-left hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<h3 className="text-xl font-medium">{subject.name}</h3>
|
||||
<p className="text-md font-normal">Rating: 8/10</p>
|
||||
<p className="text-md font-normal flex">
|
||||
<Star size={17} />
|
||||
<Star size={17} />
|
||||
<Star size={17} />
|
||||
<Star size={17} />
|
||||
</p>
|
||||
</button>
|
||||
</div>
|
||||
))
|
||||
|
||||
@ -99,7 +99,7 @@ export default function TopicScreen() {
|
||||
<h1 className="text-2xl font-semibold my-5">
|
||||
{user?.preparation_unit}
|
||||
</h1>
|
||||
<div className="border border-[#c0dafc] flex flex-col gap-4 w-full rounded-[25px] p-4">
|
||||
<div className="border border-[#c0dafc]/50 flex flex-col gap-4 w-full rounded-[20px] p-3">
|
||||
{topics.length > 0 ? (
|
||||
topics.map((topic) => (
|
||||
<div key={topic.topic_id}>
|
||||
@ -109,16 +109,13 @@ export default function TopicScreen() {
|
||||
`/exam/pretest?type=topic&test_id=${topic.topic_id}`
|
||||
)
|
||||
}
|
||||
className="w-full border-2 border-[#B0C2DA] py-4 rounded-[10px] px-6 space-y-2 text-left hover:bg-gray-50 transition-colors"
|
||||
className="w-full border-1 border-[#B0C2DA] py-3 rounded-[10px] px-6 space-y-2 text-left hover:bg-gray-50 transition-colors"
|
||||
>
|
||||
<h3 className="text-xl font-medium">{topic.name}</h3>
|
||||
<h3 className="text-lg font-medium">{topic.name}</h3>
|
||||
<div className="flex space-x-2">
|
||||
<p className="text-md font-normal bg-slate-500 w-fit px-3 py-1 rounded-full text-white">
|
||||
<p className="text-sm font-normal bg-slate-500 w-fit px-3 py-1 rounded-full text-white">
|
||||
{topic.subject.name}
|
||||
</p>
|
||||
<p className="text-md font-normal bg-slate-500 w-fit px-3 py-1 rounded-full text-white">
|
||||
{topic.subject.unit}
|
||||
</p>
|
||||
</div>
|
||||
</button>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user