Use monospace system font

symfony · Sep 16, 2023 · fb94f66 · fb94f66
1 parent 7412bd2
commit fb94f66
Show file tree

Hide file tree

Showing 5 changed files with 6 additions and 4 deletions.
diff --git a/ux.symfony.com/assets/styles/_variables.scss b/ux.symfony.com/assets/styles/_variables.scss
@@ -16,3 +16,5 @@ $green: #84DE2C;
 $primary: #222 !default;
 
 $size-unit: calc(8px + 1.5625vw);
+
+$font-family-monospace: var(--font-family-code);
diff --git a/ux.symfony.com/assets/styles/app/_root.scss b/ux.symfony.com/assets/styles/app/_root.scss
@@ -16,7 +16,7 @@
   // Fonts
   //  --font-family-title: "Inter";
   --font-family-text: "Inter";
-  // --font-family-code: "Inter";
+  --font-family-code: ui-monospace, "SF Mono", SFMono-Regular, 'Cascadia Code', 'Source Code Pro', Menlo, Consolas, 'DejaVu Sans Mono', monospace;
 
   // Colors
   --color-primary: var(--bs-body-color);

diff --git a/ux.symfony.com/assets/styles/components/_Terminal.scss b/ux.symfony.com/assets/styles/components/_Terminal.scss
@@ -76,7 +76,7 @@
 .Terminal_body {
     background-color: $n-800;
     height: 100%;
-    font-family: 'Space Mono', monospace;
+    font-family: var(--font-family-code);
     font-size: 14px;
     line-height: 160%;
     color: #FFF;

diff --git a/ux.symfony.com/assets/styles/components/_TerminalCommand.scss b/ux.symfony.com/assets/styles/components/_TerminalCommand.scss
@@ -34,7 +34,7 @@
   background: transparent;
   z-index: 4;
   outline: none;
-  font-family: var(--bs-font-monospace);
+  font-family: var(--font-family-code);
   font-size: .9rem;
   padding: 0 .5rem;
   width: inherit;

diff --git a/ux.symfony.com/templates/base.html.twig b/ux.symfony.com/templates/base.html.twig
@@ -12,7 +12,7 @@
         <meta name="color-scheme" content="light dark">
         <link rel="preconnect" href="https://fonts.googleapis.com" />
         {% block stylesheets %}
-            <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:200,400,600|Playfair+Display:400,700i|Space+Mono|Ubuntu:400,700&display=swap">
+            <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Inter:200,400,600|Playfair+Display:400,700i|Ubuntu:400,700&display=swap">
             {{ ux_controller_link_tags() }}
             <link rel="stylesheet" href="{{ asset('styles/app.scss') }}">
         {% endblock %}