diff options
| author | William Carroll <wpcarro@gmail.com> | 2020-10-11T09·09+0100 |
|---|---|---|
| committer | William Carroll <wpcarro@gmail.com> | 2020-10-11T09·09+0100 |
| commit | 106457de4b5fc8172ce302eaa61c7625150e67a1 (patch) | |
| tree | 943ccd885152a3bd2bb803295b09c838f1dee362 /scratch/habit-screens/client/index.html | |
| parent | 19fbdad1c0a93fbc177fdb1ae97354aa3bec4f9f (diff) | |
Prefer handwritten font
Use the Google Fonts API to fetch a handwritten font, which gives the app a modicum of personality. There are more "best practices" ways to do this, such as: - Download the font once, and include it in the bundle - Extend the Tailwind configure to recognize the font - Ditch the inline <style> block But I don't need the performance benefits that the first bullet provides. And the second two bullets are more relevant for a larger application with more than one font. So I think in this case, the easiest solution is best. Also: - Use `container` and `mx-auto` to constrain content for wide screens
Diffstat (limited to 'scratch/habit-screens/client/index.html')
| -rw-r--r-- | scratch/habit-screens/client/index.html | 8 |
1 files changed, 7 insertions, 1 deletions
diff --git a/scratch/habit-screens/client/index.html b/scratch/habit-screens/client/index.html index bdc421ee3f..b587e09012 100644 --- a/scratch/habit-screens/client/index.html +++ b/scratch/habit-screens/client/index.html @@ -3,7 +3,13 @@ <head> <meta charset="UTF-8" /> <title>Elm SPA</title> - <link rel="stylesheet" href="./output.css" /> + <link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Chilanka"> + <link rel="stylesheet" href="./output.css"> + <style> + body { + font-family: 'Chilanka'; + } + </style> <script src="./Main.min.js"></script> </head> <body> |