diff options
| author | Michael Hunteman <michael@huntm.net> | 2024-09-19 16:44:44 -0700 |
|---|---|---|
| committer | Michael Hunteman <michael@huntm.net> | 2024-09-19 16:44:44 -0700 |
| commit | 33b26d0f5e4e88c2f45b968608bd6893c9187173 (patch) | |
| tree | ac3e8bdec4fc9262a1d835bb2d3bf5cd05c381af | |
| parent | 23b2d7e472445a614aa27919fe676bb99816e19a (diff) | |
Use playwrite font
| -rw-r--r-- | client/index.html | 1 | ||||
| -rw-r--r-- | client/src/ThemeContextProvider.tsx | 35 |
2 files changed, 35 insertions, 1 deletions
diff --git a/client/index.html b/client/index.html index 567658b..968bc13 100644 --- a/client/index.html +++ b/client/index.html @@ -3,6 +3,7 @@ <head> <meta charset="UTF-8" /> <link rel="icon" href="/avatar.png" /> + <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Playwrite+US+Trad:wght@100..400&display=swap" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Madison and Michael's Wedding</title> </head> diff --git a/client/src/ThemeContextProvider.tsx b/client/src/ThemeContextProvider.tsx index b5972d7..1b2e3b4 100644 --- a/client/src/ThemeContextProvider.tsx +++ b/client/src/ThemeContextProvider.tsx @@ -45,7 +45,40 @@ function ThemeContextProvider({ children }: ThemeProviderProps) { }, }); - const theme = useMemo(() => createTheme(getDesignTokens(mode)), [mode]); + const colorTheme = createTheme(getDesignTokens(mode)); + + const theme = useMemo( + () => + createTheme({ + ...colorTheme, + typography: { + fontFamily: ['Playwrite US Trad', 'cursive'].join(','), + button: { + textTransform: 'none', + }, + body1: { + lineHeight: 1.8, + }, + }, + components: { + MuiInputBase: { + defaultProps: { + sx: { + fontFamily: 'Roboto, sans-serif', + }, + }, + }, + MuiInputLabel: { + defaultProps: { + sx: { + fontFamily: 'Roboto, sans-serif', + }, + }, + }, + }, + }), + [mode] + ); return ( <ThemeContext.Provider value={{ toggleColorMode }}> |