From 36d129414b696bd2a633d379cac1dff867f64413 Mon Sep 17 00:00:00 2001
From: Armand Philippot <git@armandphilippot.com>
Date: Wed, 25 May 2022 15:49:31 +0200
Subject: fix(settings): reduce font-size on small devices

With French translation, words are a little longer so I reduce the
font size on small devices to avoid line breaking.
---
 src/components/organisms/forms/settings-form.tsx | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

(limited to 'src/components/organisms/forms/settings-form.tsx')

diff --git a/src/components/organisms/forms/settings-form.tsx b/src/components/organisms/forms/settings-form.tsx
index c897fa5..9c2cd2c 100644
--- a/src/components/organisms/forms/settings-form.tsx
+++ b/src/components/organisms/forms/settings-form.tsx
@@ -35,17 +35,26 @@ const SettingsForm: FC<SettingsFormProps> = ({
   });
 
   return (
-    <Form aria-label={ariaLabel} onSubmit={() => null}>
-      <ThemeToggle labelClassName={styles.label} />
-      <PrismThemeToggle labelClassName={styles.label} />
+    <Form
+      aria-label={ariaLabel}
+      itemsClassName={styles.items}
+      onSubmit={() => null}
+    >
+      <ThemeToggle className={styles.setting} labelClassName={styles.label} />
+      <PrismThemeToggle
+        className={styles.setting}
+        labelClassName={styles.label}
+      />
       <MotionToggle
+        className={styles.setting}
         labelClassName={styles.label}
         storageKey={motionStorageKey}
         value={false}
       />
       <AckeeSelect
+        className={styles.setting}
         initialValue="full"
-        labelClassName={styles.label}
+        labelClassName={`${styles.label} ${styles['label--select']}`}
         tooltipClassName={tooltipClassName}
         storageKey={ackeeStorageKey}
       />
-- 
cgit v1.2.3