From 5c2a9a8e95d684d95c38c88735d7ea2c2ad03c6f Mon Sep 17 00:00:00 2001 From: Hideki Shimizu Date: Wed, 4 Sep 2019 00:41:57 +0900 Subject: [PATCH] [add] categories_color in config.html and tag_button's loop in postcard.html #69 --- layouts/_default/terms.html | 1 - layouts/shortcodes/postcards.html | 45 ++++++++++++++++++++++++++----- static/css/postcard.css | 39 +++++++++++++++++++-------- 3 files changed, 66 insertions(+), 19 deletions(-) diff --git a/layouts/_default/terms.html b/layouts/_default/terms.html index a515b7d..334d238 100644 --- a/layouts/_default/terms.html +++ b/layouts/_default/terms.html @@ -11,4 +11,3 @@ {{ end }} {{ end }} - diff --git a/layouts/shortcodes/postcards.html b/layouts/shortcodes/postcards.html index 8413da8..d445c04 100644 --- a/layouts/shortcodes/postcards.html +++ b/layouts/shortcodes/postcards.html @@ -1,5 +1,6 @@

Upcoming

+ {{ range ($.Page.CurrentSection.Pages.ByParam "endEventDate") }} {{ $FormattedNow := (now.AddDate 0 0 -1) }} {{ if le $FormattedNow .Params.eventEndDate }} @@ -10,9 +11,19 @@ {{ $numtags := len .Params.tags }} {{ if gt $numtags 0 }}
- {{ range .Params.tags }} - {{ . }} - {{ end }} + {{ range .Params.tags }} + {{ $category_name := . }} + {{ $categories_color := $.Site.Params.categories_color }} + {{ if in $categories_color $category_name }} {{/* if tag_name is defined in categories_color */}} + {{ range $i, $tag_name := $categories_color }} + {{ if eq $tag_name $category_name }} + {{ $category_name }} + {{ end }} + {{ end }} + {{ else }} + {{ $category_name }} + {{ end }} + {{ end }}
{{ end }} @@ -22,10 +33,20 @@ {{ $numtags := len .Params.tags }} {{ if gt $numtags 0 }}
- {{ range .Params.tags }} - {{ . }} + {{ range .Params.tags }} + {{ $category_name := . }} + {{ $categories_color := $.Site.Params.categories_color }} + {{ if in $categories_color $category_name }} {{/* if tag_name is defined in categories_color */}} + {{ range $i, $tag_name := $categories_color }} + {{ if eq $tag_name $category_name }} + {{ $category_name }} + {{ end }} + {{ end }} + {{ else }} + {{ $category_name }} {{ end }} -
+ {{ end }} + {{ end }} {{ end }} @@ -48,7 +69,17 @@ {{ dateFormat "2 Jan, 2006" .Date }}
{{ range .Params.tags }} - {{ . }} + {{ $category_name := . }} + {{ $categories_color := $.Site.Params.categories_color }} + {{ if in $categories_color $category_name }} {{/* if tag_name is defined in categories_color */}} + {{ range $i, $tag_name := $categories_color }} + {{ if eq $tag_name $category_name }} + {{ $category_name }} + {{ end }} + {{ end }} + {{ else }} + {{ $category_name }} + {{ end }} {{ end }}
diff --git a/static/css/postcard.css b/static/css/postcard.css index f6c2fbe..c54308a 100644 --- a/static/css/postcard.css +++ b/static/css/postcard.css @@ -1,3 +1,10 @@ +:root { + --gray-color: #808080; + --red-color: #8b0000; + --green-color: #2f4f4f; + --blue-color: #00008b; +} + .postcard { background-color: #fff; padding: 10px; @@ -149,33 +156,43 @@ border-radius: 8px; transition: .4s; text-decoration: none; - color:#8b0000; - border: solid 1px #8b0000; + color:var(--gray-color); + border: solid 1px var(--gray-color); transition: .4s; } .postcard div a.tagbutton:hover { - background-image: linear-gradient(45deg, #8b0000 0%, #b22222 100%); + background-image: linear-gradient(45deg, var(--gray-color) 0%, var(--gray-color) 100%); color: white; } .postcard div a.red { - color:#8b0000; - border: solid 1px #8b0000; + color:var(--red-color); + border: solid 1px var(--red-color); } .postcard div a.red:hover { - background-image: linear-gradient(45deg, #8b0000 0%, #b22222 100%); + background-image: linear-gradient(45deg, var(--red-color) 0%, var(--red-color) 100%); + color: white; +} + +.postcard div a.blue{ + color:var(--blue-color); + border: solid 1px var(--blue-color); +} + +.postcard div a.blue:hover { + background-image: linear-gradient(45deg, var(--blue-color) 0%, var(--blue-color) 100%); color: white; } -.postcard div a.Seminar { - color:#2f4f4f; - border: solid 1px #2f4f4f; +.postcard div a.green{ + color:var(--green-color); + border: solid 1px var(--green-color); } -.postcard div a.Seminar:hover { - background-image: linear-gradient(45deg, #1d2d2d 0%, #2f4f4f 100%); +.postcard div a.green:hover { + background-image: linear-gradient(45deg, var(--green-color) 0%, var(--green-color) 100%); color: white; } -- GitLab