style: changed default font to Ubuntu

- site-wide default is Ubuntu, with system UI as fallback - minor update to docs Co-authored-by: Alex Sklar <[email protected]> Co-authored-by: Erik Margetis <[email protected]>
syncosaurus · Apr 25, 2024 · 5d5aed9 · 5d5aed9
1 parent e71a373
commit 5d5aed9
Show file tree

Hide file tree

Showing 12 changed files with 29 additions and 11 deletions.
diff --git a/docs/getting-started/requirements.md b/docs/getting-started/requirements.md
@@ -10,10 +10,9 @@ Before using Syncosaurus, ensure the following requirements are met:
 - [npm](https://www.npmjs.com/)
 - A frontend that utilizes [React](https://react.dev/) v16.8+
 - Paid Cloudflare account with access to [Durable Objects](https://developers.cloudflare.com/durable-objects/)
-- Access to the [Syncosaurus CLI](https://github.com/syncosaurus/syncosaurus-cli)
-  - This requirement can be fulfilled in two ways:
-    - *Recommended*: Use the [`npx`](https://www.npmjs.com/package/npx) feature to directly run Syncosaurus CLI commands without installing the Syncosaurus CLI application
-    - Alternatively, you may also install the Syncosaurus CLI locally:
-      ```shell
-      npm install -g syncosaurus-cli
-      ```
+- Access to the [Syncosaurus CLI](https://github.com/syncosaurus/syncosaurus-cli). This requirement can be fulfilled in two ways:
+  - *Recommended*: Use the [`npx`](https://www.npmjs.com/package/npx) feature to directly run Syncosaurus CLI commands without installing the Syncosaurus CLI application
+  - Alternatively, you may also install the Syncosaurus CLI locally:
+    ```shell
+    npm install -g syncosaurus-cli
+    ```
diff --git a/docs/guides/syncosaurus-cli.md b/docs/guides/syncosaurus-cli.md
@@ -10,11 +10,10 @@ The Syncosaurus CLI application is used to conveniently create, configure, manag
 
 - It is recommended to utilize the Syncosaurus CLI with `npx` commands, without having to install the application locally.
 - If you still wish to install the Syncosaurus CLI locally, run `npm install -g syncosaurus-cli`.
+  - If you are electing to run the Syncosaurus CLI locally, simply remove the `npx` at the beginning of the commands below.
 
 ## Setup and Development Commands
 
-If you are electing to run the Syncosaurus CLI locally, simply remove the `npx` at the beginning of the commands below.
-
 ### `syncosaurus init`
 
 - Create a new React application, pre-configured with a Syncosaurus multiplayer backend. Note that this command will create a `syncosaurus.json` configuration file in your root directory.

diff --git a/fonts/Ubuntu-Bold.ttf b/fonts/Ubuntu-Bold.ttf
diff --git a/fonts/Ubuntu-BoldItalic.ttf b/fonts/Ubuntu-BoldItalic.ttf
diff --git a/fonts/Ubuntu-Italic.ttf b/fonts/Ubuntu-Italic.ttf
diff --git a/fonts/Ubuntu-Light.ttf b/fonts/Ubuntu-Light.ttf
diff --git a/fonts/Ubuntu-LightItalic.ttf b/fonts/Ubuntu-LightItalic.ttf
diff --git a/fonts/Ubuntu-Medium.ttf b/fonts/Ubuntu-Medium.ttf
diff --git a/fonts/Ubuntu-MediumItalic.ttf b/fonts/Ubuntu-MediumItalic.ttf
diff --git a/fonts/Ubuntu-Regular.ttf b/fonts/Ubuntu-Regular.ttf
diff --git a/src/css/custom.css b/src/css/custom.css
@@ -20,6 +20,26 @@
   }
 }
 
+@layer base {
+  @font-face {
+    font-family: 'Ubuntu';
+    src: url("../../fonts/Ubuntu-Regular.ttf") format('ttf'),
+    url("../../fonts/Ubuntu-MediumItalic.ttf") format('ttf'),
+    url("../../fonts/Ubuntu-Medium.ttf") format('ttf'),
+    url("../../fonts/Ubuntu-LightItalic.ttf") format('ttf'),
+    url("../../fonts/Ubuntu-Light.ttf") format('ttf'),
+    url("../../fonts/Ubuntu-Italic.ttf") format('ttf'),
+    url("../../fonts/Ubuntu-BoldItalic.ttf") format('ttf'),
+    url("../../fonts/Ubuntu-Bold.ttf") format('ttf'),
+  }
+}
+
+@layer base {
+  html {
+    font-family: "Inter", system-ui, sans-serif;
+  }
+}
+
 /* You can override the default Infima variables here. */
 :root {
   --ifm-color-primary: #243d83;

diff --git a/tailwind.config.js b/tailwind.config.js
@@ -12,8 +12,8 @@ module.exports = {
   theme: {
     extend: {
       fontFamily: {
-        sans: ['"Inter"', ...fontFamily.sans],
-        jakarta: ['"Plus Jakarta Sans"', ...fontFamily.sans],
+        sans: ['"Ubuntu"', ...fontFamily.sans],
+        jakarta: ['"Ubuntu"', ...fontFamily.sans],
         mono: ['"Fira Code"', ...fontFamily.mono],
       },
       borderRadius: {