Parcourir la source

feat(themes): implement new font sizing system

Specify `font_size` as s, m, or l in `params.toml`.
Font size is now a site setting rather than theme setting.

Also:

Be less strict on user input of theme and font set names - allow lower
or upper case as well as spaces.
Fall back to Minimal theme and font set on user input error.
Keep category icon on same line as category links, otherwise context
lost.
Change search-header position in modal now that it overlays entire page
*including* navbar.
George Cushen il y a 6 ans
Parent
commit
aa13a4d28c

+ 4 - 0
assets/sass/academic/_content.scss

@@ -118,6 +118,10 @@ article .article-metadata {
   color: $sta-primary;
 }
 
+.article-categories {
+  white-space: nowrap; /* Keep category icon on same line as category links, otherwise context lost. */
+}
+
 .middot-divider {
   padding-right: .45em;
   padding-left: .45em;

+ 1 - 6
assets/sass/academic/_search.scss

@@ -47,16 +47,11 @@
 .search-header {
   position: -webkit-sticky;
   position: sticky;
-  top: 70px;  /* Navbar height. */
+  top: 0;
   background-color: $sta-background;
   padding-top: 2rem;
   padding-bottom: 1rem;
 }
-@media screen and (max-width: 1200px) {
-  .search-header {
-    top: 50px;  /* Navbar height. */
-  }
-}
 
 .dark .search-header {
   background-color: $sta-dark-background;

+ 1 - 0
assets/sass/main.scss

@@ -1,5 +1,6 @@
 {{- $scr := .Scratch -}}
 {{- $site := $scr.Get "site" -}}
+{{/* Don't use partialCached as can error when admin changes theme config whilst `hugo server` is running. */}}
 {{- partial "functions/parse_theme" . -}}
 
 $sta-darken-percentage: 10%;

+ 11 - 6
layouts/partials/functions/parse_theme.html

@@ -1,7 +1,15 @@
 {{- $scr := .Scratch -}}
 
+{{- $theme_index := (site.Params.theme | lower | replaceRE "\\s" "_") | default "minimal" -}}
+{{- $font_index := (index site.Data.themes $theme_index).font_theme | default (site.Params.font | lower | replaceRE "\\s" "_") | default $theme_index | default "minimal" -}}
+
+{{- $font_size := site.Params.font_size | default "m" -}}
+{{- $font_sizes := dict "s" 16 "m" 21 "l" 25 -}}
+{{- $font_size_numeric := (index $font_sizes $font_size) | default (index $font_sizes "m") -}}
+{{- $scr.Set "font_size" $font_size_numeric -}}
+{{- $scr.Set "font_size_small" (mul 0.77 $font_size_numeric) -}}
+
 {{/* Attempt to load font style specified by user. */}}
-{{- $font_index := site.Params.font | default "default" -}}
 {{ if (index site.Data.fonts $font_index) }}
   {{- $font := index site.Data.fonts $font_index -}}
   {{- $scr.Set "google_fonts" $font.google_fonts -}}
@@ -9,14 +17,11 @@
   {{- $scr.Set "heading_font" $font.heading_font -}}
   {{- $scr.Set "nav_font" $font.nav_font -}}
   {{- $scr.Set "mono_font" $font.mono_font -}}
-  {{- $scr.Set "font_size" $font.font_size -}}
-  {{- $scr.Set "font_size_small" $font.font_size_small -}}
 {{ else }}
-  {{ errorf "The `%s` font theme was not found! Check that the `font` option in `config/_default/params.toml` matches the name of an installed font theme." $font_index }}
+  {{ errorf "The `%s` font set was not found! Check that the `font` option in `config/_default/params.toml` matches the name of an installed font set." $font_index }}
 {{ end }}
 
 {{/* Attempt to load color theme specified by user. */}}
-{{- $theme_index := site.Params.color_theme | default "default" -}}
 {{ if (index site.Data.themes $theme_index) }}
   {{ $theme := index site.Data.themes $theme_index }}
 
@@ -49,5 +54,5 @@
   {{- $scr.Set "menu_title" $theme.menu_title -}}
 
 {{ else }}
-  {{ errorf "The `%s` color theme was not found! Check that the `color_theme` option in `config/_default/params.toml` matches the name of an installed color theme." $theme_index }}
+  {{ errorf "The `%s` color theme was not found! Check that the `theme` option in `config/_default/params.toml` matches the name of an installed color theme." $theme_index }}
 {{ end }}