Merge style sheets for light and dark themes into a single resource

This will avoid having inline style, which is annoying for stricter CSP.
It should improve performances, as there is only a single file to load.
As a bonus, I also included resource fingerprinting, which will avoid breaking
the cache when it's not needed, and adds subresource integrity checksum.

assets/css/dark.css

@@ -1,3 +1,4 @@
+/* dark.css */ 
 --font-color: #eee;
 --bg-color: #212121;
 

assets/css/light.css

@@ -1,4 +1,5 @@
 :root {
+   /* light.css */ 
     --font-color: #333;
     --bg-color: #fff;
 
@@ -11,7 +12,7 @@
 
     --pre-color: #333;
     --pre-bg-color: #f1f1f1;
-    
+
     --bq-color: #ccc;
     --hr-color: #ccc;
 

assets/css/main.css

@@ -1,3 +1,24 @@
+{{ $light := resources.Get "css/light.css" }}
+{{ $dark := resources.Get "css/dark.css" }}
+
+{{ $light.Content }}
+
+{{ if eq site.Params.style "dark-without-switcher" }}
+:root {
+    {{ $dark.Content }}
+}
+{{ else if eq site.Params.style "auto-without-switcher" }}
+@media (prefers-color-scheme: dark) {
+    :root {
+        {{ $dark.Content }}
+    }
+}
+{{else }}
+[data-theme="dark"] {
+    {{ $dark.Content }}
+}
+{{ end }}
+
 /* Basic */
 html {
     font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
@@ -123,7 +144,7 @@ th, td {
 
 /* Code */
 pre {
-    color: var(--pre-color)
+    color: var(--pre-color);
     background-color: var(--pre-bg-color);
     padding: 1em;
     max-width: 100%;

layouts/partials/cssColors.html

@@ -1,18 +0,0 @@
-<style>
-{{ if eq site.Params.style "dark-without-switcher" }}
-    :root {
-        {{ partial "dark.css" . | safeCSS }}
-    }
-{{ else if eq site.Params.style "auto-without-switcher" }}
-    @media (prefers-color-scheme: dark) {
-        :root {
-            {{ partial "dark.css" . | safeCSS }}
-        }
-        
-    }
-{{else }}
-    [data-theme="dark"] {   
-        {{ partial "dark.css" . | safeCSS }}
-    }
-{{ end }}
-</style>

layouts/partials/head.html

@@ -14,9 +14,9 @@
 <link rel="icon" type="image/x-icon" href="{{ "favicon.ico" | absURL }}">
 <link rel="apple-touch-icon-precomposed" href="{{ "favicon.png" | absURL }}">
 
-<link rel="stylesheet" href="{{ "css/light.css" | absURL }}?rnd={{ now.Unix }}" />
+{{ $cssTemplate := resources.Get "css/main.css" }}
-{{ partial "cssColors.html" }}
+{{ $style := $cssTemplate | resources.ExecuteAsTemplate "css/style.css" . | resources.ToCSS  | resources.Fingerprint "sha256" }}
-<link rel="stylesheet" href="{{ "css/style.css" | absURL }}?rnd={{ now.Unix }}" />
+<link rel="stylesheet" href="{{ $style.Permalink }}" integrity="{{ $style.Data.Integrity }}">
 
 {{ range .Site.Params.customCSS -}}
 <link rel="stylesheet" href="{{ . | absURL }}?rnd={{ now.Unix }}">
@@ -39,4 +39,4 @@
     {{ template "_internal/google_analytics_async.html" . }}
 {{ end }}
 
-{{ partial "head-extra.html" . }}
+{{ partial "head-extra.html" . }}