ruangrupa/lumbung.space
1
0
Fork 1
Code Issues 11 Pull Requests Projects Releases Wiki Activity

change header & major rework of taxonomies as part of frontpage redesign

Browse Source
This commit is contained in:
rra
2022-09-15 18:39:33 +02:00
parent a226b45bc0
commit 475a614959
14 changed files with 618 additions and 201 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
config.toml
View File

@ -21,8 +21,9 @@ unsafe = true
[taxonomies]
author = "authors"
contributor = "contributors"
tag = "tags"
category = "categories"
source = "sources"
timeline = "timelines"
[permalinks]

0
content/contributors.md → content/ls-contributors.md
View File

10
themes/lumbung-theme/layouts/_default/baseof.html
View File

@ -41,16 +41,6 @@
})
})
// add classes for styling lumbung kios and lumbung gallery cards
let cards = document.querySelectorAll('.shout.card');
[...cards].forEach(card => {
if (card.querySelector('a[href="/tags/lumbungkios"]') || card.querySelector('a[href="/tags/lumbungkiosproducts"]')) {
card.classList.add('lumbung-kios')
} else if (card.querySelector('a[href="/tags/lumbunggallery"]')) {
card.classList.add('lumbung-gallery')
}
})
// footer random color
var color = ['orange','green','blue'];
var footer = document.getElementById("footer");

54
themes/lumbung-theme/layouts/_default/list.html
View File

@ -4,40 +4,32 @@
<div class="h-feed">
{{ range where (.Paginator 13).Pages "Params.hidden" "ne" "true" }}
{{ if in .Params.categories "tv"}}
{{if eq .Section "tv"}}
{{- partial "video_box.html" . -}}
{{ else if in .Params.categories "calendar" }}
{{- partial "calendar_card.html" . -}}
{{ else if in .Params.categories "network" }}
{{- partial "network_card.html" . -}}
{{ else if in .Params.categories "shouts" }}
{{- partial "shout_card.html" . -}}
{{ else if in .Params.categories "pen" }}
{{- partial "pen_card.html" . -}}
{{ else if in .Params.categories "book" }}
{{- partial "book.html" . -}}
{{ else if in .Params.categories "page" }}
{{- partial "blank.html" . -}}
{{ else if eq .Section "events" }}
{{- partial "partials/calendar_card.html" . -}}
{{ else if eq .Section "shouts" }}
{{ if in .Params.sources "pen.lumbung.space" }}
{{- partial "pen_card.html" . -}}
{{ else }}
{{- partial "shout_card.html" . -}}
{{ end }}
{{ else if eq .Section "social" }}
{{- partial "social_card.html" . -}}
{{ else if eq .Section "publications"}}
{{- partial "book_card.html" . -}}
{{ else if eq .Section "sounds"}}
{{- partial "sounds_card.html" . -}}
{{ else }}
{{- partial "card.html" . -}}
{{ end }}
{{ end }}
{{ end }}
</div>

44
themes/lumbung-theme/layouts/index.html
View File

@ -6,22 +6,34 @@
<span class="date-marker">{{ .Key }}</span>
{{ range .Pages }}
{{ if in .Params.categories "tv"}}
{{- partial "video_box.html" . -}}
{{ else if in .Params.categories "calendar" }}
{{- partial "calendar_card.html" . -}}
{{ else if in .Params.categories "network" }}
{{- partial "network_card.html" . -}}
{{ else if in .Params.categories "pen" }}
{{- partial "pen_card.html" . -}}
{{ else if in .Params.categories "shouts" }}
{{- partial "shout_card.html" . -}}
{{ else if in .Params.categories "books.lumbung.space"}}
{{- partial "book_card.html" . -}}
{{ else }}
{{- partial "card.html" . -}}
{{ end }}
{{ end }}
{{if eq .Section "tv"}}
{{- partial "video_box.html" . -}}
{{ else if eq .Section "events" }}
{{- partial "partials/calendar_card.html" . -}}
{{ else if eq .Section "shouts" }}
{{ if in .Params.sources "pen.lumbung.space" }}
{{- partial "pen_card.html" . -}}
{{ else }}
{{- partial "shout_card.html" . -}}
{{ end }}
{{ else if eq .Section "social" }}
{{- partial "social_card.html" . -}}
{{ else if eq .Section "publications"}}
{{- partial "book_card.html" . -}}
{{ else if eq .Section "sounds"}}
{{- partial "sounds_card.html" . -}}
{{ else }}
{{- partial "card.html" . -}}
{{ end }}
{{ end }}
{{ end }}
</div>
<nav class="pagination-container">

262
themes/lumbung-theme/layouts/page/filter.html Normal file
View File

@ -0,0 +1,262 @@
<!DOCTYPE html>
<html{{ with .Site.LanguageCode }} lang="{{ . }}"{{ end }}>
<head>
<link rel="stylesheet" href="{{ "css/chroma.css" | relURL }}" />
<link rel="stylesheet" href="{{ "vendor/bare/css/bare.min.css" | relURL }}" />
<style>
/*** Important ***/
.tf-filter-item {
display: none;
}
button.active {
background-color: #ddd;
}
button.disable-button {
border-style: dashed;
}
.show-item {
display: inline-block;
}
/*** Aesthetics ***/
section {
margin-top: 18px !important;
}
.tf-items-container {
display: flex;
flex-direction: row;
flex-wrap: wrap;
}
.tf-item {
width: 250px;
margin: 8px;
background: #fff;
padding: 2rem;
box-shadow: 0 1px 4px 0 rgba(0, 0, 0, .2);
border-radius: 2px;
margin-bottom: 2rem
}
.chroma {
overflow-x: auto;
padding: 4px;
}
.panel {
padding: 0 18px;
max-height: 0;
overflow: hidden;
transition: max-height 0.2s ease-out;
}
.acc:after {
content: '\02795';
color: #fff;
margin-left: 5px;
}
.acc.active:after {
content: "\2796";
}
.navbtn {
padding: 0.5rem!important;
font-size: 90%!important;
}
.nava {
text-transform: none;
font-size: 90%!important;
}
</style>
</head>
<section>
{{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
{{ $sections := .Site.Params.mainSections }}
{{ $.Scratch.Set "authors" (slice ) }}
{{ $.Scratch.Set "noAuthors" 0 }}
{{ range where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
{{ with .Params.authors }}
{{ if eq ( printf "%T" . ) "[]string" }}
{{ if ( not ( in ($.Scratch.Get "authors") . ) ) }}
{{ $.Scratch.Add "authors" . }}
{{ end }}
{{ else if ( printf "%T" . ) "[]string" }}
{{ range . }}
{{ if ( not ( in ($.Scratch.Get "authors") . ) ) }}
{{ $.Scratch.Add "authors" . }}
{{ end }}
{{ end }}
{{ end }}
{{ else }}
{{ $.Scratch.Add "noAuthors" 1 }}
{{ end }}
{{ end }}
{{ $tags := $.Site.Taxonomies.tags.ByCount }}
{{ $.Scratch.Set "untagged" 0 }}
{{ range $pages }}
{{ with .Params.tags }}{{ else }}{{ $.Scratch.Add "untagged" 1 }}{{ end }}
{{ end }}
<div class="tf-wrapper">
<div class="tf-buttons-container flex-grow">
<h4>Sections</h4>
<button xx id="selectAllSections" onclick="htf.showAll('section')">
All Sections
</button>
{{ range $sections }}
<button xx class="sect-button" id="sect-{{ . | urlize }}" onclick="htf.checkFilter('{{ . | urlize }}', 'sect-')">
{{ . | title }} <span id="ssect-{{ . | urlize }}"> -count-</span> | <span id="csect-{{ . | urlize }}"> -count-</span>
</button>
{{ end }}
<h4>Authors</h4>
<button xx id="selectAllAuthors" onclick="htf.showAll('authors')">
All Authors
</button>
{{ range $.Scratch.Get "authors" }}
<button xx class="auth-button" id="auth-{{ . | replaceRE "[.]" "_" | urlize }}" onclick="htf.checkFilter('{{ . | replaceRE "[.]" "_" | urlize }}', 'auth-')">
{{ . }} <span id="sauth-{{ . | replaceRE "[.]" "_" | urlize }}"> -count-</span> | <span id="cauth-{{ . | replaceRE "[.]" "_" | urlize }}"> -count-</span>
</button>
{{ end }}
{{ if gt ( $.Scratch.Get "noAuthors") 0 }}
<button xx class="auth-button" id="auth-no-author" onclick="htf.checkFilter('no-author', 'auth-')">
No Author <span id="sauth-no-author"> -count-</span> | <span id="cauth-no-author"> -count-</span>
</button>
{{ end }}
<h4>Tags</h4>
<button xx class="" id="selectAllTags" onclick="htf.showAll('tags')">
All Tags
</button>
{{ range $tags }}
{{ if .Term }}
<button xx class="tag-button" id="tag-{{ .Term | replaceRE "[.]" "_" | urlize }}" onclick="htf.checkFilter('{{ .Term | replaceRE "[.]" "_" | urlize }}', 'tag-')">
<span>{{.Term | humanize | title }}</span>
<span id="stags-{{ .Term | urlize }}"> -count-</span> | <span id="ctags-{{ .Term | urlize }}"> -count-</span>
</button>
{{ end }}
{{ end }}
{{ if gt ( $.Scratch.Get "untagged") 0 }}
<button xx class="tag-button" id="tag-tfuntagged" onclick="htf.checkFilter('tfuntagged', 'tag-')">
Untagged <span id="stags-tfuntagged"> -count-</span> | <span id="ctags-tfuntagged"> -count-</span>
</button>
{{ end }}
<hr >
</div>
<hr >
<div><h2><span id="selectedItemCount"></span> Items</h2></div>
<div class="tf-items-container">
{{ range $pages.ByPublishDate.Reverse }}
{{ if in .Params.categories "tv"}}
{{- partial "video_box.html" . -}}
{{ else if in .Params.categories "calendar" }}
{{- partial "calendar_card.html" . -}}
{{ else if in .Params.categories "network" }}
{{- partial "network_card.html" . -}}
{{ else if in .Params.categories "pen" }}
{{- partial "pen_card.html" . -}}
{{ else if in .Params.categories "shouts" }}
{{- partial "shout_card.html" . -}}
{{ else if in .Params.categories "books.lumbung.space"}}
{{- partial "book_card.html" . -}}
{{ else }}
{{- partial "card.html" . -}}
{{ end }}
{{ end }}
</div>
</div>
<script src="{{ "vendor/htf/hugotagsfilter-1.2.2.min.js" | relURL}}"></script>
<!--<script src="{{ "hugotagsfilter.js" | relURL}}"></script>-->
<script>
var htfConfig = {
filters: [
{
name: 'tags',
prefix: 'tag-',
buttonClass: 'tag-button',
allSelector: '#selectAllTags',
attrName: 'data-tags',
selectedPrefix: 'stags-',
countPrefix: 'ctags-'
},
{
name: 'section',
prefix: 'sect-',
buttonClass: 'sect-button',
allSelector: '#selectAllSections',
attrName: 'data-section',
selectedPrefix: 'ssect-',
countPrefix: 'csect-'
},
{
name: 'authors',
prefix: 'auth-',
buttonClass: 'auth-button',
allSelector: '#selectAllAuthors',
attrName: 'data-authors',
selectedPrefix: 'sauth-',
countPrefix: 'cauth-'
}
],
showItemClass: "show-item",
filterItemClass: "filter-item",
activeButtonClass: "active",
counterSelector: "selectedItemCount",
populateCount: true,
setDisabledButtonClass: "disable-button"
}
var htf = new HugoTagsFilter(htfConfig);
</script>
<script>
function toggleAcc(el) {
el.classList.toggle("active")
var panel = el.nextElementSibling;
if (panel.style.maxHeight){
panel.style.maxHeight = null;
} else {
panel.style.maxHeight = panel.scrollHeight + "px";
}
}
</script>
</section>
</body>
</html>

39
themes/lumbung-theme/layouts/partials/book_card.html Normal file
View File

@ -0,0 +1,39 @@
<div class='book card'>
<article class="h-entry book">
<div class="tape-label book"><span><time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time></span><div></div></div>
{{ $postPermalink := .Permalink}}
</header>
{{ with (index (.Resources.ByType "image") 0) }}
{{ $height := add .Height 0.0}}
{{ $ratio := div $height .Width}}
{{ $thumb := .Fit "540x540 q80 webp"}}
<div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}" alt="{{ .Title }}"> </a>
</div>
{{ else }}
<div class="p-summary">
{{ end }}
<header>
<h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">
{{.Title}}</a></h2>
</header>
<div class="summary-text">
{{ .Summary }}
</div>
</div>
<div class="shout-source"></div>
<footer class='post-footer'>
<div class='footer-metadata'>
<span class="from p-author">{{ if .Params.authors }}By {{range .Params.authors}}<b> <a href='{{ "/authors/" | relLangURL }}{{ . | urlize }}/'> {{ . }}</a> {{end}}</b> on{{ end }}</span>
{{ if .Truncated }}
<div class="footer-filler"></div>
<div class='read-more'><a href="{{ .RelPermalink }}">Read More…</a></div>
{{ end }}
</footer>
</article>
</div>

121
themes/lumbung-theme/layouts/partials/filter-nav.html Normal file
View File

@ -0,0 +1,121 @@
<div class="filter-link"><svg class="filter-icon" enable-background="new 0 0 510.2 512" version="1.1" viewBox="0 0 510.2 512" xmlns="http://www.w3.org/2000/svg"><path d="m499.1 0c2.8 2.2 6.2 4 8.3 6.8 4.4 5.8 3.5 12.6-1.9 19.2-15.7 19.4-31.5 38.8-47.3 58.2-41.2 50.8-82.5 101.6-123.8 152.4-2 2.4-3.9 3.4-7.1 3.4-48.2-0.1-96.3-0.1-144.5 0-3.2 0-5.1-1-7.1-3.4-56.4-69.6-112.9-139.1-169.4-208.7-9.7-11.9-8.3-20.3 4.8-27.9h488z"/><path d="m206.1 512c-8.7-4-11.2-10.8-11.1-20.2 0.3-71.8 0.1-143.6 0.1-215.4v-6.2h120v5.5c0 57.6-0.1 115.3 0.1 172.9 0 8.7-3.3 14.4-11.1 18.2-29.9 14.6-59.6 29.6-89.4 44.4-0.3 0.1-0.4 0.5-0.6 0.7-2.7 0.1-5.3 0.1-8 0.1z"/></svg><span>Filter</span></div>
{{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
{{ $sections := .Site.Params.mainSections }}
{{ $.Scratch.Set "authors" (slice ) }}
{{ $.Scratch.Set "noAuthors" 0 }}
{{ range where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
{{ with .Params.authors }}
{{ if eq ( printf "%T" . ) "[]string" }}
{{ if ( not ( in ($.Scratch.Get "authors") . ) ) }}
{{ $.Scratch.Add "authors" . }}
{{ end }}
{{ else if ( printf "%T" . ) "[]string" }}
{{ range . }}
{{ if ( not ( in ($.Scratch.Get "authors") . ) ) }}
{{ $.Scratch.Add "authors" . }}
{{ end }}
{{ end }}
{{ end }}
{{ else }}
{{ $.Scratch.Add "noAuthors" 1 }}
{{ end }}
{{ end }}
{{ $.Scratch.Set "cats" (slice ) }}
{{ $.Scratch.Set "nocat" 0 }}
{{ range where .Site.RegularPages "Type" "in" .Site.Params.mainSections }}
{{ with .Params.categories }}
{{ if eq ( printf "%T" . ) "[]string" }}
{{ if ( not ( in ($.Scratch.Get "cats") . ) ) }}
{{ $.Scratch.Add "cats" . }}
{{ end }}
{{ end }}
{{ else }}
{{ $.Scratch.Add "nocat" 1 }}
{{ end }}
{{ end }}
{{ $tags := $.Site.Taxonomies.tags.ByCount }}
{{ $.Scratch.Set "untagged" 0 }}
{{ range $pages }}
{{ with .Params.tags }}{{ else }}{{ $.Scratch.Add "untagged" 1 }}{{ end }}
{{ end }}
<div class="filter-buttons-container">
<div class="filter-buttons-container-header">
<div><span id="selectedItemCount"></span> Items</div>
<a href="" class="load-all">Load all Items</a>
</div>
<div class="filter-buttons">
<button xx id="selectAllSections" onclick="htf.showAll('section')">
All Sections
</button>
{{ range $sections }}
<button xx class="sect-button filter-button" id="sect-{{ . | urlize }}" onclick="htf.checkFilter('{{ . | urlize }}', 'sect-')">
{{ . | title }} <span id="ssect-{{ . | urlize }}"> -count-</span> | <span id="csect-{{ . | urlize }}"> -count-</span>
</button>
{{ end }}
</div>
<div class="filter-buttons">
<button xx id="selectAllAuthors" onclick="htf.showAll('authors')">
All Authors
</button>
{{ range .Site.Taxonomies.authors }}
<button xx class="auth-button filter-button" id="auth-{{ .Page.Title | replaceRE "[.]" "_" | urlize }}" onclick="htf.checkFilter('{{ .Page.Title | replaceRE "[.]" "_" | urlize }}', 'auth-')">
{{ .Page.Title }} <span id="sauth-{{ .Page.Title | replaceRE "[.]" "_" | urlize }}"> -count-</span> | <span id="cauth-{{ .Page.Title | replaceRE "[.]" "_" | urlize }}"> -count-</span>
</button>
{{ end }}
{{ if gt ( $.Scratch.Get "noAuthors") 0 }}
<button xx class="auth-button" id="auth-no-author" onclick="htf.checkFilter('no-author', 'auth-')">
No Author <span id="sauth-no-author"> -count-</span> | <span id="cauth-no-author"> -count-</span>
</button>
{{ end }}
</div>
<div class="filter-buttons">
<button xx id="selectAllCats" onclick="htf.showAll('cats')">
All Categories
</button>
{{ range .Site.Taxonomies.categories }}
<button xx class="cat-button filter-button" id="cat-{{ .Page.Title | replaceRE "[.]" "_" | urlize }}" onclick="htf.checkFilter('{{ .Page.Title | replaceRE "[.]" "_" | urlize }}', 'cat-')">
{{ .Page.Title }} <span id="scat-{{ .Page.Title | replaceRE "[.]" "_" | urlize }}"> -count-</span> | <span id="ccat-{{ .Page.Title | replaceRE "[.]" "_" | urlize }}"> -count-</span>
</button>
{{ end }}
{{ if gt ( $.Scratch.Get "nocat") 0 }}
<button xx class="cat-button" id="cat-no-cat" onclick="htf.checkFilter('no-cat', 'cat-')">
No Categories <span id="scat-no-cat"> -count-</span> | <span id="ccat-no-cat"> -count-</span>
</button>
{{ end }}
</div>
<div class="filter-buttons">
<button xx class="" id="selectAllTags" onclick="htf.showAll('tags')">
All Tags
</button>
{{ range $tags }}
{{ if .Term }}
<button xx class="tag-button filter-button" id="tag-{{ .Term | replaceRE "[.]" "_" | urlize }}" onclick="htf.checkFilter('{{ .Term | replaceRE "[.]" "_" | urlize }}', 'tag-')">
<span>{{.Term | humanize | title }}</span>
<span id="stags-{{ .Term | urlize }}"> -count-</span> | <span id="ctags-{{ .Term | urlize }}"> -count-</span>
</button>
{{ end }}
{{ end }}
{{ if gt ( $.Scratch.Get "untagged") 0 }}
<button xx class="tag-button" id="tag-tfuntagged" onclick="htf.checkFilter('tfuntagged', 'tag-')">
Untagged <span id="stags-tfuntagged"> -count-</span> | <span id="ctags-tfuntagged"> -count-</span>
</button>
{{ end }}
</div>
</div>

12
themes/lumbung-theme/layouts/partials/header.html
View File

@ -3,7 +3,6 @@
<a href="/" class="home-link">
<img class="logo" src="/img/logo.svg" alt="{{ .Site.Title }}">
</a>
<a href="https://members.lumbung.space" class="login-link">Login</a>
</div>
</header>
<div class="menu-row">
@ -15,13 +14,13 @@
<li class="has-submenu">about
<ul class="submenu">
<li><a href="/about/">about us</a></li>
<li><a href="/contributors/">contributors</a></li>
<li><a href="/ls-contributors/">contributors</a></li>
</ul>
</li>
<li><a href="/calendar/">calendar</a></li>
<li><a href="/events/">calendar</a></li>
<li><a href="/tv/">tv</a></li>
<li><a href="/social/">social</a></li>
<li><a href="/pen/">pen</a></li>
<li><a href="/sources/pen.lumbung.space/">pen</a></li>
<li><a href="/shouts/">shouts</a></li>
<li class="has-submenu">ekonomi
<ul class="submenu">
@ -29,12 +28,10 @@
<li><a href="/tags/lumbunggallery/">gallery</a></li>
</ul>
</li>
<li><a href="https://books.lumbung.space">books</a></li>
<li><a href="https://members.lumbung.space" class="login-link">Login</a></li>
</ul>
</nav>
{{- partial "filter-nav.html" . -}}
<div class="mobile-menu-button">
<div class="mobile-menu-button--line"></div>
<div class="mobile-menu-button--line"></div>
@ -42,3 +39,4 @@
</div>
</div>
</header>

47
themes/lumbung-theme/layouts/partials/network_card.html
View File

@ -1,47 +0,0 @@
<div class='network card {{ .Params.feed_name }}'>
<article class="h-entry network">
<header>
{{ $postPermalink := .Permalink}}
<time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
<h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">{{ .Title }}</a></h2>
</header>
<div class="network-source"><span class="from p-author">From {{ if .Params.authors }}<b>{{range .Params.authors}} <a href='{{ "/authors/" | relLangURL }}{{ . | urlize }}/'> {{ . }}</a> {{end}}</b> at {{ end }}<a href="{{ "/categories/" | relLangURL }}{{ .Params.feed_name | urlize }}">{{ .Params.feed_name }}</a></span></div>
{{ if .Params.featured_image }}
{{ $img := .Resources.GetMatch .Params.featured_image }}
{{ $height := add $img.Height 0.0}}
{{ $ratio := div $height $img.Width}}
{{ $thumb := $img.Fit "540x540 q80 webp"}}
<div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}" alt="{{ .Title }}"> </a>
</div>
{{ else if (.Resources.ByType "image") }}
{{ with (index (.Resources.ByType "image") 0) }}
{{ $img := . }}
{{ $height := add .Height 0.0}}
{{ $ratio := div $height .Width}}
{{ $thumb := .Fit "540x540 q80 webp"}}
<div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}" alt="{{ .Title }}"> </a>
</div>
{{ end }}
{{ else }}
<div class="p-summary">
{{ end }}
<div class="summary-text">
{{ .Summary }}
</div>
</div>
<footer class='post-footer'>
<a href="{{ .RelPermalink }}">
<svg width="11" height="11" viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg">
<path d="M10.2172 3.892C9.86979 3.02585 9.33722 2.34509 8.61023 1.77874C8.23826 1.49028 7.72957 1.04191 7.21547 0.839212C7.21382 0.703503 7.14487 0.575079 6.97767 0.503871C5.42624 -0.162284 3.69503 0.311299 2.52647 1.51482C1.94635 2.11223 1.51951 2.8478 1.21108 3.62501C0.914861 4.3676 0.507572 5.32483 0.948415 6.07996C1.00646 6.17836 1.09356 6.24193 1.1908 6.27306C1.2735 7.35573 1.57765 8.46801 2.37847 9.21874C3.2325 10.0162 4.43613 10.3053 5.5673 10.1773C6.72371 10.0468 7.96432 9.57061 8.8816 8.82474C9.01086 8.71974 9.1274 8.60844 9.23337 8.49296C9.27968 8.4924 9.32805 8.4875 9.37839 8.4718C11.3643 7.82491 10.8101 5.37347 10.2172 3.892Z" />
</svg>
</a>
</footer>
</article>
</div>

2
themes/lumbung-theme/layouts/partials/pen_card.html
View File

@ -1,7 +1,7 @@
<div class='pen card {{ .Params.feed_name }}'>
<article class="h-entry pen">
<header>
<div class="pen-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="pen-source"><span class="from p-author">From {{ if .Params.contributors }}<b>{{range .Params.contributors}} <a href='{{ "/contributors/" | relLangURL }}{{ . | urlize }}/'> {{ . }}</a> {{end}}</b> at {{ end }}<a href="{{ "/sources/" | relLangURL }}{{ .Params.feed_name | urlize }}">{{ .Params.feed_name }}</a></span></div>
{{ $postPermalink := .Permalink}}
<time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>

91
themes/lumbung-theme/layouts/partials/shout_card.html
View File

@ -1,49 +1,48 @@
<div class='shout card {{ .Params.feed_name }}'>
<article class="h-entry shout">
<header>
{{ $postPermalink := .Permalink}}
<h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">
{{ range $i, $e := .Params.tags -}}
{{- if $i -}} {{ end -}}
<a href='{{ "/tags/" | relLangURL }}{{ . | urlize }}'>#{{ $e | humanize | lower }}</a>
{{- end -}}
</a></h2>
</header>
<article class="h-entry shout">
<header>
{{ $postPermalink := .Permalink}}
<time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
<h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">{{ .Title }}</a></h2>
</header>
<div class="shout-source"><span class="from p-author">From {{ if .Params.contributors }}<b>{{range .Params.contributors}} <a href='{{ "/contributors/" | relLangURL }}{{ . | urlize }}/'> {{ . }}</a> {{end}}</b> at {{ end }}<a href="{{ "/sources/" | relLangURL }}{{ .Params.feed_name | urlize }}">{{ .Params.feed_name }}</a></span></div>
{{ with (index (.Resources.ByType "video") 0) }}
{{/* TODO this current logic does not suport video & image mixed */}}
<div class="p-summary">
<video controls width="540px" preload="none" poster="{{ $postPermalink }}/thumbnail.png">
<source src="{{.Permalink}}" type="video/mp4">
</video>
{{ else}}
{{ with (index (.Resources.ByType "image") 0) }}
{{ $height := add .Height 0.0}}
{{ $ratio := div $height .Width}}
{{ $thumb := .Fit "540x540 q80 webp"}}
<div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}" alt="{{ .Title }}"> </a>
{{ if .Params.featured_image }}
{{ with $img := .Resources.GetMatch .Params.featured_image }}
{{ $height := add $img.Height 0.0}}
{{ $ratio := div $height $img.Width}}
{{ $thumb := $img.Fit "540x540 q80 webp"}}
<div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}" alt="{{ .Title }}"> </a>
</div>
{{end}}
{{ else if (.Resources.ByType "image") }}
{{ with (index (.Resources.ByType "image") 0) }}
{{ $img := . }}
{{ $height := add .Height 0.0}}
{{ $ratio := div $height .Width}}
{{ $thumb := .Fit "540x540 q80 webp"}}
<div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}" alt="{{ .Title }}"> </a>
</div>
{{ end }}
{{ else }}
<div class="p-summary">
{{ end }}
<div class="summary-text">
{{ .Summary }}
</div>
{{ else }}
<div class="p-summary">
{{ end }}
{{ end }}
<div class="summary-text">
{{ .Summary }}
</div>
</div>
<div class="shout-source"></div>
<footer class='post-footer'>
<div class='footer-metadata'>
<span class="from p-author">{{ if .Params.authors }}From {{range .Params.authors}}<b> <a href='{{ "/authors/" | relLangURL }}{{ . | urlize }}/'> {{ . }}</a> {{end}}</b> on{{ end }}</span>
<time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
</div>
{{ if .Truncated }}
<div class="footer-filler"></div>
<div class='read-more'><a href="{{ .RelPermalink }}">Read More…</a></div>
{{ end }}
</footer>
</article>
</div>
</div>
<footer class='post-footer'>
<a href="{{ .RelPermalink }}">
<svg width="11" height="11" viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg">
<path d="M10.2172 3.892C9.86979 3.02585 9.33722 2.34509 8.61023 1.77874C8.23826 1.49028 7.72957 1.04191 7.21547 0.839212C7.21382 0.703503 7.14487 0.575079 6.97767 0.503871C5.42624 -0.162284 3.69503 0.311299 2.52647 1.51482C1.94635 2.11223 1.51951 2.8478 1.21108 3.62501C0.914861 4.3676 0.507572 5.32483 0.948415 6.07996C1.00646 6.17836 1.09356 6.24193 1.1908 6.27306C1.2735 7.35573 1.57765 8.46801 2.37847 9.21874C3.2325 10.0162 4.43613 10.3053 5.5673 10.1773C6.72371 10.0468 7.96432 9.57061 8.8816 8.82474C9.01086 8.71974 9.1274 8.60844 9.23337 8.49296C9.27968 8.4924 9.32805 8.4875 9.37839 8.4718C11.3643 7.82491 10.8101 5.37347 10.2172 3.892Z" />
</svg>
</a>
</footer>
</article>
</div>

49
themes/lumbung-theme/layouts/partials/social_card.html Normal file
View File

@ -0,0 +1,49 @@
<div class='social card {{ range .Params.tags }}{{ if or (eq . "lumbungkios") (eq . "lumbunggallery")}}{{.}}{{ end }}{{ end }}'>
<article class="h-entry social">
<header>
{{ $postPermalink := .Permalink}}
<h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">
{{ range $i, $e := .Params.tags -}}
{{- if $i -}} {{ end -}}
<a href='{{ "/tags/" | relLangURL }}{{ . | urlize }}'>#{{ $e | humanize | lower }}</a>
{{- end -}}
</a></h2>
</header>
{{ with (index (.Resources.ByType "video") 0) }}
{{/* TODO this current logic does not suport video & image mixed */}}
<div class="p-summary">
<video controls width="540px" preload="none" poster="{{ $postPermalink }}/thumbnail.png">
<source src="{{.Permalink}}" type="video/mp4">
</video>
{{ else}}
{{ with (index (.Resources.ByType "image") 0) }}
{{ $height := add .Height 0.0}}
{{ $ratio := div $height .Width}}
{{ $thumb := .Fit "540x540 q80 webp"}}
<div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
<a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}" alt="{{ .Title }}"> </a>
</div>
{{ else }}
<div class="p-summary">
{{ end }}
{{ end }}
<div class="summary-text">
{{ .Summary }}
</div>
</div>
<div class="social-source"></div>
<footer class='post-footer'>
<div class='footer-metadata'>
<span class="from p-author">{{ if .Params.contributors }}From {{range .Params.contributors}}<b> <a href='{{ "/contributors/" | relLangURL }}{{ . | urlize }}/'> {{ . }}</a> {{end}}</b> on{{ end }}</span>
<time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
</div>
{{ if .Truncated }}
<div class="footer-filler"></div>
<div class='read-more'><a href="{{ .RelPermalink }}">Read More…</a></div>
{{ end }}
</footer>
</article>
</div>

85
themes/lumbung-theme/static/css/main.css
View File

@ -174,8 +174,9 @@ a {
.home-link {
display: block;
max-width: 700px;
width: 70%;
width: 50%;
padding: 0;
margin: auto;
}
.logo {
@ -184,7 +185,7 @@ a {
height: auto;
}
#top-menu .login-link {
.login-link {
background: #009d9b;
padding: 5px 30px;
color: #fff;
@ -194,7 +195,6 @@ a {
.menu-row {
margin: 0 auto;
max-width: 80%;
width: 100%;
display: flex;
justify-content: space-between;
align-items: center;
@ -408,6 +408,7 @@ a {
.h-entry header h2 a {
text-decoration: none;
color: var(--border-color);
word-wrap: anywhere;
}
.h-entry header .header-metadata {
@ -475,9 +476,9 @@ footer.post-footer {
}
/* network cards */
/* shout cards */
.card.network {
.card.shout {
border: 2px solid var(--shouts-dark);
background-color: var(--shouts-light);
max-width: min-content;
@ -489,70 +490,70 @@ footer.post-footer {
}
.h-entry.network header {
.h-entry.shout header {
display: flex;
flex-direction: column;
}
.h-entry.network header h2 {
.h-entry.shout header h2 {
padding: 0.2em 0.5em 0.5em 0.5em;
margin: 0;
border: none;
}
.h-entry.network header h2:hover {
.h-entry.shout header h2:hover {
cursor: pointer;
}
.h-entry.network header h2 a {
.h-entry.shout header h2 a {
text-decoration: none;
color: var(--shouts-dark);
}
.h-entry.network header time {
.h-entry.shout header time {
text-align: right;
padding: 0.6em 0.8em;
font-size: 1rem;
}
.network .header-metadata {
.shout .header-metadata {
align-items: center;
}
.network .header-metadata .dt-published {
.shout .header-metadata .dt-published {
border-bottom: 2px solid var(--shouts-dark);
}
.network .filler {
.shout .filler {
min-height: 1rem;
}
.network .author.p-author {
.shout .author.p-author {
border-color: var(--shouts-dark);
padding: 0.5em 1.2em 0.5em 1.2em;
}
.network .p-summary {
.shout .p-summary {
display: flex;
}
.network .p-summary.portrait {
.shout .p-summary.portrait {
/* flex-direction: row; */
}
.network .p-summary.landscape {
.shout .p-summary.landscape {
flex-direction: column;
}
.network .summary-image > img {
.shout .summary-image > img {
display: inherit;
}
.network .summary-text {
.shout .summary-text {
font-size: 18px;
}
div.network-source {
div.shout-source {
padding: 1em;
padding-right: 2em;
width: fit-content;
@ -565,7 +566,7 @@ div.network-source {
right: 1em;
}
.network-source .triangle {
.shout-source .triangle {
position: absolute;
right: 0px;
bottom: 0;
@ -576,17 +577,17 @@ div.network-source {
fill: var(--shouts-dark);
}
.network-source a {
.shout-source a {
font-weight: bold;
color: white;
}
.network .footer-filler {
.shout .footer-filler {
border-left: 2px solid var(--shouts-dark);
border-top: none;
}
.network footer.post-footer {
.shout footer.post-footer {
border-top: 2px solid var(--shouts-dark);
flex-flow: row;
font-size: 0.9rem;
@ -595,17 +596,17 @@ div.network-source {
padding: 1em;
}
.network footer svg {
.shout footer svg {
fill: var(--shouts-dark)
}
.network .read-more {
.shout .read-more {
border: none;
border-left: 2px solid var(--shouts-dark);
padding: 0.5em 1.2em 0.5em 1.2em;
}
.network .footer-metadata {
.shout .footer-metadata {
padding: 0.5em 1.2em 0.5em 1.2em;
}
@ -736,9 +737,9 @@ div.pen-source {
padding: 0.5em 1.2em 0.5em 1.2em;
}
/* shouts cards */
/* social / hashtag cards */
.card.shout {
.card.social {
border-color: steelblue;
border: 2px solid;
background-color: aliceblue;
@ -750,24 +751,24 @@ div.pen-source {
color: steelblue;
}
.card.shout h2 a {
.card.social h2 a {
color: var(--social-dark);
cursor: pointer;
display: block;
word-wrap: anywhere;
}
.card .card.shout h2 a:hover {
.card .card.social h2 a:hover {
border: none;
text-decoration: none;
}
.card.shout .post-footer {
.card.social .post-footer {
background: var(--social-light);
color: var(--social-dark);
}
.card.shout .post-footer a{
.card.social .post-footer a{
background: var(--social-light);
color: var(--social-dark);
text-decoration: underline;
@ -775,42 +776,42 @@ div.pen-source {
/* gallery cards */
.card.shout.lumbung-gallery {
.card.social.lumbunggallery {
border-color: var(--gallery-dark);
background-color: var(--gallery-light);
color: var(--gallery-dark);
}
.card.shout.lumbung-gallery h2 a {
.card.social.lumbunggallery h2 a {
color: var(--gallery-dark);
}
.card.shout.lumbung-gallery .post-footer {
.card.social.lumbunggallery .post-footer {
background: var(--gallery-light);
color: var(--gallery-dark);
border-top: 2px solid;
}
/* kios cards */
.card.shout.lumbung-kios {
.card.social.lumbungkios {
border-color: var(--kios-dark);
background-color: var(--kios-light);
color: var(--kios-dark);
}
.card.shout.lumbung-kios h2 a {
.card.social.lumbungkios h2 a {
color: var(--kios-dark);
}
.card.shout.lumbung-kios .post-footer {
.card.social.lumbungkios .post-footer {
background: var(--kios-light);
color: var(--kios-dark);
border-top: 2px solid;
}
.card.shout.lumbung-kios .post-footer a {
.card.social.lumbungkios .post-footer a {
background: none;
color: var(--kios-dark);
}
@ -1084,7 +1085,7 @@ li.page-item:after {
/* FILTER */
.filter-item, .card, .video-box {
display: none;
/* display: none;*/
}
.show-item {
@ -1911,7 +1912,7 @@ a.timeline-url {
/* card styles */
.card,
.card.network {
.card.shout {
max-width: 83vw;
}