Add Inter font

CodeEditApp · Mar 3, 2023 · 05be927 · 05be927
1 parent 60b3652
commit 05be927
Show file tree

Hide file tree

Showing 8 changed files with 536 additions and 547 deletions.
diff --git a/components/common/Button.jsx b/components/common/Button.jsx
@@ -9,7 +9,7 @@ const Button = styled.a`
   line-height: 1.17648;
   font-weight: 400;
   letter-spacing: -.022em;
-  font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
+  font-family: "Inter","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
   min-width: 28px;
   padding-left: 16px;
   padding-right: 16px;
@@ -26,7 +26,7 @@ const Button = styled.a`
     line-height: 1.33337;
     font-weight: 400;
     letter-spacing: -.01em;
-    font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
+    font-family: "Inter","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
     min-width: 23px;
     padding-left: 11px;
     padding-right: 11px;

diff --git a/components/common/ColorSchemeToggle.jsx b/components/common/ColorSchemeToggle.jsx
@@ -12,7 +12,7 @@ const ColorSchemeToggleWrap = styled.div`
   line-height: 1.33337;
   font-weight: 400;
   letter-spacing: -.01em;
-  font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
+  font-family: "Inter","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
   border: 1px solid var(--toggle-color-fill);
   border-radius: var(--toggle-border-radius-outer, 2px);
   display: inline-flex;

diff --git a/components/common/Footer.jsx b/components/common/Footer.jsx
@@ -11,7 +11,7 @@ const FooterWrap = styled.footer`
   line-height: 1.33337;
   font-weight: 400;
   letter-spacing: -.01em;
-  font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
+  font-family: "Inter","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
   overflow: hidden;
   position: relative;
   z-index: 1;

diff --git a/components/common/Header.jsx b/components/common/Header.jsx
@@ -38,7 +38,7 @@ const Title = styled.h2`
   line-height: 1.14286;
   font-weight: 600;
   letter-spacing: .011em;
-  font-family: "SF Pro Display","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
+  font-family: "Inter","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
   cursor: default;
   display: block;
   margin: 0;

diff --git a/components/common/Ribbon.jsx b/components/common/Ribbon.jsx
@@ -32,7 +32,7 @@ const RibbonContent = styled.div`
   line-height: 1.42859;
   font-weight: 400;
   letter-spacing: -.016em;
-  font-family: "SF Pro Text","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
+  font-family: "Inter","SF Pro Icons","Helvetica Neue","Helvetica","Arial",sans-serif;
 `;
 
 function Ribbon({ children, onClick, ...props }) {

diff --git a/components/common/Tile.jsx b/components/common/Tile.jsx
@@ -52,15 +52,15 @@ const TileHeadline = styled(Typography).attrs({ as: "h4" })`
     line-height: 1.1904761905;
     font-weight: 600;
     letter-spacing: .011em;
-    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
+    font-family: Inter,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
     ${({ overlay }) => overlay ? `` : `color: var(--section-accent-color);`}
 `;
 const TileCopy = styled(Typography)`
     font-size: 19px;
     line-height: 1.4211026316;
     font-weight: 600;
     letter-spacing: .012em;
-    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
+    font-family: Inter,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
     ${TileHeadline} + & {
       margin-top: 0.3em;
     }
@@ -76,7 +76,7 @@ const TileViolator = styled.div`
   line-height: 1.1764805882;
   font-weight: 400;
   letter-spacing: -0.022em;
-  font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
+  font-family: Inter,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
   border-radius: 18px;
   padding: 7px 18px;
 
@@ -85,7 +85,7 @@ const TileViolator = styled.div`
   line-height: 1.3333733333;
   font-weight: 400;
   letter-spacing: -0.01em;
-  font-family: SF Pro Text,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
+  font-family: Inter,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
   border-radius: 12px;
   padding: 3px 11px;
 
@@ -209,7 +209,7 @@ const OverlayCopy = styled.div`
     line-height: 1.4211026316;
     font-weight: 600;
     letter-spacing: .012em;
-    font-family: SF Pro Display,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
+    font-family: Inter,SF Pro Icons,Helvetica Neue,Helvetica,Arial,sans-serif;
 
     color: #fff;
 

diff --git a/styles/globals.css b/styles/globals.css
@@ -46,7 +46,7 @@ body {
   width: 100%;
   padding: 0;
   margin: 0;
-  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen,
+  font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Inter, Roboto, Oxygen,
     Ubuntu, Cantarell, Fira Sans, Droid Sans, Helvetica Neue, sans-serif;
 }
 

diff --git a/yarn.lock b/yarn.lock