Update index.html

index.html

@@ -270,10 +270,10 @@
       const activeTimeSlotId = activeTimeSlotObj ? activeTimeSlotObj.id : null;
       
       const missedPeriods = currentTimeSlots.filter(slot => {
-        if (slot.id === 'R') return false; 
+        if (slot.id === 'R') return false;
         const hasEnded = currentHour > slot.endHour || (currentHour === slot.endHour && currentMin >= slot.endMin);
         return hasEnded && !teacherLogs[slot.id];
-      }).slice(0, 4);
+      });
 
       const classesTeacherStatus = CLASSES.map(cls => {
         const activeSlot = getCurrentActiveSlot(cls, currentHour, currentMin);
@@ -891,7 +891,7 @@
                       return (
                         <div key={slot.id} className={`bg-white md:bg-transparent rounded-xl border shadow-sm md:shadow-none p-4 md:p-3 md:grid md:grid-cols-[100px_100px_220px_1fr] md:gap-4 md:items-center transition-all ${
                           isCurrentActiveSlot 
-                            ? 'border-indigo-500 md:border-transparent md:border-l-4 md:border-l-indigo-500 bg-indigo-50/60 md:bg-indigo-50/80 shadow-md md:shadow-none md:rounded-none md:rounded-r-lg z-10 relative' 
+                            ? 'border-2 border-indigo-500 md:border-2 md:border-indigo-500 bg-indigo-100 md:bg-indigo-100 shadow-md ring-2 ring-indigo-300/50 z-10 relative' 
                             : isRecess 
                               ? 'border-slate-200 md:border-transparent bg-orange-50 md:bg-orange-50/50' 
                               : 'border-slate-200 md:border-transparent hover:bg-slate-50'
@@ -1118,4 +1118,4 @@
     root.render(<App />);
   </script>
 </body>
-</html>
+</html>