From 0118dd1738c690524e1f041dfb82b1999ccc8438 Mon Sep 17 00:00:00 2001
From: Sander Eikemo Andreassen <seandreassen04@gmail.com>
Date: Thu, 7 Nov 2024 11:15:44 +0100
Subject: [PATCH] refactor: change table spacing to use classname instead of
 index

---
 src/app/[locale]/(default)/shift-schedule/layout.tsx  | 2 +-
 src/app/[locale]/(default)/shift-schedule/loading.tsx | 8 ++++----
 src/components/shift-schedule/AdministratorMenu.tsx   | 2 +-
 src/components/shift-schedule/ScheduleTable.tsx       | 8 ++++----
 4 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/app/[locale]/(default)/shift-schedule/layout.tsx b/src/app/[locale]/(default)/shift-schedule/layout.tsx
index 7425732..8aa4078 100644
--- a/src/app/[locale]/(default)/shift-schedule/layout.tsx
+++ b/src/app/[locale]/(default)/shift-schedule/layout.tsx
@@ -16,7 +16,7 @@ export default async function ShiftScheduleLayout({
 
   return (
     <>
-      <h1 className='mb-4 text-center'>{t('title')}</h1>
+      <h1 className='text-center'>{t('title')}</h1>
       {children}
     </>
   );
diff --git a/src/app/[locale]/(default)/shift-schedule/loading.tsx b/src/app/[locale]/(default)/shift-schedule/loading.tsx
index 2dce3c0..7086b1d 100644
--- a/src/app/[locale]/(default)/shift-schedule/loading.tsx
+++ b/src/app/[locale]/(default)/shift-schedule/loading.tsx
@@ -63,9 +63,9 @@ export default function ShiftScheduleLayout() {
   return (
     <>
       {/* Table shown on small screens */}
-      <div className='sm:hidden'>
-        {days.map((day, index) => (
-          <Table key={day} className={index === 0 ? '' : 'mt-8'}>
+      <div className='sm:hidden [&>div]:mt-8'>
+        {days.map((day) => (
+          <Table key={day}>
             <TableHeader>
               <TableRow>
                 <TableHead className='w-2/5'>{t('time')}</TableHead>
@@ -94,7 +94,7 @@ export default function ShiftScheduleLayout() {
       </div>
 
       {/* Table shown on all other screens */}
-      <Table className='hidden sm:table'>
+      <Table className='mt-8 hidden sm:table'>
         <TableHeader>
           <TableRow>
             <TableHead className='w-1/6'>{t('time')}</TableHead>
diff --git a/src/components/shift-schedule/AdministratorMenu.tsx b/src/components/shift-schedule/AdministratorMenu.tsx
index 6037a5f..6b05a89 100644
--- a/src/components/shift-schedule/AdministratorMenu.tsx
+++ b/src/components/shift-schedule/AdministratorMenu.tsx
@@ -25,7 +25,7 @@ function AdministratorMenu({ t }: AdministratorMenuProps) {
     <Collapsible
       open={isOpen}
       onOpenChange={setIsOpen}
-      className='mx-auto xs:mx-8 my-8 rounded border p-3'
+      className='mx-auto xs:mx-8 mt-8 rounded border p-3'
     >
       <div className='mx-1 flex justify-between'>
         <span className='my-auto font-semibold text-xl'>{t.label}</span>
diff --git a/src/components/shift-schedule/ScheduleTable.tsx b/src/components/shift-schedule/ScheduleTable.tsx
index e26996c..a438008 100644
--- a/src/components/shift-schedule/ScheduleTable.tsx
+++ b/src/components/shift-schedule/ScheduleTable.tsx
@@ -86,9 +86,9 @@ function ScheduleTable({ week }: ScheduleTableProps) {
   return (
     <>
       {/* Table shown on small screens */}
-      <div className='sm:hidden'>
-        {days.map((day, index) => (
-          <Table key={day} className={index === 0 ? '' : 'mt-8'}>
+      <div className='sm:hidden [&>div]:mt-8'>
+        {days.map((day) => (
+          <Table key={day}>
             <TableHeader>
               <TableRow>
                 <TableHead className='w-2/5'>{t('time')}</TableHead>
@@ -121,7 +121,7 @@ function ScheduleTable({ week }: ScheduleTableProps) {
       </div>
 
       {/* Table shown on all other screens */}
-      <Table className='hidden sm:table'>
+      <Table className='mt-8 hidden sm:table'>
         <TableHeader>
           <TableRow>
             <TableHead className='w-1/6'>{t('time')}</TableHead>