Update font styles and add Google Fonts to improve typography. Now using "Bricolage Grotesque' and 'Carroius Gothic SC'.

Author: gusper

assets/css/custom.css

@@ -1,15 +1,15 @@
 /* Better fonts */
 * {
-    font-family: colfax-web, open sans, segoe ui, sans-serif;
+    font-family: 'bricolage grotesque', colfax-web, open sans, segoe ui, sans-serif;
 }
 
 h1, h2, h3, h4, h5, h6 {
-    font-family: Adelle, Georgia, serif;
+    font-family: 'Carrois Gothic SC',Adelle, Georgia, serif;
     margin-bottom: 0.15rem;
 }
 
 .archive__heading {
-    font-family: Adelle, Georgia, serif;
+    font-family: 'Carrois Gothic SC',Adelle, Georgia, serif;
     font-size: 3rem;
 }
 
@@ -19,7 +19,7 @@ h1, h2, h3, h4, h5, h6 {
 }
 
 .sidebar__introduction-title a {
-    font-family: Adelle, Georgia, serif;
+    font-family: 'Carrois Gothic SC',Adelle, Georgia, serif;
     font-size: 5rem;
     text-transform: none;
 }

config.toml

@@ -18,7 +18,10 @@ customCss = ["css/custom.css"]
 gtagId = "G-F3BD84Q92C"
 enableRobotsTXT = true
 favicon = "favicons/"
-
+googleFonts = [
+  "Bricolage+Grotesque:opsz,wght@12..96,200..800",
+  "Carrois+Gothic+SC"
+]
 [[params.socialIcons]]
 icon = "fa-brands fa-bluesky"
 title = "Bluesky"

layouts/partials/head.html

@@ -130,7 +130,6 @@
       <link href="{{ $url }}" rel="stylesheet" />
     {{- end -}}
 
-  
     <!-- Favicons -->
     <link rel="shortcut icon" href="{{ .Site.Params.favicon | relURL }}favicon.ico" type="image/x-icon" />
     <link rel="apple-touch-icon" sizes="180x180" href="{{ .Site.Params.favicon | relURL }}apple-touch-icon.png" />