Clean up events page (#290)

Made events page look pretty. Could still use some improvements but it’s good enough.

Signed-off-by: Matt Stratton <matt.stratton@gmail.com>

Author: mattstratton

layouts/events/single.html

@@ -1,16 +1,65 @@
 {{ define "main" }}
 
-{{/* site data query copypasta */}}
-{{ $path := split $.Source.File.Path .Site.Params.PathSeparator }}
-{{ $event_slug := index $path 1 }}
-{{ $e :=  (index $.Site.Data.events $event_slug) }}
-{{/* end site data query */}}
-
 <div>
       {{ .Content }}
 </div>
 
-{{ partial "future.html" . }}
+<div class = "row">
+  <div class = "col-md-12">
+    <h2>Future</h2>
+  </div>
+</div>
+
+<div class = "row">
+  {{ $.Scratch.Set "close-tag" "false" }}
+{{- range sort $.Site.Data.events "startdate" -}}
+  {{- if .startdate -}}
+    {{- if ge (dateFormat "2006-01-02" .enddate) (dateFormat "2006-01-02" ($.Now.Format "2006-01-02")) -}}
+      {{- if ne ($.Scratch.Get "year") (dateFormat "2006" .startdate) -}}
+        {{- $.Scratch.Set "year" (dateFormat "2006" .startdate) -}}
+        {{- $.Scratch.Set "year-displayed" "false" -}}
+      {{- end -}}
+      {{- if ne ($.Scratch.Get "month") (dateFormat "January" .startdate ) -}}
+        {{- $.Scratch.Set "month" (dateFormat "January" .startdate ) -}}
+        {{- $.Scratch.Set "month-displayed" "false" -}}
+      {{- end -}}
+
+
+      {{- if ne ($.Scratch.Get "month-displayed") "true" -}}
+      {{- if eq ($.Scratch.Get "close-tag") "true"}}
+        </div>
+      {{ end }}
+      <div class = "col-md-6 col-lg-3 events-page-col">
+        <h4 class="events-page-months">{{ dateFormat "January" .startdate }}</h4>
+        {{- $.Scratch.Set "month-displayed" "true" -}}
+        {{ $.Scratch.Set "close-tag" "true" }}
+      {{- end -}}
+      {{- if ne .startdate .enddate }}
+      <a href = "/events/{{ .name }}/" class = "events-page-event">
+        {{ dateFormat "Jan 2" .startdate }} - {{ dateFormat "Jan 2" .enddate }}
+        {{ .city }}
+      </a><br />
+      {{- else -}}
+      <a href = "/events/{{ .name }}/" class = "events-page-event">
+        {{ dateFormat "Jan 2" .startdate }}
+        {{ .city }}
+      </a><br />
+      {{- end -}}
+    {{- end -}}
+  {{- end -}}
+{{- end -}}
+</div>
+<div class = "col-md-6 col-lg-3 events-page-col">
+<h4 class="events-page-months">TBD</h4>
+{{- range $.Site.Data.events -}}
+  {{- if not .startdate -}}
+    <a href = "/events/{{ .name }}/" class = "events-page-event">{{ .city }}</a><br />
+  {{- end -}}
+{{- end -}}
+</div>
+  </div>
+
+
 {{ partial "past.html" . }}
 
 {{ end }}

layouts/partials/past.html

@@ -27,15 +27,15 @@ <h2>Past</h2>
 <div class = "row">
   <!-- Now scan through all the years that were marked as active in order to print the headline -->
   {{ range ($.Scratch.GetSortedMapValues "active_years") }}
-    <div class = "col-md-4">
-      <strong>{{ . }}</strong>
+    <div class = "col-md-6 col-lg-3 events-page-col">
+      <h4 class="events-page-months">{{ . }}</h4>
       <br/>
         <!-- Finally, scan throug the scratch with the ID of that year and print all the events sorted by startdate
   Chomping here in order to convert int to string -->
         {{ range ($.Scratch.GetSortedMapValues (print (chomp .))) }}
             {{ $.Scratch.Set "citydisplay" (index $.Site.Data.events . "city") }}
           {{ $friendly := (index $.Site.Data.events . "name") }}
-          <a href="/events/{{ $friendly }}/">{{ $.Scratch.Get "citydisplay" }}</a>
+          <a href="/events/{{ $friendly }}/" class = "events-page-event">{{ $.Scratch.Get "citydisplay" }}</a>
           <br/>
         {{ end }}
       </div>

static/css/site.css

@@ -476,3 +476,22 @@ a:hover.welcome-page-masthead-link {
 .organizer-card {
   padding-bottom: 20px;
 }
+
+.events-page-col {
+  padding: 30px;
+}
+
+.events-page-months {
+  font-family: 'Roboto', sans-serif;
+  font-weight: 300;
+  font-size: 14pt;
+  text-transform: uppercase;
+  color: #000000;
+}
+
+.events-page-event {
+  font-family: 'Roboto', sans-serif;
+  font-weight: 100;
+  font-size: 11pt;
+  text-transform: capitalize;
+}