update theme manually again

themes/lumbung-theme/layouts/_default/list.html

@@ -1,23 +1,32 @@
 {{ define "main" }}
-<section class="entries">
+<section class='entries'>
   <div class="h-feed">
-    {{ range .Pages }}
+    {{ range (.Paginator 13).Pages }}
-    <div class='card'>
+
-          <article class="h-entry">
+      {{ if in .Params.categories "tv"}}
-            <header>
+    
-              <h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">{{ .Title }}</a></h2>
+        {{- partial "video_box.html" . -}}
-               <time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
+
-            </header>
+      {{ else if in .Params.categories "calendar" }}
-            {{ if .Truncated }}
+
-            <div class="p-summary truncated">
+        {{- partial "calendar_card.html" . -}}
-              {{ .Summary }}
+
-            <p><a href="{{ .RelPermalink }}">Read More…</a></p>
+      {{ else if in .Params.categories "network" }}
-            {{ else }}
+
-            <div class="p-summary">
+        {{- partial "network_card.html" . -}}
-            {{ end }}
+
-            </div>
+      {{ else }}
-          </article>
+
-    </div>
+        {{- partial "card.html" . -}}
+
+      {{ end }}   
+
     {{ end }}
-</section>
+  </div>
+
+  <nav class="pagination">
+  {{ template "_internal/pagination.html" . }}
+  </nav>
+
+</main>
 {{ end }}

themes/lumbung-theme/layouts/index.html

@@ -1,7 +1,7 @@
 {{ define "main" }}
 <section class='entries'>
   <div class="h-feed">
-    {{ range (.Paginator 10).Pages }}
+    {{ range (.Paginator 13).Pages }}
 
       {{ if in .Params.categories "tv"}}
     
@@ -11,6 +11,10 @@
 
         {{- partial "calendar_card.html" . -}}
 
+      {{ else if in .Params.categories "network" }}
+
+        {{- partial "network_card.html" . -}}
+
       {{ else }}
 
         {{- partial "card.html" . -}}

themes/lumbung-theme/layouts/partials/calendar_card.html

@@ -1,5 +1,6 @@
-    <div class='card calendar'>
+{{  $t := (time .Params.event_end) }} 
-          <article class="h-entry calendar">
+    <div class='card calendar {{ if $t.Before now }}past{{end}}'>
+          <article class="h-event calendar ">
             <header>
               <h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">{{ .Title }}</a></h2>
             </header>
@@ -15,9 +16,9 @@
               <div class='calendar-duration'>Duration: <b>{{ .Params.duration }}</b></div>
               <input class='descr_button' type='checkbox' id='toggle-{{ .Params.uid }}'/>
               <label class='calendar' for='toggle-{{ .Params.uid }}'>↕</label>
-              <div class='calendar-location'>{{ .Params.location | markdownify }}</div>
+              <div class='calendar-location p-location'>{{ .Params.location | markdownify }}</div>
  
-              <div class='calendar description' id='event-{{ .Params.uid }}'>
+              <div class='calendar description p-description' id='event-{{ .Params.uid }}'>
                 {{.Content}}
               </div>
             </div>
@@ -25,4 +26,5 @@
 
 
           </article>
-    </div>
+    </div>
+        

themes/lumbung-theme/layouts/partials/calendar_list.html

@@ -0,0 +1,24 @@
+    <div class='card calendar'>
+          <article class="h-entry calendar">
+            <header>
+              <h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">{{ .Title }}</a></h2>
+            </header>
+            <div class='start-scroller'>
+                <marquee behavior="scroll" direction="left">
+                  {{ .Params.localized_begin | markdownify }}
+                </marquee>
+            </div>
+            <div class='calendar metadata'>
+              <div class='calendar-duration'>Duration: <b>{{ .Params.duration }}</b></div>
+              <input class='descr_button' type='checkbox' id='toggle-{{ .Params.uid }}'/>
+              <label class='calendar' for='toggle-{{ .Params.uid }}'>↕</label>
+              <div class='calendar-location'>{{ .Params.location | markdownify }}</div>
+              <div class='calendar description' id='event-{{ .Params.uid }}'>
+                {{.Content}}
+              </div>
+            </div>
+
+
+
+          </article>
+    </div>

themes/lumbung-theme/layouts/partials/network_card.html

@@ -0,0 +1,33 @@
+    <div class='network card'>
+          <article class="h-entry network">
+            <header>
+              <h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">{{ .Title }}</a></h2>
+               <div class="header-metadata">
+               <time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
+               <div class="filler"></div>
+             </div>
+            </header>
+
+            <div class="network-source"><span class="from p-author">From {{ if .Params.author }}<b>{{.Params.author}}</b> at {{ end }}<a href="{{ "/categories/" | relLangURL }}{{ .Params.feed_name | urlize }}">{{ .Params.feed_name }}</a></span></div>
+
+            <div class="p-summary {{if .Truncated}} truncated {{end}} img" >
+              {{ with (index (.Resources.ByType "image") 0) }}
+                {{ $thumb := .Fit "540x360"}}
+              <div class="summary-image"> 
+              <img src="{{ $thumb.Permalink }}"  alt="{{ .Title }}">
+              </div>
+              {{ end }}
+              <div class="summary-text">
+                {{ .Summary }}
+              </div>
+
+            </div>
+            {{ if .Truncated }}
+              <footer class='post-footer'>
+                <div class='read-more'><a href="{{ .RelPermalink }}">Read More…</a></div>
+                <div class='footer-filler'></div>
+              </footer>
+            {{ end }}
+            
+          </article>
+    </div>

themes/lumbung-theme/layouts/partials/test.html

@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta charset="utf-8">
+	<title></title>
+	<link rel="stylesheet" type="text/css" href="../../static/css/main.css">
+</head>
+<body>
+    <div class='side-bar calendar'>
+          <article class="h-entry calendar">
+            <header>
+              <h3 class="p-name"><a href="{{ .Permalink }}" class="u-url">{{ .Title }}</a></h2>
+
+            </header>
+            <div class='start-scroller'>
+                <marquee behavior="scroll" direction="left">
+                  {{ .Params.localized_begin | markdownify }}
+                </marquee>
+            </div>
+            <div class='calendar metadata'>
+              <div class='calendar-duration'>Duration: <b>{{ .Params.duration }}</b></div>
+              <input class='descr_button' type='checkbox' id='toggle-{{ .Params.uid }}'/>
+              <label class='calendar' for='toggle-{{ .Params.uid }}'>↕</label>
+              <div class='calendar-location'>{{ .Params.location | markdownify }}</div>
+              <div class='calendar description' id='event-{{ .Params.uid }}'>
+                {{.Content}}
+              </div>
+            </div>
+
+
+
+          </article>
+    </div>
+</body>
+</html>

themes/lumbung-theme/static/css/main.css

@@ -93,9 +93,10 @@ body {
 }
 
 .entries{
-  padding-top: 15%;
+  padding-top: 5%;
 }
 
+
 /* base header & menu */
 
 #top-menu{
@@ -105,6 +106,7 @@ body {
   width: 90%;
   z-index: 1;
   margin-top: 1em;
+  display: none;
 }
 
 .logo {
@@ -142,6 +144,7 @@ body {
 .h-entry header {
   display: flex;
   border-bottom: 2px solid var(--border-color);
+  justify-content: space-between;
 }
 
 .h-entry header h2{
@@ -149,7 +152,8 @@ body {
   margin: 0;
   padding-right: 0.3em;
   padding-left: 0.3em;
-  border-right: 2px solid var(--border-color);
+  border-left: 2px solid var(--border-color);
+  flex-grow: 1;
 }
 
 .h-entry header h2:hover{
@@ -165,13 +169,21 @@ body {
 
 .h-entry header .header-metadata{
   margin: 0;
-  padding: 0.5em;
   display: flex;
   flex-flow: column wrap;
-  font-size: 0.9em;
+  font-size: 0.8rem;
-  align-content: flex-end;
 }
 
+.header-metadata .dt-published{
+  padding: 0.5em 1.2em 0.5em 1.2em;
+}
+
+.author.p-author {
+  border-top: 2px solid var(--border-color);
+  padding: 0.5em 1.2em 0.5em 1.2em;
+}
+
+
 .p-summary.truncated.image {
   display: flex;
   flex-direction: row-reverse;
@@ -219,6 +231,100 @@ footer.post-footer {
   font-size: 0.9rem;
 }
 
+/* network cards */
+
+.card.network{
+
+      border: 2px solid darkcyan;
+      box-shadow:1em 1em 0 #d2d1c8;
+      background-color: lightgreen;
+      max-width: 540px;
+      margin-bottom: 2em;
+      flex: auto;
+      margin:  0 3em 3em 0;
+      align-self: start;
+      color: darkcyan;
+    }
+
+.h-entry.network header {
+  display: flex;
+  border-bottom: 2px solid darkcyan;
+  flex-direction: row-reverse;
+}
+
+.h-entry.network header h2{
+  padding: 0.2em 0.5em 0.2em 0.5em;
+  margin: 0;
+  border-color: darkcyan;
+}
+
+.h-entry.network header h2:hover{
+    box-shadow: inset 4px 4px 0px darkcyan;
+    cursor: pointer;
+}
+
+.h-entry.network header h2 a {
+  text-decoration: none;
+  color: darkcyan;
+}
+
+.network .header-metadata {
+  align-items: center;
+}
+
+.network .header-metadata .dt-published{
+  padding-left: 1.2em;
+  min-width: 16ch;
+  border-bottom: 2px solid darkcyan;
+}
+
+.network .filler {
+  min-height: 1rem;
+}
+
+.network .author.p-author {
+  border-color:  darkcyan;
+  padding: 0.5em 1.2em 0.5em 1.2em;
+}
+
+.network footer.post-footer{
+  border-top: 2px solid darkcyan;
+}
+
+.network .summary-image {
+  border-bottom: 2px solid darkcyan;
+  border-right: none;
+}
+
+.network .summary-image > img {
+  display: inherit;
+}
+.network .summary-text {
+  font-size: 14px;
+}
+
+div.network-source{
+  padding: 0.5em 1.2em 0.5em 1.2em;
+  border-bottom: 2px solid darkcyan;
+  font-size: 14px;
+  display: flex;
+  justify-content: space-between;
+}
+
+.network-source a {
+  font-weight: bold;
+  color: darkcyan;
+}
+
+.network .footer-filler{
+  border: none;
+}
+.network .read-more {
+  border: none;
+  border-left: 2px solid darkcyan;
+}
+
+
 /* calendar cards */
 
 .card.calendar {
@@ -234,23 +340,31 @@ footer.post-footer {
 
 }
 
-.h-entry.calendar header {
+.card.calendar.past {
+  opacity: 0.3;
+}
+
+.card.calendar.past:hover {
+  opacity: 1;
+}
+
+.h-event.calendar header {
   display: flex;
   border-bottom: 2px solid cornflowerblue;
 }
 
-.h-entry.calendar header h2{
+.h-event.calendar header h2{
   padding: 0.2em 0.5em 0.2em 0.5em;
   margin: 0;
   border-right: none;
 }
 
-.h-entry.calendar header h2:hover{
+.h-event.calendar header h2:hover{
     box-shadow: inset 4px 4px 0px royalblue;
     cursor: pointer;
 }
 
-.h-entry.calendar header h2 a {
+.h-event.calendar header h2 a {
   text-decoration: none;
   color: royalblue;
 }