improve layout for allergy information (#1206)

* style(Participant): improve layout and accessibility for allergy information and attendance checkbox

* chore(CHANGELOG): update layout improvements for participant details in event management

CHANGELOG.md

@@ -13,9 +13,11 @@
 ## Neste versjon
 
 - 🎨 **Designendringer**. Kalenderen på arrangementer er oppdatert
+- 🎨 **Designendringer**. Forbedret layout for deltakerdetaljer i arrangementsadministrasjonen
 - ⚡ **Ytelse** Optimaliserte ytelsen ved å fjerne unødvendige oppdateringer av navigasjonsbaren.
 
 ## Versjon 2025.15.01
+
 - ⚡ **Kopier link**. Man kan nå kopiere forkortede linker.
 - ⚡ **Allergier for påmeldte medlemmer**. Admins kan nå se allergier for påmeldte medlemmer på arrangementer.
 - 🦟 **Markdown**. Markdown renderer fungerer nå som normalt.
@@ -24,13 +26,15 @@
 - 🦟 **Bøter**. Oppdater antall bøter ved endring av lovbrudd.
 
 ## Versjon 2024.04.11
-- 🎨 **Designendringer**. Gjort høyden på alle ulike gallerier lik, uavhengig av lengde på beskrivelse. 
+
+- 🎨 **Designendringer**. Gjort høyden på alle ulike gallerier lik, uavhengig av lengde på beskrivelse.
 - 🎨 **Designendringer**. Escapet beskrivelse i galleri
 - 🎨 **Desingendring**. Sentrerte og flyttet "Last in mer" knappen under bildene i galleri.
 - ⚡ **Event**. Arrangementadministrasjonen vil kunne filtrere deltakere etter år, studie, allergier, betalingsstatus (kun betalte arrangementer) og oppmøte.
 
 ## Versjon 2024.04.11
-- 🎨 **Designendringer**. Gjort høyden på alle ulike gallerier lik, uavhengig av lengde på beskrivelse. 
+
+- 🎨 **Designendringer**. Gjort høyden på alle ulike gallerier lik, uavhengig av lengde på beskrivelse.
 - 🎨 **Designendringer**. Escapet beskrivelse i galleri
 - 🎨 **Desingendring**. Sentrerte og flyttet "Last in mer" knappen under bildene i galleri.
 - ⚡ **Event**. Arrangementadministrasjonen vil kunne filtrere deltakere etter år, studie, allergier, betalingsstatus (kun betalte arrangementer) og oppmøte.

src/pages/EventAdministration/components/Participant.tsx

@@ -100,12 +100,12 @@ const Participant = ({ registration, eventId }: ParticipantProps) => {
                 {registration.user_info.first_name} {registration.user_info.last_name}
               </h1>
               <h1 className='text-sm hidden md:block'>{getUserAffiliation(registration.user_info)}</h1>
-              <div className='text-muted-foreground'>
+              <div className='text-muted-foreground '>
                 {registration.user_info.allergy !== '' ? (
                   <>
                     <div className='flex gap-1 items-center'>
-                      <NutOff className='w-3.5 h-3.5 stroke-[1.5px] text-muted-foreground float-left' />
-                      <span className='float-right'>{registration.user_info.allergy}</span>
+                      <NutOff className='w-3.5 h-3.5 stroke-[1.5px] text-muted-foreground float-left shrink-0' />
+                      <span className='break-words line-clamp-1'> {registration.user_info.allergy}</span>
                     </div>
                   </>
                 ) : (
@@ -154,7 +154,7 @@ const Participant = ({ registration, eventId }: ParticipantProps) => {
 
             {!registration.is_on_wait && (
               <label
-                className='w-full md:w-auto flex flex-row items-start space-x-3 space-y-0 rounded-md border p-4 cursor-pointer hover:border-primary'
+                className='w-full md:w-auto flex flex-row items-start space-x-3 space-y-0 rounded-md border p-4 cursor-pointer hover:border-primary shrink-0'
                 htmlFor={registration.user_info.user_id}>
                 <Checkbox checked={checkedState} id={registration.user_info.user_id} onCheckedChange={(checked) => handleAttendedCheck(Boolean(checked))} />
                 <div className='space-y-1 leading-none'>