Add GitLab Sans and JetBrains Mono fonts

5 files changed, 48 insertions, 31 deletions

diff --git a/content/assets/stylesheets/_base.scss b/content/assets/stylesheets/_base.scss
index 36bfbce5..7683b247 100644
--- a/content/assets/stylesheets/_base.scss
+++ b/content/assets/stylesheets/_base.scss
@@ -16,17 +16,8 @@ body {
   color: $gray-800;
   display: flex;
   flex-flow: column;
-  font-size: 1rem;
-  font-family: $gl-regular-font;
-  line-height: 1.5;
   min-height: 100%;
   position: relative;
-  -webkit-font-smoothing: antialiased;
-
-  code {
-    font-size: 0.875rem;
-    font-family: $gl-monospace-font;
-  }
 }
 
 // Fluid images by default
diff --git a/content/assets/stylesheets/_landing.scss b/content/assets/stylesheets/_landing.scss
index 9550c8c4..b3ad0d86 100644
--- a/content/assets/stylesheets/_landing.scss
+++ b/content/assets/stylesheets/_landing.scss
@@ -341,7 +341,6 @@
     .title {
       font-weight: 600;
       font-size: 2rem;
-      font-family: 'Source Sans Pro', sans-serif;
     }
 
     .sub-title {
diff --git a/content/assets/stylesheets/_normalize.scss b/content/assets/stylesheets/_normalize.scss
index 68e76876..b791ad29 100644
--- a/content/assets/stylesheets/_normalize.scss
+++ b/content/assets/stylesheets/_normalize.scss
@@ -221,18 +221,6 @@ pre {
   overflow: auto;
 }
 
-/**
- * Address odd `em`-unit font size rendering in all browsers.
- */
-
-code,
-kbd,
-pre,
-samp {
-  font-family: monospace, monospace;
-  font-size: 1em;
-}
-
 /* Forms
    ========================================================================== */
 
diff --git a/content/assets/stylesheets/_typography.scss b/content/assets/stylesheets/_typography.scss
index 23f44916..0a4ff9ce 100644
--- a/content/assets/stylesheets/_typography.scss
+++ b/content/assets/stylesheets/_typography.scss
@@ -3,15 +3,55 @@
 @import 'mixins/md-typography';
 @import 'mixins/spacing';
 
+/*
+ * Font-face declarations copied from GitLab:
+ * https://gitlab.com/gitlab-org/gitlab/-/blob/master/app/assets/stylesheets/fonts.scss#L7
+ */
+@font-face {
+  font-family: 'GitLab Sans';
+  font-weight: 100 900;
+  font-style: normal;
+  font-named-instance: 'Regular'; /* stylelint-disable property-no-unknown */
+  src: url('../fonts/GitLabSans.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'JetBrains Mono';
+  font-display: optional;
+  font-style: normal;
+  src: url('../fonts/JetBrainsMono.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'JetBrains Mono';
+  font-display: optional;
+  font-weight: bold;
+  src: url('../fonts/JetBrainsMono-Bold.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'JetBrains Mono';
+  font-display: optional;
+  font-weight: normal;
+  font-style: italic;
+  src: url('../fonts/JetBrainsMono-Italic.woff2') format('woff2');
+}
+@font-face {
+  font-family: 'JetBrains Mono';
+  font-display: optional;
+  font-weight: bold;
+  font-style: italic;
+  src: url('../fonts/JetBrainsMono-BoldItalic.woff2') format('woff2');
+}
+
+/* https://gitlab.com/gitlab-org/gitlab/-/merge_requests/107592/ */
+* {
+  font-variant-ligatures: none;
+}
+
 .gl-docs {
   p,
   ul,
   ol,
   pre,
   blockquote {
-    font-size: 1rem;
-    font-weight: normal;
-    letter-spacing: normal;
     margin-top: 0;
     margin-bottom: 1.5em;
   }
@@ -181,7 +221,6 @@
   @include gl-font-regular;
   @include gl-font-weight-normal;
 
-  -webkit-font-smoothing: auto;
 
   h1,
   h2,
@@ -200,6 +239,7 @@
 
     code {
       font-size: inherit;
+      line-height: 1.35;
     }
   }
 
diff --git a/content/assets/stylesheets/_variables.scss b/content/assets/stylesheets/_variables.scss
index e1c00677..ec5a66be 100644
--- a/content/assets/stylesheets/_variables.scss
+++ b/content/assets/stylesheets/_variables.scss
@@ -264,11 +264,10 @@ $badge-saas: $orange-500;
 // Gl Markdown
 
 // Fonts
-$gl-monospace-font: 'Menlo', 'DejaVu Sans Mono', 'Liberation Mono', 'Consolas', 'Ubuntu Mono',
-  'Courier New', 'andale mono', 'lucida console', monospace;
-$gl-regular-font: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Noto Sans', Ubuntu,
-  Cantarell, 'Helvetica Neue', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
-  'Noto Color Emoji';
+$gl-monospace-font: 'JetBrains Mono', 'Menlo', 'DejaVu Sans Mono', 'Liberation Mono', 'Consolas',
+  'Ubuntu Mono', 'Courier New', 'andale mono', 'lucida console', monospace;
+$gl-regular-font: 'GitLab Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Noto Sans',
+  Ubuntu, Cantarell, 'Helvetica Neue', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol', 'Noto Color Emoji';
 
 $gl-fonts: (
   'monospace': $gl-monospace-font,