chore(next): installs merriweather as google font and removes static assets

2024-04-11 15:31:19 -04:00
parent 1119cf3af9
commit 432dfef435
15 changed files with 12 additions and 47 deletions
--- a/packages/next/src/layouts/Root/index.tsx
+++ b/packages/next/src/layouts/Root/index.tsx
@@ -22,6 +22,16 @@ export const metadata = {
  title: 'Next.js',
 }

+import { Merriweather } from 'next/font/google'
+
+const merriweather = Merriweather({
+  display: 'swap',
+  style: ['normal', 'italic'],
+  subsets: ['latin'],
+  variable: '--font-serif',
+  weight: ['400', '900'],
+})
+
 export const RootLayout = async ({
  children,
  config: configPromise,
@@ -82,7 +92,7 @@ export const RootLayout = async ({
  })

  return (
-    <html dir={dir} lang={languageCode}>
+    <html className={merriweather.variable} dir={dir} lang={languageCode}>
      <body>
        <RootProvider
          componentMap={componentMap}
--- a/packages/next/src/scss/app.scss
+++ b/packages/next/src/scss/app.scss
@@ -22,7 +22,6 @@
  --theme-baseline-body-size: #{$baseline-body-size};
  --font-body: 'Suisse Intl', system-ui;
  --font-mono: monospace;
-  --font-serif: 'Merriweather', serif;

  --style-radius-s: #{$style-radius-s};
  --style-radius-m: #{$style-radius-m};
--- a/packages/richtext-lexical/src/scss/app.scss
+++ b/packages/richtext-lexical/src/scss/app.scss
@@ -22,7 +22,6 @@
  --theme-baseline-body-size: #{$baseline-body-size};
  --font-body: 'Suisse Intl', system-ui;
  --font-mono: monospace;
-  --font-serif: 'Merriweather', serif;

  --style-radius-s: #{$style-radius-s};
  --style-radius-m: #{$style-radius-m};
--- a/packages/richtext-slate/src/scss/app.scss
+++ b/packages/richtext-slate/src/scss/app.scss
@@ -22,7 +22,6 @@
  --theme-baseline-body-size: #{$baseline-body-size};
  --font-body: 'Suisse Intl', system-ui;
  --font-mono: monospace;
-  --font-serif: 'Merriweather', serif;

  --style-radius-s: #{$style-radius-s};
  --style-radius-m: #{$style-radius-m};
--- a/packages/ui/src/assets/fonts/merriweather-v30-latin-900.woff
+++ b/packages/ui/src/assets/fonts/merriweather-v30-latin-900.woff
--- a/packages/ui/src/assets/fonts/merriweather-v30-latin-900.woff2
+++ b/packages/ui/src/assets/fonts/merriweather-v30-latin-900.woff2
--- a/packages/ui/src/assets/fonts/merriweather-v30-latin-900italic.woff
+++ b/packages/ui/src/assets/fonts/merriweather-v30-latin-900italic.woff
--- a/packages/ui/src/assets/fonts/merriweather-v30-latin-900italic.woff2
+++ b/packages/ui/src/assets/fonts/merriweather-v30-latin-900italic.woff2
--- a/packages/ui/src/assets/fonts/merriweather-v30-latin-italic.woff
+++ b/packages/ui/src/assets/fonts/merriweather-v30-latin-italic.woff
--- a/packages/ui/src/assets/fonts/merriweather-v30-latin-italic.woff2
+++ b/packages/ui/src/assets/fonts/merriweather-v30-latin-italic.woff2
--- a/packages/ui/src/assets/fonts/merriweather-v30-latin-regular.woff
+++ b/packages/ui/src/assets/fonts/merriweather-v30-latin-regular.woff
--- a/packages/ui/src/assets/fonts/merriweather-v30-latin-regular.woff2
+++ b/packages/ui/src/assets/fonts/merriweather-v30-latin-regular.woff2
--- a/packages/ui/src/scss/app.scss
+++ b/packages/ui/src/scss/app.scss
@@ -1,4 +1,3 @@
-@import 'fonts';
@import 'styles';
@import './toastify.scss';
@import './colors.scss';
@@ -22,7 +21,6 @@
  --theme-baseline-body-size: #{$baseline-body-size};
  --font-body: 'Suisse Intl', system-ui;
  --font-mono: monospace;
-  --font-serif: 'Merriweather', serif;

  --style-radius-s: #{$style-radius-s};
  --style-radius-m: #{$style-radius-m};
--- a/packages/ui/src/scss/fonts.scss
+++ b/packages/ui/src/scss/fonts.scss
@@ -33,43 +33,3 @@
  font-weight: bold;
  font-style: normal;
 }
-
-@font-face {
-  font-family: 'Merriweather';
-  font-style: normal;
-  font-weight: 400;
-  src:
-    local(''),
-    url('../assets/fonts/merriweather-v30-latin-regular.woff2') format('woff2'),
-    url('../assets/fonts/merriweather-v30-latin-regular.woff') format('woff');
-}
-
-@font-face {
-  font-family: 'Merriweather';
-  font-style: italic;
-  font-weight: 400;
-  src:
-    local(''),
-    url('../assets/fonts/merriweather-v30-latin-italic.woff2') format('woff2'),
-    url('../assets/fonts/merriweather-v30-latin-italic.woff') format('woff');
-}
-
-@font-face {
-  font-family: 'Merriweather';
-  font-style: normal;
-  font-weight: 900;
-  src:
-    local(''),
-    url('../assets/fonts/merriweather-v30-latin-900.woff2') format('woff2'),
-    url('../assets/fonts/merriweather-v30-latin-900.woff') format('woff');
-}
-
-@font-face {
-  font-family: 'Merriweather';
-  font-style: italic;
-  font-weight: 900;
-  src:
-    local(''),
-    url('../assets/fonts/merriweather-v30-latin-900italic.woff2') format('woff2'),
-    url('../assets/fonts/merriweather-v30-latin-900italic.woff') format('woff');
-}
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -161,4 +161,4 @@
    ".next/types/**/*.ts",
    "scripts/**/*.ts"
  ]
-}
+}