From 4a5c56bdb7106723c9d65ea57666119f6a5a64cd Mon Sep 17 00:00:00 2001
From: Michael Boelen <michael.boelen@cisofy.com>
Date: Sun, 21 May 2023 00:42:05 +0200
Subject: [PATCH] Mogelijkheid om SCSS-bestanden op te splitsen,
 integrity-waarde wordt nu ingevuld, tags vriendelijker opgemaakt

---
 themes/nluug/assets/scss/_extra.scss       |  0
 themes/nluug/assets/scss/styles.scss       | 24 +++++++++++-
 themes/nluug/assets/scss/styles_table.scss | 45 ++++++++++++++++++++++
 themes/nluug/layouts/_default/baseof.html  |  9 +++--
 themes/nluug/layouts/partials/style.html   | 24 +++++++++---
 5 files changed, 91 insertions(+), 11 deletions(-)
 delete mode 100644 themes/nluug/assets/scss/_extra.scss
 create mode 100644 themes/nluug/assets/scss/styles_table.scss

diff --git a/themes/nluug/assets/scss/_extra.scss b/themes/nluug/assets/scss/_extra.scss
deleted file mode 100644
index e69de29..0000000
diff --git a/themes/nluug/assets/scss/styles.scss b/themes/nluug/assets/scss/styles.scss
index 076583c..484c188 100644
--- a/themes/nluug/assets/scss/styles.scss
+++ b/themes/nluug/assets/scss/styles.scss
@@ -1,4 +1,8 @@
 
+// purple: #6A2060
+// light purple-grey: #DCC9DB
+// darkblue: #1D3160
+
 $color-button: #1D3160;
 $color-button-hover: #17274d;
 $color-button-call-to-action: #138808;
@@ -10,6 +14,8 @@ $color-highlight-box-nluug-border: #6A2060;
 $color-highlight-box-nluug-background: #EBBCE5; // omgezet naar lichtere kleur via https://encycolorpedia.com/6a2060
 $color-border: #6A2060;
 $color-text-inverse: white;
+$color-tags-background: #6A2060;
+$color-tags-text: white;
 
 
 *, :after, :before {
@@ -68,6 +74,9 @@ footer {
   column-gap: 1px;
 }
 
+h1, h2 {
+    padding-top: 10px;
+  }
 h1, h2, h3 {
     //font-size: inherit;
     font-size: 1.1em;
@@ -284,7 +293,17 @@ img.shownormal {
 }
 
 .tags li {
+    background-color: $color-tags-background;
+    border-radius: 2px;
+    color: $color-tags-text;
     display: inline;
+    padding: 3px 8px;
+}
+
+.tags li a {
+  font-size: 0.8em;
+    text-decoration: none;
+
 }
 
 /* Kolommen voor de footer */
@@ -314,7 +333,8 @@ img.shownormal {
 .w-40 { width: 40%; }
 .w-50 { width: 50%; }
 
-/* Table Styles */
+
+/*
 
 .table-wrapper{
     margin: 10px 10px 30px;
@@ -357,4 +377,4 @@ img.shownormal {
 .fl-table tr:nth-child(even) {
     background: #F8F8F8;
 }
-
+*/
diff --git a/themes/nluug/assets/scss/styles_table.scss b/themes/nluug/assets/scss/styles_table.scss
new file mode 100644
index 0000000..9d85830
--- /dev/null
+++ b/themes/nluug/assets/scss/styles_table.scss
@@ -0,0 +1,45 @@
+
+/* Table Styles */
+
+.table-wrapper{
+    margin: 10px 10px 30px;
+    box-shadow: 0px 10px 20px rgba( 0, 0, 0, 0.2 );
+    overflow-x:auto;
+}
+
+.fl-table {
+    border-radius: 5px;
+    font-size: 14px;
+    font-weight: normal;
+    border: none;
+    border-collapse: collapse;
+    width: 100%;
+    max-width: 100%;
+    background-color: white;
+}
+
+.fl-table td, .fl-table th {
+    text-align: left;
+    padding: 8px;
+    vertical-align: top;
+}
+
+.fl-table td {
+    border-right: 1px solid #f8f8f8;
+    font-size: 14px;
+}
+
+.fl-table thead th {
+    color: #ffffff;
+    background: #324960;
+}
+
+.fl-table thead th:nth-child(odd) {
+    color: #ffffff;
+    background: #324960;
+}
+
+.fl-table tr:nth-child(even) {
+    background: #F8F8F8;
+}
+
diff --git a/themes/nluug/layouts/_default/baseof.html b/themes/nluug/layouts/_default/baseof.html
index 1ea76b3..147a4bb 100644
--- a/themes/nluug/layouts/_default/baseof.html
+++ b/themes/nluug/layouts/_default/baseof.html
@@ -33,14 +33,15 @@
             {{ if .Params.tags }}
               <section>
                 <h3>Tags</h3>
-                  <div class="post-date">
-                    <span class="g time">{{.Date.Format "January 2, 2006"}} </span> &#8729;
+                <div class="tags">
                     {{ $taxonomy := "tags" }} {{ with .Param $taxonomy }}
+                    <ul>
                     {{ range $index, $tag := . }} {{ with $.Site.GetPage (printf "/%s/%s" $taxonomy $tag) -}}
-                      <a href="{{ .Permalink }}">{{ $tag | urlize }}</a>
+                    <li><a href="{{ .Permalink }}">{{ $tag | urlize }}</a></li>
                     {{- end -}} {{- end -}}
+                    </ul>
                     {{ end }}
-                  </div>
+                </div>
               </section>
             {{ end }}
         </div>
diff --git a/themes/nluug/layouts/partials/style.html b/themes/nluug/layouts/partials/style.html
index 82bd183..3c60914 100644
--- a/themes/nluug/layouts/partials/style.html
+++ b/themes/nluug/layouts/partials/style.html
@@ -1,5 +1,19 @@
-{{ $styles := resources.Get "scss/styles.scss" | toCSS (dict "outputStyle" "compressed") | minify }}
-{{ $styles_breadcrumb := resources.Get "scss/styles_breadcrumb.scss" | toCSS (dict "outputStyle" "compressed") | minify }}
-{{ $styles_navigation_menu := resources.Get "scss/styles_navigation_menu.scss" | toCSS (dict "outputStyle" "compressed") | minify }}
-{{ $styles_extra := resources.Get "scss/_extra.scss" | toCSS (dict "outputStyle" "compressed") | minify }}
-<style>{{ $styles.Content | safeCSS }} {{ $styles_breadcrumb.Content | safeCSS }}{{ $styles_navigation_menu.Content | safeCSS }} {{ $styles_extra.Content | safeCSS }}</style>
+{{/* Zoek alle scss-bestanden, combineer ze, zet om naar CSS, verkleinen en voorzien van fingerprint */}}
+{{ $styles := resources.Match "scss/**.scss" | resources.Concat "combined.scss" | toCSS (dict "outputStyle" "compressed") | minify | fingerprint }}
+<style integrity="{{ $styles.Data.Integrity }}">{{ $styles.Content | safeCSS }}</style>
+
+
+{{/*
+  Work in progress
+  {{ if eq (getenv "HUGO_ENV") "development" }}
+  {{ $cssOpts := (dict "enableSourceMap" true "includePaths" (slice "node_modules/bulma" "assets/scss")) }}
+  {{ $styles := resources.Match "scss/**.scss" | resources.Concat "combined.scss" | toCSS $cssOpts | postCSS }}
+  <link rel="stylesheet" href="{{ $styles.Permalink }}" media="screen">
+  {{ else }}
+  {{ $cssOpts := (dict "enableSourceMap" false "includePaths" (slice "node_modules/bulma" "assets/scss")) }}
+
+  {{ with $combined_styles := resources.Match "scss/*.scss" | toCSS $cssOpts | postCSS | minify | fingerprint }}
+  <style>{{ .Content | safeCSS }}</style>
+  {{ end }}
+  {{ end }}
+*/}}