Merge pull request #33 from oasisprotocol/ml/fonts

Add fonts
oasisprotocol · Mar 14, 2024 · 35715a1 · 35715a1
2 parents 184aed2 + 314143a
commit 35715a1
Show file tree

Hide file tree

Showing 4 changed files with 31 additions and 2 deletions.
diff --git a/frontend/package.json b/frontend/package.json
@@ -15,6 +15,8 @@
     "node": ">=20"
   },
   "dependencies": {
+    "@fontsource-variable/figtree": "^5.0.20",
+    "@fontsource-variable/roboto-mono": "^5.0.18",
     "@metamask/detect-provider": "^2.0.0",
     "@metamask/jazzicon": "^2.0.0",
     "@oasisprotocol/dapp-voting-backend": "workspace:^",

diff --git a/frontend/src/components/ConnectedAccount/index.module.css b/frontend/src/components/ConnectedAccount/index.module.css
@@ -23,7 +23,7 @@
 
 .connectedAccountAddress {
   flex: 1 1 60%;
-  font-family: monospace;
+  font-family: 'Roboto Mono Variable', monospace;
   text-decoration: none;
   font-size: 22px;
   font-weight: 700;

diff --git a/frontend/src/index.css b/frontend/src/index.css
@@ -1,3 +1,6 @@
+@import '@fontsource-variable/figtree/index.css';
+@import '@fontsource-variable/roboto-mono/index.css';
+
 :root {
   --white: #fff;
   --palatinate-blue: #2c3bd5;
@@ -14,6 +17,16 @@
   --old-silver: #858486;
 }
 
+/** Use Figtree for "…" instead of Roboto Mono. */
+@font-face {
+  font-family: 'Roboto Mono Variable';
+  font-style: normal;
+  font-display: swap;
+  font-weight: 100 700;
+  src: url('@fontsource-variable/figtree/files/figtree-latin-wght-normal.woff2') format('woff2');
+  unicode-range: U+2026;
+}
+
 *,
 *::before,
 *::after {
@@ -22,7 +35,7 @@
 
 body {
   margin: 0;
-  font-family: Inter, system-ui, Avenir, Helvetica, Arial, sans-serif;
+  font-family: 'Figtree Variable', system-ui, sans-serif;
   font-size: 16px;
   font-style: normal;
   font-weight: normal;

diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml