Update switches layout (minmatarfleet#695)

* Hide mumble section and notifications for non fleet pilots * Update switches layout
beautifulmim · Sep 6, 2024 · 56fd147 · 56fd147
1 parent 98d6f2d
commit 56fd147
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 4 deletions.
diff --git a/frontend/app/src/components/blocks/SwitchSquare.astro b/frontend/app/src/components/blocks/SwitchSquare.astro
@@ -1,4 +1,5 @@
 ---
+import Flexblock from '@components/compositions/Flexblock.astro';
 import FluidFixed from '@components/compositions/FluidFixed.astro';
 import TextGroup from '@components/blocks/TextGroup.astro';
 
@@ -20,9 +21,12 @@ const {
 <label class="[ switch ][ w-full ]">
     <FluidFixed width='46px' breakpoint='80%' class="[ items-center ]">
         <div class="[ w-full ]">
-            <TextGroup title={label}>
-                {description}
-            </TextGroup>
+            <Flexblock gap='0'>
+                {label &&
+                    <span class="[ text-[var(--highlight)] ]">{label}</span>
+                }
+                <small {...attributes}>{description}</small>
+            </Flexblock>
         </div>
 
         <div>
@@ -91,6 +95,10 @@ const {
         [disabled] + .slider {
             filter: saturate(50%);
         }
+
+        small {
+            font-weight: 400;
+        }
     }
 
     .switch svg {

diff --git a/frontend/app/src/pages/account.astro b/frontend/app/src/pages/account.astro
@@ -262,7 +262,7 @@ const page_title = t('account.page_title');
                                     }
                                 }`}
                             >
-                                <TextGroup title={t('unregister_account')}>
+                                <TextGroup title={t('unregister_account')} gap='0'>
                                     {t('unregister_account_description')}
                                 </TextGroup>
                                 <Button