fresh design for years

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

i18n/de.toml

@@ -0,0 +1,4 @@
+[tours]
+one = "Eine Tour"
+other = "{{ .Count }} Touren"
+ 

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 height="{{ $height }}" y="{{ sub $totalHeight $height }}" x="{{ $x }}%" 
-    <rect onmouseover="onyearover({{ $month }}, {{ $param_title }}, {{ len .Pages }} )" onmouseout="onyearout({{ $param_title }})"  height="{{ $height }}" y="{{ sub $totalHeight $height }}" x="{{ $x }}%" 
+      opacity="0.6"
-      width="{{ $width }}%"  fill="{{ $color }}" stroke-width="1.5" stroke="{{$strokecolor}}"
+      width="{{ $width }}%"  fill="{{ $color }}" stroke-width="1.5" stroke="{{$strokecolor}}"/>
-      class="dim"/>
 
+      <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>  

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">
+          <a href="{{ .Page.Permalink }}" class=" link black dim ">
-  
+            <div class="flex flex-box justify-between bg-blue white">
-            <div class="flex">
+              <div class="flex f1 pl2">
-              <div class="f1 w4 tr pr4 pt1  bg-blue white">
+                {{ .Page.Title }}
-                {{ len .Pages }}
+              </div>    
+              <div class="f5 pr2 pt4 ">
+                {{ T "tours" (len .Pages) }}
               </div>    
             </div>    
-            
+          </a>            
-              <div class="flex flex-column pl2">
+          <div class="flex pt1">
-                <div class=" pl2 ">
+            {{ partial "years-summary.html" (dict "page" .Page "param_title" .Page.Title "pages" .Pages) }}
-                  {{ humanize .Page.Section }}
+          </div>
-                </div>
+          <div id="{{ .Page.Title }}" class="flex justify-center pt1">
-              
+            <div style="color:transparent">:</div>
-                <a href="{{ .Page.Permalink }}" class="f3 b near-black link black dim pr4 pt2 pb2">
+          </div>            
-                  {{ .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>
-            
         </div>
       </section>
     {{ end }}