layouts/partials/head-style.html


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

<!-- Main CSS -->
{{ $main := resources.Get "scss/main.scss" | resources.ExecuteAsTemplate "css/main.scss" . | toCSS | minify }}
<link rel="stylesheet" href="{{ $main.RelPermalink }}">


<!-- If JS is disabled -->
<noscript>

  {{ $lightAccent  := .Site.Params.Style.lightAccent  | default .Site.Data.default.style.lightAccent }}
  {{ $darkAccent   := .Site.Params.Style.darkAccent   | default .Site.Data.default.style.darkAccent }}

  {{ if .Site.Params.Style.ignoreSystemSettings }}

    {{ if .Site.Params.Style.isDark }}
      <meta name="theme-color" content="{{ $darkAccent }}">
    {{ else }}
      <meta name="theme-color" content="{{ $lightAccent }}">
    {{ end }}

  {{ else }}
    <meta name="theme-color" content="{{ $darkAccent }}" media="(prefers-color-scheme: dark)">
    <meta name="theme-color" content="{{ $lightAccent }}" media="(prefers-color-scheme: light)">
  {{ end }}

  <style>
  
    html {
      --accent: {{ if .Site.Params.Style.isDark }}{{ $darkAccent }}{{ else }}{{ $lightAccent }}{{ end }};
    }
  
    .req-js {
      display: none;
    }
    
  </style>
  
</noscript>