From 65791c68cb0ba04b32c56ff776a981f1cb7774ba Mon Sep 17 00:00:00 2001
From: Christian <chs8691@mailbox.org>
Date: Sat, 28 Nov 2020 19:16:23 +0100
Subject: [PATCH] fresh design for years

---
 config.toml                         | 15 ++++++++----
 i18n/de.toml                        |  4 +++
 layouts/partials/years-summary.html | 35 ++++++++++++++++++--------
 layouts/years/terms.html            | 38 +++++++++++------------------
 4 files changed, 53 insertions(+), 39 deletions(-)
 create mode 100644 i18n/de.toml

diff --git a/config.toml b/config.toml
index 42c0210..66a97a9 100644
--- a/config.toml
+++ b/config.toml
@@ -1,6 +1,6 @@
 title = "Kollegenrunde"
 baseURL = "https://kollegen.uber.space/kollegenrunde"
-languageCode = "de-de"
+languageCode = "de"
 theme = "ananke"
 
 DefaultContentLanguage = "de"
@@ -11,8 +11,6 @@ enableRobotsTXT = true
 contentDir = "../kollegen-posts/content"
 archetypeDir = "../kollegen-posts/archetypes"
 
-[de]
-  title = "Kollegenrunde"
 
 [taxonomies]
   category = "categories"
@@ -28,7 +26,10 @@ archetypeDir = "../kollegen-posts/archetypes"
   priority = 0.5
   filename = "sitemap.xml"
 
-  
+[permalinks]
+    # :title is used if :slug is not defined in post frontmatter
+    posts = "posts/:year/:title/"
+
 [params]
   sectionPagesMenu = "main"
   favicon = ""
@@ -48,7 +49,6 @@ archetypeDir = "../kollegen-posts/archetypes"
   slack = ""
   stackoverflow = ""
   rss = ""
-#   TEST body_classes = "avenir bg-near-white"
   # choose a background color from any on this page: http://tachyons.io/docs/themes/skins/ and preface it with "bg-"
   background_color_class = "bg-dark-blue"
   featured_image = "/images/070830-schatten.jpg"
@@ -63,3 +63,8 @@ archetypeDir = "../kollegen-posts/archetypes"
     name = "Statistik"
     identifier = "stats"
     url = "/stats/"
+
+[languages]
+  [languages.de]
+    title = "Kollegenrunde"
+    weight = 1
diff --git a/i18n/de.toml b/i18n/de.toml
new file mode 100644
index 0000000..4dadb8c
--- /dev/null
+++ b/i18n/de.toml
@@ -0,0 +1,4 @@
+[tours]
+one = "Eine Tour"
+other = "{{ .Count }} Touren"
+ 
diff --git a/layouts/partials/years-summary.html b/layouts/partials/years-summary.html
index b75a5ea..20e382b 100644
--- a/layouts/partials/years-summary.html
+++ b/layouts/partials/years-summary.html
@@ -6,14 +6,16 @@
 {{ $totalWidth := 100.0 }}
 {{ $totalHeight := 50.0 }}
 {{ $width := div $totalWidth  12 }}
+{{ $month_map := .page.Site.Data.month }}
 
 {{ $color := "#a8c7f0" }}
 {{ $strokecolor := "#d3e3f8" }}
 
 <script>
-function onyearover(year, key, count){
+function onyearover(key, month, text){
 // alert( year + key  + "!")
-document.getElementById( key ).innerHTML = year + ": " + count;
+  document.getElementById( key ).innerHTML = month + ": " + text;
+
 }
 
 function onyearout(key){
@@ -24,7 +26,6 @@ document.getElementById( key ).innerHTML = "<div style='color: transparent'>:</d
 
 <svg width="{{ $totalWidth }}%" height="{{ $totalHeight }}" 
 xmlns="http://www.w3.org/2000/svg">
-  <rect height="100%" width="100%" opacity="0.1" fill="{{ $color }}"/>
   {{ $month := 0 }}
   {{ $actMonth := 0 }}
   {{ $maxCount := 0 }}
@@ -48,23 +49,37 @@ xmlns="http://www.w3.org/2000/svg">
   
   {{ $x := 0 }}
   {{ $month := 0 }}
+
+  {{ range $i, $sequence :=  (seq 12) }}
+    {{ $i }}: {{ $sequence }}
+    {{ $x = mul ( sub ( float $sequence ) 1 ) $width }}
+    {{ $m:= printf "%02d" $sequence }}
+    {{ $d:= (print "2006-" $m "-01")}}
+      <rect height="100%" y="0" x="{{ $x }}%" opacity="0.8"
+      width="{{ $width }}%"  fill="transparent" stroke-width="2" stroke="{{ $color }}"/>
+       <text y="{{ mul $totalHeight 0.7 }}" x="{{ sub (mul $width $sequence) (div $width 2) }}%"   text-anchor="middle" fill="{{ $color }}" font-size="25" font-weight="bold" opacity="0.8">{{ substr (dateFormat "Jan" $d) 0 1 }} </text>
+  {{ end }}
+  
+  {{ $adate := "" }}
   {{ range sort ( $pages.GroupByDate "2006-01" ) "Key" }}
     {{ range first 1 .Pages }}
-      {{ $month = .Params.Date.Format "01" }}
+      {{ $month = .Params.Date.Format "1" }}
     {{ end }}
-    
     {{ $height := 0 }}
     {{ $height = mul (float $totalHeight ) ( div (float ( len .Pages ) ) ( float $maxCount ) )  }}
   
     {{ $x = mul ( sub ( float $month ) 1 ) $width }}
 
-      
-    <rect onmouseover="onyearover({{ $month }}, {{ $param_title }}, {{ len .Pages }} )" onmouseout="onyearout({{ $param_title }})"  height="{{ $height }}" y="{{ sub $totalHeight $height }}" x="{{ $x }}%" 
-      width="{{ $width }}%"  fill="{{ $color }}" stroke-width="1.5" stroke="{{$strokecolor}}"
-      class="dim"/>
+    <rect height="{{ $height }}" y="{{ sub $totalHeight $height }}" x="{{ $x }}%" 
+      opacity="0.6"
+      width="{{ $width }}%"  fill="{{ $color }}" stroke-width="1.5" stroke="{{$strokecolor}}"/>
 
+      <rect onmouseover="onyearover( {{ $param_title }}, {{index $month_map ($month)}}, {{ i18n "tours" ( len .Pages ) }} )" 
+        onmouseout="onyearout({{ $param_title }})"  
+        height="100%" y="0" x="{{ $x }}%" 
+        width="{{ $width }}%"  fill="{{ $color }}" stroke-width="1.5" stroke="{{$strokecolor}}"
+        class="o-10"/>
     {{$x }}
   {{ end }}
   
-
 </svg>  
diff --git a/layouts/years/terms.html b/layouts/years/terms.html
index 6624adb..ac86a17 100644
--- a/layouts/years/terms.html
+++ b/layouts/years/terms.html
@@ -14,32 +14,22 @@
       <section class="mt1">
         <div class="flex flex-column bg-white ba b--white bw2 ">
 
-          <div class="flex bg-white">
-  
-            <div class="flex">
-              <div class="f1 w4 tr pr4 pt1  bg-blue white">
-                {{ len .Pages }}
+          <a href="{{ .Page.Permalink }}" class=" link black dim ">
+            <div class="flex flex-box justify-between bg-blue white">
+              <div class="flex f1 pl2">
+                {{ .Page.Title }}
+              </div>    
+              <div class="f5 pr2 pt4 ">
+                {{ T "tours" (len .Pages) }}
               </div>    
             </div>    
-            
-              <div class="flex flex-column pl2">
-                <div class=" pl2 ">
-                  {{ humanize .Page.Section }}
-                </div>
-              
-                <a href="{{ .Page.Permalink }}" class="f3 b near-black link black dim pr4 pt2 pb2">
-                  {{ .Page.Title }}
-                </a>
-              </div>
-            </div>
-            
-            <div class="flex pt1">
-              {{ partial "years-summary.html" (dict "page" .Page "param_title" .Page.Title "pages" .Pages) }}
-            </div>
-            <div id="{{ .Page.Title }}" class="flex justify-center pt1">
-              <div style="color:transparent">:</div>
-            </div>
-            
+          </a>            
+          <div class="flex pt1">
+            {{ partial "years-summary.html" (dict "page" .Page "param_title" .Page.Title "pages" .Pages) }}
+          </div>
+          <div id="{{ .Page.Title }}" class="flex justify-center pt1">
+            <div style="color:transparent">:</div>
+          </div>            
         </div>
       </section>
     {{ end }}