Chore: housekeeping

src/UI/Base/DirectionIndicator.svelte

@@ -149,7 +149,7 @@
   >
     <div
       class={twMerge(
-        "absolute top-0 left-0 flex cursor-pointer items-center justify-center break-words text-xs",
+        "absolute left-0 top-0 flex cursor-pointer items-center justify-center break-words text-xs",
         size
       )}
     >
@@ -161,7 +161,7 @@
       </div>
     </div>
     {#if $bearingFromGps !== undefined}
-      <div class={twMerge("absolute top-0 left-0 rounded-full", size)}>
+      <div class={twMerge("absolute left-0 top-0 rounded-full", size)}>
         <Compass_arrow
           class={size}
           style={`transform: rotate( calc( 45deg + ${$bearingFromGps - ($compass ?? 0)}deg) );`}

src/UI/Base/FloatOver.svelte

@@ -13,7 +13,7 @@
 
 <!-- Draw the background over the total screen -->
 <div
-  class="absolute top-0 left-0 h-screen w-screen"
+  class="absolute left-0 top-0 h-screen w-screen"
   on:click={() => {
     console.log("OnClose")
     dispatch("close")
@@ -38,8 +38,8 @@
     </div>
     <slot name="close-button">
       <!-- The close button is placed _after_ the default slot in order to always paint it on top -->
-      <div class="absolute top-0 right-0">
-        <CloseButton class="normal-background mt-2 mr-2" on:click={() => dispatch("close")} />
+      <div class="absolute right-0 top-0">
+        <CloseButton class="normal-background mr-2 mt-2" on:click={() => dispatch("close")} />
       </div>
     </slot>
   </div>

src/UI/Base/Loading.svelte

@@ -6,7 +6,7 @@
 </script>
 
 <div class={cls}>
-  <div class="min-w-6 h-6 w-6 shrink-0 animate-spin self-center">
+  <div class="h-6 w-6 min-w-6 shrink-0 animate-spin self-center">
     <Loading />
   </div>
   <div class="ml-2">

src/UI/Base/LoginToggle.svelte

@@ -47,7 +47,7 @@
     {#if !hiddenFail}
       <slot name="error">
         <div class="alert flex flex-col items-center">
-          <div class="max-w-64 flex items-center">
+          <div class="flex max-w-64 items-center">
             <Invalid class="m-2 h-8 w-8 shrink-0" />
             <Tr t={offlineModes[$apiState] ?? t.loginFailedUnreachableMode} />
           </div>

src/UI/Base/ModalRight.svelte

@@ -11,7 +11,7 @@
 <div
   aria-modal="true"
   autofocus
-  class="normal-background absolute top-0 right-0 flex h-screen w-full flex-col overflow-y-auto drop-shadow-2xl md:w-6/12 lg:w-5/12 xl:w-4/12"
+  class="normal-background absolute right-0 top-0 flex h-screen w-full flex-col overflow-y-auto drop-shadow-2xl md:w-6/12 lg:w-5/12 xl:w-4/12"
   role="dialog"
   style="max-width: 100vw; max-height: 100vh; z-index: 11"
   tabindex="-1"

src/UI/Base/Searchbar.svelte

@@ -31,7 +31,7 @@
           inputElement?.select()
         }
       })
-    }else if(document.activeElement === inputElement){
+    } else if (document.activeElement === inputElement) {
       inputElement?.blur()
     }
   })

src/UI/Base/TitledPanel.svelte

@@ -1,7 +1,6 @@
 <div class="flex h-full flex-col">
   <div class="low-interaction flex items-center justify-between p-4 drop-shadow-md">
-
-    <div class="flex gap-x-2 items-center">
+    <div class="flex items-center gap-x-2">
       <slot name="title-start" />
       <h2 class="m-0">
         <slot name="title" />