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.

1 files changed, 15 insertions, 0 deletions

diff --git a/src/components/organisms/forms/settings-form.module.scss b/src/components/organisms/forms/settings-form.module.scss
index a6a2077..a05c60c 100644
--- a/src/components/organisms/forms/settings-form.module.scss
+++ b/src/components/organisms/forms/settings-form.module.scss
@@ -2,10 +2,25 @@
 
 .label {
   margin-right: auto;
+}
 
+.setting,
+.label--select {
   @include mix.media("screen") {
+    @include mix.dimensions(null, "2xs") {
+      font-size: var(--font-size-sm);
+    }
+
     @include mix.dimensions(null, "2xs", "height") {
       font-size: var(--font-size-sm);
     }
   }
 }
+
+.items {
+  @include mix.media("screen") {
+    @include mix.dimensions(null, "2xs", "height") {
+      margin: var(--spacing-2xs) 0;
+    }
+  }
+}