SOEOPSFY24-206 | add ds sans font

SU-SOE · Oct 2, 2024 · bfd021f · bfd021f
1 parent c934f47
commit bfd021f
Show file tree

Hide file tree

Showing 4 changed files with 13 additions and 13 deletions.
diff --git a/app/components/Typography/Text.tsx b/app/components/Typography/Text.tsx
@@ -14,7 +14,7 @@ export type TypographyProps = {
   variant?: types.TextVariantType;
   leading?: types.FontLeadingType;
   /**
-   * If true, use default tracking for the font - for Druk and Druk Wide
+   * If true, use default tracking for the font - for DM Sans
    */
   useDefaultTracking?: boolean;
   italic?: boolean;
@@ -38,10 +38,10 @@ export const Text = ({
   color = 'default',
   variant,
   leading,
-  useDefaultTracking = font === 'druk-wide',
+  useDefaultTracking = font === 'ds-sans',
   italic,
   srOnly,
-  uppercase = font === 'druk',
+  uppercase = font === 'ds-sans',
   icon,
   iconProps,
   className,
@@ -66,7 +66,7 @@ export const Text = ({
           srOnly ? 'sr-only' : '',
           uppercase ? 'uppercase' : '',
           useDefaultTracking ? 'tracking-normal' : '',
-          font === 'druk' ? 'tracking-normal sm:tracking-wide' : '',
+          font === 'ds-sans' ? 'tracking-normal sm:tracking-wide' : '',
           className,
         )
       }

diff --git a/app/components/Typography/typography.styles.ts b/app/components/Typography/typography.styles.ts
@@ -1,6 +1,7 @@
 export const fontFamilies = {
   sans: 'font-sans',
   serif: 'font-serif',
+  'ds-sans': 'font-ds-sans',
 };
 
 export const fontWeights = {

diff --git a/app/layout.tsx b/app/layout.tsx
@@ -1,21 +1,20 @@
 import './globals.css';
 import localFont from 'next/font/local';
-import { Source_Sans_3, Source_Serif_4 } from 'next/font/google';
+import { Source_Sans_3, DM_Sans } from 'next/font/google';
 import { cnb } from 'cnbuilder';
 
-
-const source_sans = Source_Sans_3({
+const dm_sans = DM_Sans({
   subsets: ['latin'],
   style: ['italic','normal'],
   display: 'swap',
-  variable: '--font-source-sans',
+  variable: '--font-dm-sans',
 });
 
-const source_serif = Source_Serif_4({
+const source_sans = Source_Sans_3({
   subsets: ['latin'],
   style: ['italic','normal'],
   display: 'swap',
-  variable: '--font-source-serif',
+  variable: '--font-source-sans',
 });
 
 const stanford = localFont({
@@ -33,8 +32,8 @@ export default function RootLayout({
     <html lang="en">
       <body
         className={cnb(
+          dm_sans.variable,
           source_sans.variable,
-          source_serif.variable,
           stanford.variable,
         )}
       >

diff --git a/app/page.tsx b/app/page.tsx
@@ -1,9 +1,9 @@
-import { TimelineBanner } from './components/TimelineBanner';
+import { Heading } from './components/Typography';
 
 export default function Home() {
   return (
     <div className="grid grid-rows-[20px_1fr_20px] items-center justify-items-center min-h-screen p-8 pb-20 gap-16 sm:p-20 font-[family-name:var(--font-geist-sans)]">
-      <TimelineBanner />
+     <Heading>SOE Centennial</Heading>
     </div>
   );
 }