From 666ef867560c3540dd69412cb45ef46fb8426694 Mon Sep 17 00:00:00 2001
From: percyfikri <mafikri27@gmail.com>
Date: Wed, 23 Oct 2024 13:16:39 +0700
Subject: [PATCH] Update : font size

---
 .../assessment/index.lazy.tsx                 | 38 +++++++++----------
 1 file changed, 19 insertions(+), 19 deletions(-)

diff --git a/apps/frontend/src/routes/_assessmentLayout/assessment/index.lazy.tsx b/apps/frontend/src/routes/_assessmentLayout/assessment/index.lazy.tsx
index 5930adb..3a1df60 100644
--- a/apps/frontend/src/routes/_assessmentLayout/assessment/index.lazy.tsx
+++ b/apps/frontend/src/routes/_assessmentLayout/assessment/index.lazy.tsx
@@ -447,7 +447,7 @@ export default function AssessmentPage() {
 
           {/* LEFT-SIDE */}
           {/* Aspek dan Sub-Aspek */}
-          <Flex direction="column" gap="xs" className="w-52">
+          <Flex direction="column" gap="xs" className="w-64">
             <div className="space-y-2">
               {/* Aspek */}
               {aspectsQuery.data?.data
@@ -465,7 +465,7 @@ export default function AssessmentPage() {
                       className="flex justify-between cursor-pointer"
                       onClick={() => toggleAspect(aspect.id)}
                     >
-                      <div className="text-lg font-bold px-3">{aspect.name}</div>
+                      <div className="text-sm font-bold px-3">{aspect.name}</div>
                       <div>
                         {openAspects[aspect.id] ? (
                           <TbChevronUp size={25} />
@@ -488,7 +488,7 @@ export default function AssessmentPage() {
                               className={`flex justify-between cursor-pointer p-2 px-6 rounded-sm transition-colors duration-150 ${selectedSubAspectId === subAspect.id ? 'text-black font-medium bg-gray-200' : 'text-gray-500'}`}
                               onClick={() => setSelectedSubAspectId(subAspect.id)}
                             >
-                              <div>{subAspect.name}</div>
+                              <div className="text-xs">{subAspect.name}</div>
                             </div>
                           ))}
                       </div>
@@ -503,9 +503,9 @@ export default function AssessmentPage() {
               <Text className="text-2xl font-bold ml-6">
                 Harap menjawab semua pertanyaan yang tersedia
               </Text>
-              <Text className="text-gray-400 ml-6">Semua jawaban Anda akan ditinjau</Text>
+              <Text className="text-gray-400 ml-6 mb-7">Semua jawaban Anda akan ditinjau</Text>
               {filteredQuestions.length === 0 ? (
-                <Text color="black" className="text-center p-3">
+                <Text className="text-center p-3">
                   Pertanyaan tidak ada untuk sub-aspek yang dipilih.
                 </Text>
               ) : (
@@ -524,7 +524,7 @@ export default function AssessmentPage() {
                           {/* Question */}
                           <Text className="font-bold mx-3 p-1">{startIndex + index + 1}.</Text>
                           <div className="flex-grow">
-                            <Text className="font-bold break-words">
+                            <Text className="font-bold break-words text-sm">
                               {question.questionText}
                             </Text>
                           </div>
@@ -565,13 +565,13 @@ export default function AssessmentPage() {
 
                         {/* Opsi Radio Button */}
                         {question.options?.length > 0 ? (
-                          <div className="mx-12">
+                          <div className="mx-11">
                             <Radio.Group value={answers[question.questionId] || ""}>
-                              <div className="flex flex-col gap-4">
+                              <div className="flex flex-col gap-2">
                                 {question.options.map((option: any) => (
                                   <label
                                     key={option.optionId}
-                                    className={`cursor-pointer transition-transform transform hover:scale-105 shadow-md hover:shadow-lg flex items-center border rounded-lg p-4 ${
+                                    className={`cursor-pointer transition-transform transform hover:scale-105 shadow-md hover:shadow-lg flex items-center border rounded-lg p-3 text-sm ${
                                       answers[question.questionId] === option.optionId 
                                         ? "bg-blue-500 text-white"
                                         : "bg-gray-200 text-black"
@@ -583,7 +583,7 @@ export default function AssessmentPage() {
                                       className="font-bold"
                                       value={option.optionId}
                                       label={option.optionText}
-                                      size="md"
+                                      size="xs"
                                       radius="xl"
                                       style={{ pointerEvents: "none" }}
                                       checked={answers[question.questionId] === option.optionId} // Untuk menampilkan jawaban yang sudah dipilih
@@ -599,7 +599,7 @@ export default function AssessmentPage() {
                         )}
 
                         {/* Textarea */}
-                        <div className="mx-12">
+                        <div className="mx-11">
                           <Textarea
                             placeholder="Berikan keterangan terkait jawaban di atas"
                             value={validationInformation[question.questionId] || ""}
@@ -609,7 +609,7 @@ export default function AssessmentPage() {
                         </div>
 
                         {/* File Upload */}
-                        <div className="mx-12">
+                        <div className="mx-11">
                           {question.needFile === true && (
                             <div
                               className={`pt-5 pb-5 pr-5 pl-5 border-2 rounded-lg border-dashed ${dragActive ? "bg-gray-100" : "bg-transparent"
@@ -662,7 +662,7 @@ export default function AssessmentPage() {
 
                         {/* Garis pembatas setiap soal */}
                         <div>
-                          <hr className="border-t-2 border-gray-300 mx-12 mt-6 mb-6" />
+                          <hr className="border-t-2 border-gray-300 mx-11 mt-6 mb-6" />
                         </div>
                       </Stack>
                     </div>
@@ -686,7 +686,7 @@ export default function AssessmentPage() {
                 return (
                   <div key={questionId} className="flex justify-center relative">
                     <button
-                      className={`w-10 h-10 border rounded-lg flex items-center justify-center relative
+                      className={`w-9 h-9 border rounded-sm flex items-center justify-center relative text-md
                         ${flaggedQuestions[questionId] ? "text-black" : "bg-transparent text-black"}`}
                       onClick={() => scrollToQuestion(questionId)}
                     >
@@ -718,8 +718,8 @@ export default function AssessmentPage() {
                     {filteredAspects.length > 0 ? (
                       filteredAspects.map((aspect) => (
                         <div key={aspect.aspectId} className="flex justify-between items-center">
-                          <Text className="text-xl text-gray-400">{aspect.aspectName}</Text>
-                          <Text className="text-xl font-bold">
+                          <Text className="text-base text-gray-400">{aspect.aspectName}</Text>
+                          <Text className="text-base font-bold">
                             {parseFloat(aspect.averageScore).toFixed(2)}
                           </Text>
                         </div>
@@ -739,8 +739,8 @@ export default function AssessmentPage() {
                     {filteredSubAspects.length > 0 ? (
                       filteredSubAspects.map((subAspect) => (
                         <div key={subAspect.subAspectId} className="flex justify-between items-center"> {/* Change key to 'id' */}
-                          <Text className="text-lg text-gray-400">{subAspect.subAspectName}</Text> {/* Change to 'name' */}
-                          <Text className="text-lg font-bold">
+                          <Text className="text-sm text-gray-400">{subAspect.subAspectName}</Text> {/* Change to 'name' */}
+                          <Text className="text-sm font-bold">
                             {parseFloat(subAspect.averageScore).toFixed(2)}
                           </Text>
                         </div>
@@ -753,7 +753,7 @@ export default function AssessmentPage() {
 
                 {/* Tombol Selesai */}
                 <div className="mt-6">
-                  <button onClick={handleFinishClick} className="bg-blue-500 text-white font-bold rounded-md py-2 w-full">
+                  <button onClick={handleFinishClick} className="bg-blue-500 text-white font-bold rounded-md py-2 w-full text-sm">
                     Selesai
                   </button>
                 </div>