chore: add a Layout component

It defines the different components used by all other layouts.

3 files changed, 7 insertions, 21 deletions

diff --git a/src/styles/base/_fonts.scss b/src/styles/base/_fonts.scss
index 88850bb..c8695d4 100644
--- a/src/styles/base/_fonts.scss
+++ b/src/styles/base/_fonts.scss
@@ -139,32 +139,32 @@
   --font-family-mono: #{var.$font-family_mono};
   --font-size-sm: clamp(
     #{math.div(var.font-size("sm"), 1.2)},
-    1ex + 1vw,
+    2ex + 1vmin,
     #{var.font-size("sm")}
   );
   --font-size-md: clamp(
     #{var.font-size("sm")},
-    1ex + 2vw,
+    2ex + 2vmin,
     #{var.font-size("md")}
   );
   --font-size-lg: clamp(
     #{var.font-size("md")},
-    1ex + 3vw,
+    2ex + 3vmin,
     #{var.font-size("lg")}
   );
   --font-size-xl: clamp(
     #{var.font-size("lg")},
-    1ex + 4vw,
+    2ex + 4vmin,
     #{var.font-size("xl")}
   );
   --font-size-2xl: clamp(
     #{var.font-size("xl")},
-    1ex + 5vw,
+    2ex + 5vmin,
     #{var.font-size("2xl")}
   );
   --font-size-3xl: clamp(
     #{var.font-size("2xl")},
-    1ex + 6vw,
+    2ex + 6vmin,
     #{var.font-size("3xl")}
   );
   --line-height: #{var.$line-height};
diff --git a/src/styles/base/_helpers.scss b/src/styles/base/_helpers.scss
index d28811c..3879643 100644
--- a/src/styles/base/_helpers.scss
+++ b/src/styles/base/_helpers.scss
@@ -28,17 +28,11 @@
     display: block;
     width: auto;
     height: auto;
-    padding: var(--spacing-xs) var(--spacing-sm);
     left: var(--spacing-2xs);
     top: var(--spacing-xs);
     z-index: 100000;
-    background: var(--color-primary);
-    box-shadow: fun.convert-px(2) fun.convert-px(2) fun.convert-px(2) 0
-      var(--color-shadow-dark);
     clip: auto !important;
     color: var(--color-fg-inverted);
-    font-size: var(--font-size-md);
-    font-weight: 600;
   }
 }
 
diff --git a/src/styles/base/_spacings.scss b/src/styles/base/_spacings.scss
index 08c3c3f..7c8b210 100644
--- a/src/styles/base/_spacings.scss
+++ b/src/styles/base/_spacings.scss
@@ -24,13 +24,5 @@
   --spacing-xl: clamp(#{var.spacing("lg")}, 1ex + 4vw, #{var.spacing("xl")});
   --spacing-2xl: clamp(#{var.spacing("xl")}, 1ex + 5vw, #{var.spacing("2xl")});
   --spacing-3xl: clamp(#{var.spacing("2xl")}, 1ex + 6vw, #{var.spacing("3xl")});
-  --toolbar-size: #{fun.convert-px(65)};
-}
-
-@include mix.media("screen") {
-  @include mix.dimensions("sm") {
-    :root {
-      --toolbar-size: 0px;
-    }
-  }
+  --toolbar-size: #{fun.convert-px(80)};
 }