Fixed some bugs

src/components/EventsView.jsx

@@ -3,12 +3,13 @@
 //
 
 import { differenceInMinutes, format, startOfDay } from 'date-fns'
-import { it } from 'date-fns/locale'
 
 import _ from 'lodash'
 import { useEffect, useRef, useState } from 'preact/hooks'
 import { layoutIntervals } from '../interval-layout.js'
 
+const WEEK_DAYS = ['Domenica', 'Lunedì', 'Martedì', 'Mercoledì', 'Giovedì', 'Venerdì', 'Sabato']
+
 function hashString(str, seed = 0) {
     let h1 = 0xdeadbeef ^ seed,
         h2 = 0x41c6ce57 ^ seed
@@ -53,12 +54,10 @@ const WorkWeekView = ({ events }) => {
         )
     )
 
-    const weekDays = ['Lunedì', 'Martedì', 'Mercoledì', 'Giovedì', 'Venerdì']
-
     return (
         <div class="work-week-h-view">
             <div class="week">
-                {weekDays.map((label, index) => (
+                {WEEK_DAYS.slice(1, 6).map((label, index) => (
                     <div class="day" style={{ '--size': rowLayouts[index + 1]?.length ?? 0 }}>
                         {label}
                     </div>
@@ -156,8 +155,6 @@ const WorkWeekVerticalView = ({ events, selection, setSelection, hideOtherCourse
         )
     )
 
-    const weekDays = ['Lunedì', 'Martedì', 'Mercoledì', 'Giovedì', 'Venerdì']
-
     const [currentlyHovered, setCurrentlyHovered] = useState(null)
     const element = useRef()
 
@@ -227,7 +224,7 @@ const WorkWeekVerticalView = ({ events, selection, setSelection, hideOtherCourse
             </div>
             {Object.values(dayIntervalLayout).map((layout, index) => (
                 <div class="day" style={{ '--size': layout.length }}>
-                    <div class="top-header">{weekDays[index]}</div>
+                    <div class="top-header">{WEEK_DAYS[index + 1]}</div>
                     <div class="events">
                         {layout.map((events, stackIndex) => (
                             <>
@@ -336,7 +333,7 @@ const CourseView = ({ events, selection, setSelection, hideOtherCourses }) => {
                         <div class="events">
                             {courseEvents.map(course => (
                                 <div>
-                                    {_.capitalize(format(course.start, 'EEEE', { locale: it }))}{' '}
+                                    {WEEK_DAYS[course.start.getDay()]}{' '}
                                     {format(course.start, 'H:mm')} &ndash;
                                     {format(course.end, 'H:mm')} {course.aula}
                                 </div>

src/styles/main.scss

@@ -38,7 +38,7 @@ html {
     --accent-900: #244624;
 }
 
-$device-s-width: 420px;
+$device-s-width: 500px;
 
 // Elements
 
@@ -761,6 +761,7 @@ body {
                     align-self: center;
 
                     position: relative;
+                    top: 0.5px;
                     left: -0.5rem;
                     width: calc(100% + 1rem);