CLASSROOMIO-T-85: Fixed the height and background issues

Merge-request: CLASSROOMIO-MR-23
Merged-by: Best Admin <[email protected]>

Co-authored-by: Ifeanyi Nwosu <[email protected]>

src/lib/components/LMS/components/Learning.svelte

@@ -24,7 +24,9 @@
 
 <section class="h-full mt-10 mb-20 xl:mt-2">
   <p class="text-base font-semibold text-[#040F2D] pb-3 dark:text-white">Currently Learning</p>
-  <Box className="w-full h-full border-2 border-[#EAEAEA] gap-10 rounded">
+  <Box
+    className="w-full border-2 border-[#EAEAEA]  dark:bg-gray-700 h-[516px] overflow-y-auto gap-10 rounded"
+  >
     {#if courseInProgress === false}
       <div class="flex flex-col items-center">
         <CoursesEmptyIcon />

src/lib/components/LMS/components/Student.svelte

@@ -32,7 +32,7 @@
   <p class="text-base font-semibold text-[#040F2D] pb-3 dark:text-white">Your Schedule</p>
 
   <Box
-    className="p-5 border-2 border-[#EAEAEA] gap-5 rounded w-full h-fit xl:h-full flex flex-col justify-start"
+    className="p-5 border-2 border-[#EAEAEA]  dark:bg-gray-700 gap-5 rounded w-full h-[516px] overflow-y-auto  flex flex-col justify-start"
   >
     <div class="w-full hidden xl:flex items-center justify-center">
       <InlineCalendar bind:store {theme} />

src/routes/lms/+page.svelte

@@ -44,7 +44,7 @@
       <Learning />
     </div>
     <Box
-      className="w-full xl:w-[400px] h-full bg-[#F5F8FE] dark:bg-gray-500 flex items-center justify-center my-20 xl:mt-11 p-2"
+      className="w-full xl:w-[400px] h-[516px] overflow-y-auto bg-[#F5F8FE] dark:bg-gray-700 flex items-center justify-center my-20 xl:mt-11 p-2"
     >
       <div
         class="w-full h-full flex flex-col md:flex-row xl:flex-col items-center md:items-center xl:items-start gap-5 md:justify-around"