update: index.lazy change color using bg primary from index.css

This commit is contained in:
abiyasa05 2024-10-31 15:08:33 +07:00
parent b52a07eb42
commit ab6c448361

View File

@ -14,6 +14,7 @@ import {
CardDescription,
CardHeader,
} from "@/shadcn/components/ui/card";
import { Button } from "@/shadcn/components/ui/button";
import { Textarea } from "@/shadcn/components/ui/textarea";
import { Label } from "@/shadcn/components/ui/label";
import { RadioGroup, RadioGroupItem } from "@/shadcn/components/ui/radio-group";
@ -697,10 +698,10 @@ export default function AssessmentPage() {
{question.options.map((option: any) => (
<div
key={option.optionId}
className={`cursor-pointer transition-transform transform hover:scale-105 shadow-md hover:shadow-lg flex items-center border rounded-lg p-3 text-sm ${
className={`cursor-pointer transition-transform transform hover:scale-105 shadow-md hover:shadow-lg flex items-center border-4 rounded-lg p-3 text-sm ${
answers[question.questionId] === option.optionId
? "bg-blue-500 text-white"
: "bg-gray-200 text-black"
? "bg-[--primary-color] text-white border-[--primary-color]"
: "bg-gray-200 text-black border-gray-200"
}`}
onClick={() => handleAnswerChange(question.questionId, option.optionId)}
>
@ -708,7 +709,7 @@ export default function AssessmentPage() {
value={option.optionId}
id={option.optionId}
checked={answers[question.questionId] === option.optionId}
className="bg-white checked:bg-white checked:border-blue-500 pointer-events-none rounded-full"
className="bg-white checked:bg-white checked:border-[--primary-color] pointer-events-none rounded-full"
/>
<Label
htmlFor={option.optionId}
@ -830,7 +831,7 @@ export default function AssessmentPage() {
<button
className={`w-9 h-9 border rounded-sm flex items-center justify-center relative text-md
${answers[questionId] && flaggedQuestions[questionId] ? "bg-white text-black" : ""}
${answers[questionId] && !flaggedQuestions[questionId] ? "bg-blue-500 text-white" : ""}
${answers[questionId] && !flaggedQuestions[questionId] ? "bg-[--primary-color] text-white" : ""}
${!answers[questionId] && !flaggedQuestions[questionId] ? "bg-transparent text-black" : ""}
${flaggedQuestions[questionId] ? "border-gray-50" : ""}`}
onClick={() => scrollToQuestion(questionId)}
@ -864,7 +865,7 @@ export default function AssessmentPage() {
<div className="mt-4">
<Card>
<CardHeader>
<Text className="font-extrabold text-center">Nilai Sementara</Text>
<Text className="text-lg font-extrabold text-center">Nilai Sementara</Text>
</CardHeader>
<CardContent>
@ -876,9 +877,9 @@ export default function AssessmentPage() {
return (
<div key={aspect.aspectId} className="flex justify-between items-center">
<Text className="text-base text-gray-400">{aspect.aspectName}</Text>
<Text className="text-lg text-gray-700">{aspect.aspectName}</Text>
<Text
className={`text-base font-bold ${
className={`text-lg font-bold ${
aspectScoreValue >= 4.01
? "text-green-700"
: aspectScoreValue >= 3.01
@ -896,7 +897,7 @@ export default function AssessmentPage() {
);
})
) : (
<Text className="text-base text-gray-400">Data aspek ini kosong</Text>
<Text className="text-base text-gray-700">Data aspek ini kosong</Text>
)}
</CardDescription>
@ -910,8 +911,8 @@ export default function AssessmentPage() {
const subAspectScoreValue = parseFloat(subAspectScore);
return (
<div key={subAspect.subAspectId} className="flex justify-between items-center">
<Text className="text-sm text-gray-400">{subAspect.subAspectName}</Text>
<div key={subAspect.subAspectId} className="flex justify-between items-center my-2">
<Text className="text-sm text-gray-700">{subAspect.subAspectName}</Text>
<Text
className={`text-sm font-bold ${
subAspectScoreValue >= 4.01
@ -931,19 +932,19 @@ export default function AssessmentPage() {
);
})
) : (
<Text className="text-sm text-gray-400">Data sub-aspek ini kosong</Text>
<Text className="text-sm text-gray-700">Data sub-aspek ini kosong</Text>
)}
</CardContent>
{/* Tombol Selesai */}
<div className="mt-4 mb-4 ml-4 mr-4">
<button
<div className="pt-4">
<Button
onClick={handleFinishClick}
className="bg-blue-500 text-white font-bold rounded-md py-2 w-full text-sm"
className="bg-[--primary-color] text-white font-bold rounded-md w-full text-sm"
>
Selesai
</button>
</Button>
</div>
</CardContent>
{/* Modal untuk konfirmasi selesai asesmen */}
<FinishAssessmentModal