forked from ruangrupa/lumbung.space
Compare commits
2 Commits
14eb01e513
...
475a614959
Author | SHA1 | Date |
---|---|---|
rra | 475a614959 | |
rra | a226b45bc0 |
10
config.toml
10
config.toml
|
@ -3,6 +3,8 @@ languageCode = "en-gb"
|
||||||
title = "lumbung.space"
|
title = "lumbung.space"
|
||||||
theme = "lumbung-theme"
|
theme = "lumbung-theme"
|
||||||
pluralizeListTitles = "false"
|
pluralizeListTitles = "false"
|
||||||
|
paginate = 20
|
||||||
|
|
||||||
|
|
||||||
[params]
|
[params]
|
||||||
logo = "/img/logo.svg"
|
logo = "/img/logo.svg"
|
||||||
|
@ -10,15 +12,21 @@ pluralizeListTitles = "false"
|
||||||
description = 'a digital living room for the lumbung ekosistem'
|
description = 'a digital living room for the lumbung ekosistem'
|
||||||
images = ['/img/logo.png']
|
images = ['/img/logo.png']
|
||||||
title = 'lumbung dot space'
|
title = 'lumbung dot space'
|
||||||
|
bundleCss = "/bundle.css"
|
||||||
|
bundleJs = "/bundle.js"
|
||||||
|
mainSections = ['social', 'shouts', 'calendar', 'tv', 'pen']
|
||||||
|
|
||||||
[markup.goldmark.renderer]
|
[markup.goldmark.renderer]
|
||||||
unsafe = true
|
unsafe = true
|
||||||
|
|
||||||
[taxonomies]
|
[taxonomies]
|
||||||
author = "authors"
|
author = "authors"
|
||||||
|
contributor = "contributors"
|
||||||
tag = "tags"
|
tag = "tags"
|
||||||
category = "categories"
|
source = "sources"
|
||||||
timeline = "timelines"
|
timeline = "timelines"
|
||||||
|
|
||||||
[permalinks]
|
[permalinks]
|
||||||
timelines = "/timeline/:slug/"
|
timelines = "/timeline/:slug/"
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -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
|
// footer random color
|
||||||
var color = ['orange','green','blue'];
|
var color = ['orange','green','blue'];
|
||||||
var footer = document.getElementById("footer");
|
var footer = document.getElementById("footer");
|
||||||
|
|
|
@ -4,40 +4,32 @@
|
||||||
<div class="h-feed">
|
<div class="h-feed">
|
||||||
{{ range where (.Paginator 13).Pages "Params.hidden" "ne" "true" }}
|
{{ range where (.Paginator 13).Pages "Params.hidden" "ne" "true" }}
|
||||||
|
|
||||||
{{ if in .Params.categories "tv"}}
|
{{if eq .Section "tv"}}
|
||||||
|
|
||||||
{{- partial "video_box.html" . -}}
|
{{- partial "video_box.html" . -}}
|
||||||
|
|
||||||
{{ else if in .Params.categories "calendar" }}
|
{{ else if eq .Section "events" }}
|
||||||
|
{{- partial "partials/calendar_card.html" . -}}
|
||||||
{{- partial "calendar_card.html" . -}}
|
|
||||||
|
{{ else if eq .Section "shouts" }}
|
||||||
{{ else if in .Params.categories "network" }}
|
{{ if in .Params.sources "pen.lumbung.space" }}
|
||||||
|
{{- partial "pen_card.html" . -}}
|
||||||
{{- partial "network_card.html" . -}}
|
{{ else }}
|
||||||
|
{{- partial "shout_card.html" . -}}
|
||||||
{{ else if in .Params.categories "shouts" }}
|
{{ end }}
|
||||||
|
|
||||||
{{- partial "shout_card.html" . -}}
|
{{ else if eq .Section "social" }}
|
||||||
|
{{- partial "social_card.html" . -}}
|
||||||
{{ else if in .Params.categories "pen" }}
|
|
||||||
|
{{ else if eq .Section "publications"}}
|
||||||
{{- partial "pen_card.html" . -}}
|
{{- partial "book_card.html" . -}}
|
||||||
|
|
||||||
{{ else if in .Params.categories "book" }}
|
{{ else if eq .Section "sounds"}}
|
||||||
|
{{- partial "sounds_card.html" . -}}
|
||||||
{{- partial "book.html" . -}}
|
|
||||||
|
|
||||||
{{ else if in .Params.categories "page" }}
|
|
||||||
|
|
||||||
{{- partial "blank.html" . -}}
|
|
||||||
|
|
||||||
{{ else }}
|
{{ else }}
|
||||||
|
|
||||||
{{- partial "card.html" . -}}
|
{{- partial "card.html" . -}}
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
|
||||||
{{ end }}
|
{{ end }}
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
|
@ -6,22 +6,34 @@
|
||||||
|
|
||||||
<span class="date-marker">{{ .Key }}</span>
|
<span class="date-marker">{{ .Key }}</span>
|
||||||
{{ range .Pages }}
|
{{ range .Pages }}
|
||||||
{{ if in .Params.categories "tv"}}
|
|
||||||
{{- partial "video_box.html" . -}}
|
{{if eq .Section "tv"}}
|
||||||
{{ else if in .Params.categories "calendar" }}
|
{{- partial "video_box.html" . -}}
|
||||||
{{- partial "calendar_card.html" . -}}
|
|
||||||
{{ else if in .Params.categories "network" }}
|
{{ else if eq .Section "events" }}
|
||||||
{{- partial "network_card.html" . -}}
|
{{- partial "partials/calendar_card.html" . -}}
|
||||||
{{ else if in .Params.categories "pen" }}
|
|
||||||
{{- partial "pen_card.html" . -}}
|
{{ else if eq .Section "shouts" }}
|
||||||
{{ else if in .Params.categories "shouts" }}
|
{{ if in .Params.sources "pen.lumbung.space" }}
|
||||||
{{- partial "shout_card.html" . -}}
|
{{- partial "pen_card.html" . -}}
|
||||||
{{ else if in .Params.categories "books.lumbung.space"}}
|
{{ else }}
|
||||||
{{- partial "book_card.html" . -}}
|
{{- partial "shout_card.html" . -}}
|
||||||
{{ else }}
|
{{ end }}
|
||||||
{{- partial "card.html" . -}}
|
|
||||||
{{ end }}
|
{{ else if eq .Section "social" }}
|
||||||
{{ end }}
|
{{- 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 }}
|
{{ end }}
|
||||||
</div>
|
</div>
|
||||||
<nav class="pagination-container">
|
<nav class="pagination-container">
|
||||||
|
|
|
@ -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>
|
|
@ -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>
|
|
@ -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>
|
|
@ -1,36 +1,26 @@
|
||||||
<header id="top-menu">
|
<header id="top-menu">
|
||||||
<div class="mobile-menu">
|
<div class="header-row">
|
||||||
<button class="hamburger" onclick="this.classList.toggle('opened'); document.querySelector('.drawer').classList.toggle('opened');">
|
<a href="/" class="home-link">
|
||||||
<svg width="30" fill="#3C3D3D" viewBox="0 0 50 40">
|
<img class="logo" src="/img/logo.svg" alt="{{ .Site.Title }}">
|
||||||
<g>
|
</a>
|
||||||
<path class="top" d="M0 8h50v3H0z"/>
|
|
||||||
<path class="bottom" d="M0 28h50v3H0z"/>
|
|
||||||
<path class="middle" d="M0 18h50v3H0z"/>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
</button>
|
|
||||||
<a href="https://members.lumbung.space" id="login">login</a>
|
|
||||||
</div>
|
</div>
|
||||||
|
</header>
|
||||||
<a href="/" class="home-link">
|
<div class="menu-row">
|
||||||
<img class="logo" src="{{ .Site.Params.Logo }}" alt="{{ .Site.Title }}">
|
|
||||||
</a>
|
|
||||||
|
|
||||||
<nav class="menu">
|
<nav class="menu">
|
||||||
|
<img class="menu-dot" src="/img/black-dot.svg" alt="black dot">
|
||||||
<ul>
|
<ul>
|
||||||
<li><a href="/">home</a></li>
|
|
||||||
<li><a href="/timeline/">harvest</a></li>
|
<li><a href="/timeline/">harvest</a></li>
|
||||||
{{/* <li><a href="/about/">about</a></li> */}}
|
{{/* <li><a href="/about/">about</a></li> */}}
|
||||||
<li class="has-submenu">about
|
<li class="has-submenu">about
|
||||||
<ul class="submenu">
|
<ul class="submenu">
|
||||||
<li><a href="/about/">about us</a></li>
|
<li><a href="/about/">about us</a></li>
|
||||||
<li><a href="/contributors/">contributors</a></li>
|
<li><a href="/ls-contributors/">contributors</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</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="/tv/">tv</a></li>
|
||||||
<li><a href="/social/">social</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><a href="/shouts/">shouts</a></li>
|
||||||
<li class="has-submenu">ekonomi
|
<li class="has-submenu">ekonomi
|
||||||
<ul class="submenu">
|
<ul class="submenu">
|
||||||
|
@ -38,32 +28,15 @@
|
||||||
<li><a href="/tags/lumbunggallery/">gallery</a></li>
|
<li><a href="/tags/lumbunggallery/">gallery</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</li>
|
</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>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
<aside class="drawer">
|
<div class="mobile-menu-button">
|
||||||
<ul>
|
<div class="mobile-menu-button--line"></div>
|
||||||
<li><a href="/">home</a></li>
|
<div class="mobile-menu-button--line"></div>
|
||||||
<li><a href="/timeline/">harvest</a></li>
|
<div class="mobile-menu-button--line"></div>
|
||||||
<li class="has-submenu">about
|
</div>
|
||||||
<ul class="submenu">
|
|
||||||
<li><a href="/about/">about us</a></li>
|
</div>
|
||||||
<li><a href="/contributors/">contributors</a></li>
|
</header>
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li><a href="/calendar/">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="/shouts/">shouts</a></li>
|
|
||||||
<li class="has-submenu">ekonomi
|
|
||||||
<ul class="submenu">
|
|
||||||
<li><a href="/tags/lumbungkiosproducts/">kios</a></li>
|
|
||||||
<li><a href="/tags/lumbunggallery/">gallery</a></li>
|
|
||||||
</ul>
|
|
||||||
</li>
|
|
||||||
<li><a href="https://books.lumbung.space">books</a></li>
|
|
||||||
</ul>
|
|
||||||
</aside>
|
|
||||||
</header>
|
|
|
@ -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>
|
|
|
@ -1,7 +1,7 @@
|
||||||
<div class='pen card {{ .Params.feed_name }}'>
|
<div class='pen card {{ .Params.feed_name }}'>
|
||||||
<article class="h-entry pen">
|
<article class="h-entry pen">
|
||||||
<header>
|
<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}}
|
{{ $postPermalink := .Permalink}}
|
||||||
<time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
|
<time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
|
||||||
|
|
|
@ -1,49 +1,48 @@
|
||||||
<div class='shout card {{ .Params.feed_name }}'>
|
<div class='shout card {{ .Params.feed_name }}'>
|
||||||
<article class="h-entry shout">
|
<article class="h-entry shout">
|
||||||
<header>
|
<header>
|
||||||
{{ $postPermalink := .Permalink}}
|
{{ $postPermalink := .Permalink}}
|
||||||
<h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">
|
<time class="dt-published" datetime="{{ .Date.Format `Jan 02 2006` }}">{{ .Date.Format "Jan 02, 2006" }}</time>
|
||||||
{{ range $i, $e := .Params.tags -}}
|
<h2 class="p-name"><a href="{{ .Permalink }}" class="u-url">{{ .Title }}</a></h2>
|
||||||
{{- if $i -}} {{ end -}}
|
</header>
|
||||||
<a href='{{ "/tags/" | relLangURL }}{{ . | urlize }}'>#{{ $e | humanize | lower }}</a>
|
|
||||||
{{- end -}}
|
<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>
|
||||||
</a></h2>
|
|
||||||
</header>
|
|
||||||
|
|
||||||
{{ with (index (.Resources.ByType "video") 0) }}
|
{{ if .Params.featured_image }}
|
||||||
{{/* TODO this current logic does not suport video & image mixed */}}
|
{{ with $img := .Resources.GetMatch .Params.featured_image }}
|
||||||
<div class="p-summary">
|
{{ $height := add $img.Height 0.0}}
|
||||||
<video controls width="540px" preload="none" poster="{{ $postPermalink }}/thumbnail.png">
|
{{ $ratio := div $height $img.Width}}
|
||||||
<source src="{{.Permalink}}" type="video/mp4">
|
{{ $thumb := $img.Fit "540x540 q80 webp"}}
|
||||||
</video>
|
<div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
|
||||||
{{ else}}
|
<div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
|
||||||
{{ with (index (.Resources.ByType "image") 0) }}
|
<a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}" alt="{{ .Title }}"> </a>
|
||||||
{{ $height := add .Height 0.0}}
|
</div>
|
||||||
{{ $ratio := div $height .Width}}
|
{{end}}
|
||||||
{{ $thumb := .Fit "540x540 q80 webp"}}
|
{{ else if (.Resources.ByType "image") }}
|
||||||
<div class="p-summary{{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
|
{{ with (index (.Resources.ByType "image") 0) }}
|
||||||
<div class="summary-image {{if gt $ratio 1 }} portrait {{else}} landscape {{end}}">
|
{{ $img := . }}
|
||||||
<a href="{{ $postPermalink }}"><img src="{{ $thumb.Permalink }}" alt="{{ .Title }}"> </a>
|
{{ $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>
|
||||||
{{ else }}
|
</div>
|
||||||
<div class="p-summary">
|
|
||||||
{{ end }}
|
<footer class='post-footer'>
|
||||||
{{ end }}
|
<a href="{{ .RelPermalink }}">
|
||||||
<div class="summary-text">
|
<svg width="11" height="11" viewBox="0 0 11 11" xmlns="http://www.w3.org/2000/svg">
|
||||||
{{ .Summary }}
|
<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" />
|
||||||
</div>
|
</svg>
|
||||||
</div>
|
</a>
|
||||||
<div class="shout-source"></div>
|
</footer>
|
||||||
|
</article>
|
||||||
<footer class='post-footer'>
|
</div>
|
||||||
<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>
|
|
||||||
|
|
|
@ -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>
|
|
@ -73,9 +73,14 @@ body > iframe {
|
||||||
box-sizing: border-box;
|
box-sizing: border-box;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
margin: 2em auto;
|
margin: 2em auto;
|
||||||
max-width: 80%;
|
max-width: 80%;
|
||||||
|
width: 100%;
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -159,37 +164,128 @@ body > iframe {
|
||||||
|
|
||||||
/* base header & menu */
|
/* base header & menu */
|
||||||
|
|
||||||
#top-menu {
|
.header-row {
|
||||||
padding: 1.5rem 1rem 0;
|
margin: 1.5rem;
|
||||||
display: grid;
|
display: flex;
|
||||||
grid-template-columns: 300px 1fr auto;
|
justify-content: space-between;
|
||||||
align-items: flex-start;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.home-link {
|
.home-link {
|
||||||
text-decoration: none;
|
display: block;
|
||||||
|
max-width: 700px;
|
||||||
|
width: 50%;
|
||||||
|
padding: 0;
|
||||||
|
margin: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.logo {
|
.logo {
|
||||||
width: 283px;
|
display: block;
|
||||||
margin-top: 2rem;
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu a {
|
.login-link {
|
||||||
|
background: #009d9b;
|
||||||
|
padding: 5px 30px;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 900;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-row {
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: 80%;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
position: sticky;
|
||||||
|
top: 15px;
|
||||||
|
z-index: 99;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-link {
|
||||||
|
background: #333;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 30px;
|
||||||
|
color: #fff;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-icon {
|
||||||
|
height: 14px;
|
||||||
|
width: auto;
|
||||||
|
display: block;
|
||||||
|
margin-right: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-icon path {
|
||||||
|
fill:#fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-menu-button {
|
||||||
|
width: 35px;
|
||||||
|
height: 16px;
|
||||||
|
display: none;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
color: pointer;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mobile-menu-button--line {
|
||||||
|
width: 100%;
|
||||||
|
height: 2px;
|
||||||
|
background: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu {
|
||||||
|
border: 2px solid #000;
|
||||||
|
padding: 0 1rem;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-dot {
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
margin-right: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu ul {
|
||||||
|
list-style-type: none;
|
||||||
|
margin: 0 auto;
|
||||||
|
padding-left: 0;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
text-transform: lowercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu ul li {
|
||||||
|
margin-right: 1.5rem;
|
||||||
|
padding: 0.5rem 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu ul li:last-child {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-nav-item {
|
||||||
|
border-right: 2px solid var(--border-color);
|
||||||
|
padding: 0.5em;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: #333;
|
color: #333;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu a:hover,
|
.menu a:hover,
|
||||||
#top-menu a:focus {
|
.menu a:focus {
|
||||||
color: black;
|
color: black;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu #login {
|
|
||||||
font-weight: bold;
|
|
||||||
margin-top: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
#top-menu div {
|
#top-menu div {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
@ -199,7 +295,7 @@ body > iframe {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu input {
|
.menu input {
|
||||||
border: none;
|
border: none;
|
||||||
border-bottom: 1px solid #333;
|
border-bottom: 1px solid #333;
|
||||||
margin-right: 2rem;
|
margin-right: 2rem;
|
||||||
|
@ -207,8 +303,8 @@ body > iframe {
|
||||||
margin-left: 5px;
|
margin-left: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu input:focus,
|
.menu input:focus,
|
||||||
#top-menu input:hover {
|
.menu input:hover {
|
||||||
outline: none;
|
outline: none;
|
||||||
border-bottom: 1px solid #333;
|
border-bottom: 1px solid #333;
|
||||||
}
|
}
|
||||||
|
@ -222,27 +318,8 @@ body > iframe {
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.menu {
|
|
||||||
margin-top: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.menu ul {
|
|
||||||
list-style-type: none;
|
|
||||||
margin: 0 auto;
|
|
||||||
padding-left: 3rem;
|
|
||||||
display: flex;
|
|
||||||
justify-content: space-between;
|
|
||||||
text-transform: lowercase;
|
|
||||||
max-width: 1100px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.menu-nav-item {
|
|
||||||
border-right: 2px solid var(--border-color);
|
|
||||||
padding: 0.5em;
|
|
||||||
}
|
|
||||||
|
|
||||||
/* styles for "tools" dropdown menu */
|
/* styles for "tools" dropdown menu */
|
||||||
#top-menu ul.submenu {
|
.menu ul.submenu {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
margin-left: 0;
|
margin-left: 0;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
@ -257,6 +334,7 @@ body > iframe {
|
||||||
|
|
||||||
.menu .submenu li {
|
.menu .submenu li {
|
||||||
margin: 2px 0;
|
margin: 2px 0;
|
||||||
|
padding: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
.menu .has-submenu {
|
.menu .has-submenu {
|
||||||
|
@ -272,49 +350,41 @@ body > iframe {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu .menu ul.submenu {
|
.menu ul.submenu {
|
||||||
margin-left: 11px;
|
margin-left: -0.5em;
|
||||||
margin-top: 10px;
|
margin-top: 8px;
|
||||||
border: 1px solid ;
|
border: 2px solid ;
|
||||||
gap: 0.25em;
|
gap: 0.25em;
|
||||||
padding: 0.5em;
|
padding: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu a {
|
.menu a {
|
||||||
padding: 0 5px;
|
padding: 0 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu .menu .submenu a {
|
.menu .menu .submenu a {
|
||||||
margin: 0;
|
margin: 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu .drawer .submenu {
|
.menu .drawer .submenu {
|
||||||
position: initial;
|
position: initial;
|
||||||
display: none;
|
display: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu .drawer .submenu.opened {
|
.menu .drawer .submenu.opened {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu .drawer .submenu li {
|
.menu .drawer .submenu li {
|
||||||
padding: 0;
|
padding: 0;
|
||||||
padding-top: 1em;
|
padding-top: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
#top-menu .drawer .opened .submenu {
|
.menu .drawer .opened .submenu {
|
||||||
visibility: visible;
|
visibility: visible;
|
||||||
}
|
}
|
||||||
|
|
||||||
.drawer .has-submenu {
|
|
||||||
padding-left: 1em;
|
|
||||||
margin-left: 5px;
|
|
||||||
color: #333;
|
|
||||||
display: flex;
|
|
||||||
flex-direction: column;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*Article Summary Cards*/
|
/*Article Summary Cards*/
|
||||||
|
|
||||||
|
@ -338,6 +408,7 @@ body > iframe {
|
||||||
.h-entry header h2 a {
|
.h-entry header h2 a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: var(--border-color);
|
color: var(--border-color);
|
||||||
|
word-wrap: anywhere;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-entry header .header-metadata {
|
.h-entry header .header-metadata {
|
||||||
|
@ -405,9 +476,9 @@ footer.post-footer {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/* network cards */
|
/* shout cards */
|
||||||
|
|
||||||
.card.network {
|
.card.shout {
|
||||||
border: 2px solid var(--shouts-dark);
|
border: 2px solid var(--shouts-dark);
|
||||||
background-color: var(--shouts-light);
|
background-color: var(--shouts-light);
|
||||||
max-width: min-content;
|
max-width: min-content;
|
||||||
|
@ -419,70 +490,70 @@ footer.post-footer {
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.h-entry.network header {
|
.h-entry.shout header {
|
||||||
display: flex;
|
display: flex;
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-entry.network header h2 {
|
.h-entry.shout header h2 {
|
||||||
padding: 0.2em 0.5em 0.5em 0.5em;
|
padding: 0.2em 0.5em 0.5em 0.5em;
|
||||||
margin: 0;
|
margin: 0;
|
||||||
border: none;
|
border: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-entry.network header h2:hover {
|
.h-entry.shout header h2:hover {
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-entry.network header h2 a {
|
.h-entry.shout header h2 a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: var(--shouts-dark);
|
color: var(--shouts-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
.h-entry.network header time {
|
.h-entry.shout header time {
|
||||||
text-align: right;
|
text-align: right;
|
||||||
padding: 0.6em 0.8em;
|
padding: 0.6em 0.8em;
|
||||||
font-size: 1rem;
|
font-size: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .header-metadata {
|
.shout .header-metadata {
|
||||||
align-items: center;
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .header-metadata .dt-published {
|
.shout .header-metadata .dt-published {
|
||||||
border-bottom: 2px solid var(--shouts-dark);
|
border-bottom: 2px solid var(--shouts-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .filler {
|
.shout .filler {
|
||||||
min-height: 1rem;
|
min-height: 1rem;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .author.p-author {
|
.shout .author.p-author {
|
||||||
border-color: var(--shouts-dark);
|
border-color: var(--shouts-dark);
|
||||||
padding: 0.5em 1.2em 0.5em 1.2em;
|
padding: 0.5em 1.2em 0.5em 1.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .p-summary {
|
.shout .p-summary {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .p-summary.portrait {
|
.shout .p-summary.portrait {
|
||||||
/* flex-direction: row; */
|
/* flex-direction: row; */
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .p-summary.landscape {
|
.shout .p-summary.landscape {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .summary-image > img {
|
.shout .summary-image > img {
|
||||||
display: inherit;
|
display: inherit;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .summary-text {
|
.shout .summary-text {
|
||||||
font-size: 18px;
|
font-size: 18px;
|
||||||
}
|
}
|
||||||
|
|
||||||
div.network-source {
|
div.shout-source {
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
padding-right: 2em;
|
padding-right: 2em;
|
||||||
width: fit-content;
|
width: fit-content;
|
||||||
|
@ -495,29 +566,28 @@ div.network-source {
|
||||||
right: 1em;
|
right: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network-source::before {
|
.shout-source .triangle {
|
||||||
content: "";
|
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: -20px;
|
right: 0px;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
width: 0;
|
width: auto;
|
||||||
height: 0;
|
height: calc(100% + 0.5px);
|
||||||
border-left: 20px solid var(--shouts-dark);
|
top: -0.5px;
|
||||||
border-top: 23px solid transparent;
|
transform: translateX(calc(100% - 0.5px));
|
||||||
border-bottom: 23px solid transparent;
|
fill: var(--shouts-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
.network-source a {
|
.shout-source a {
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
color: white;
|
color: white;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .footer-filler {
|
.shout .footer-filler {
|
||||||
border-left: 2px solid var(--shouts-dark);
|
border-left: 2px solid var(--shouts-dark);
|
||||||
border-top: none;
|
border-top: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network footer.post-footer {
|
.shout footer.post-footer {
|
||||||
border-top: 2px solid var(--shouts-dark);
|
border-top: 2px solid var(--shouts-dark);
|
||||||
flex-flow: row;
|
flex-flow: row;
|
||||||
font-size: 0.9rem;
|
font-size: 0.9rem;
|
||||||
|
@ -526,17 +596,17 @@ div.network-source {
|
||||||
padding: 1em;
|
padding: 1em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network footer svg {
|
.shout footer svg {
|
||||||
fill: var(--shouts-dark)
|
fill: var(--shouts-dark)
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .read-more {
|
.shout .read-more {
|
||||||
border: none;
|
border: none;
|
||||||
border-left: 2px solid var(--shouts-dark);
|
border-left: 2px solid var(--shouts-dark);
|
||||||
padding: 0.5em 1.2em 0.5em 1.2em;
|
padding: 0.5em 1.2em 0.5em 1.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
.network .footer-metadata {
|
.shout .footer-metadata {
|
||||||
padding: 0.5em 1.2em 0.5em 1.2em;
|
padding: 0.5em 1.2em 0.5em 1.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -667,9 +737,9 @@ div.pen-source {
|
||||||
padding: 0.5em 1.2em 0.5em 1.2em;
|
padding: 0.5em 1.2em 0.5em 1.2em;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* shouts cards */
|
/* social / hashtag cards */
|
||||||
|
|
||||||
.card.shout {
|
.card.social {
|
||||||
border-color: steelblue;
|
border-color: steelblue;
|
||||||
border: 2px solid;
|
border: 2px solid;
|
||||||
background-color: aliceblue;
|
background-color: aliceblue;
|
||||||
|
@ -681,24 +751,24 @@ div.pen-source {
|
||||||
color: steelblue;
|
color: steelblue;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card.shout h2 a {
|
.card.social h2 a {
|
||||||
color: var(--social-dark);
|
color: var(--social-dark);
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
display: block;
|
display: block;
|
||||||
word-wrap: anywhere;
|
word-wrap: anywhere;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card .card.shout h2 a:hover {
|
.card .card.social h2 a:hover {
|
||||||
border: none;
|
border: none;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card.shout .post-footer {
|
.card.social .post-footer {
|
||||||
background: var(--social-light);
|
background: var(--social-light);
|
||||||
color: var(--social-dark);
|
color: var(--social-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
.card.shout .post-footer a{
|
.card.social .post-footer a{
|
||||||
background: var(--social-light);
|
background: var(--social-light);
|
||||||
color: var(--social-dark);
|
color: var(--social-dark);
|
||||||
text-decoration: underline;
|
text-decoration: underline;
|
||||||
|
@ -706,42 +776,42 @@ div.pen-source {
|
||||||
|
|
||||||
|
|
||||||
/* gallery cards */
|
/* gallery cards */
|
||||||
.card.shout.lumbung-gallery {
|
.card.social.lumbunggallery {
|
||||||
border-color: var(--gallery-dark);
|
border-color: var(--gallery-dark);
|
||||||
background-color: var(--gallery-light);
|
background-color: var(--gallery-light);
|
||||||
color: var(--gallery-dark);
|
color: var(--gallery-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
.card.shout.lumbung-gallery h2 a {
|
.card.social.lumbunggallery h2 a {
|
||||||
color: var(--gallery-dark);
|
color: var(--gallery-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.card.shout.lumbung-gallery .post-footer {
|
.card.social.lumbunggallery .post-footer {
|
||||||
background: var(--gallery-light);
|
background: var(--gallery-light);
|
||||||
color: var(--gallery-dark);
|
color: var(--gallery-dark);
|
||||||
border-top: 2px solid;
|
border-top: 2px solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* kios cards */
|
/* kios cards */
|
||||||
.card.shout.lumbung-kios {
|
.card.social.lumbungkios {
|
||||||
border-color: var(--kios-dark);
|
border-color: var(--kios-dark);
|
||||||
background-color: var(--kios-light);
|
background-color: var(--kios-light);
|
||||||
color: var(--kios-dark);
|
color: var(--kios-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
.card.shout.lumbung-kios h2 a {
|
.card.social.lumbungkios h2 a {
|
||||||
color: var(--kios-dark);
|
color: var(--kios-dark);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
.card.shout.lumbung-kios .post-footer {
|
.card.social.lumbungkios .post-footer {
|
||||||
background: var(--kios-light);
|
background: var(--kios-light);
|
||||||
color: var(--kios-dark);
|
color: var(--kios-dark);
|
||||||
border-top: 2px solid;
|
border-top: 2px solid;
|
||||||
}
|
}
|
||||||
|
|
||||||
.card.shout.lumbung-kios .post-footer a {
|
.card.social.lumbungkios .post-footer a {
|
||||||
background: none;
|
background: none;
|
||||||
color: var(--kios-dark);
|
color: var(--kios-dark);
|
||||||
}
|
}
|
||||||
|
@ -1011,6 +1081,117 @@ li.page-item:after {
|
||||||
z-index: -100;
|
z-index: -100;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
|
/* FILTER */
|
||||||
|
|
||||||
|
.filter-item, .card, .video-box {
|
||||||
|
/* display: none;*/
|
||||||
|
}
|
||||||
|
|
||||||
|
.show-item {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-buttons-container {
|
||||||
|
display: none;
|
||||||
|
background: #fff;
|
||||||
|
padding: 1.5rem;
|
||||||
|
border: 2px solid;
|
||||||
|
position: absolute;
|
||||||
|
top: 44px;
|
||||||
|
z-index: 99;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-buttons-container-header {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.load-all {
|
||||||
|
margin-left: 30px;
|
||||||
|
cursor: pointer;
|
||||||
|
text-decoration: underline;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
|
||||||
|
@media (min-width: 980px) {
|
||||||
|
.filter-link:hover + .filter-buttons-container {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-buttons-container:hover {
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-buttons {
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 10px;
|
||||||
|
display: flex;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: scroll;
|
||||||
|
-ms-overflow-style: none;
|
||||||
|
scrollbar-width: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-buttons button {
|
||||||
|
display: block;
|
||||||
|
border: 0;
|
||||||
|
background: unset;
|
||||||
|
border-radius: 0;
|
||||||
|
width: fit-content;
|
||||||
|
cursor: pointer;
|
||||||
|
background: #009d9b;
|
||||||
|
margin-right: 5px;
|
||||||
|
white-space: nowrap;
|
||||||
|
color: #fff;
|
||||||
|
padding: 0.8rem;
|
||||||
|
text-transform: lowercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-buttons .filter-button.active {
|
||||||
|
background: #f04b1e;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-buttons .filter-button.active:after {
|
||||||
|
content:"\00d7";
|
||||||
|
display: inline-block;
|
||||||
|
margin-left: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.disable-button {
|
||||||
|
display: none !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.page-nav {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
margin: 20px auto 50px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nextpage {
|
||||||
|
padding: 15px;
|
||||||
|
position: relative;
|
||||||
|
color: #333;
|
||||||
|
text-decoration: none;
|
||||||
|
margin: 0px 20px;
|
||||||
|
font-size: 38px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.nextpage:after {
|
||||||
|
content: "";
|
||||||
|
height: 50%;
|
||||||
|
width: 100%;
|
||||||
|
display: block;
|
||||||
|
border: 2px solid #333;
|
||||||
|
border-top: 0;
|
||||||
|
bottom: 0;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
|
||||||
/* Landingpage */
|
/* Landingpage */
|
||||||
.welcome-text {
|
.welcome-text {
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
@ -1566,14 +1747,66 @@ a.timeline-url {
|
||||||
}
|
}
|
||||||
|
|
||||||
/* menu styles */
|
/* menu styles */
|
||||||
|
|
||||||
|
.mobile-menu-button {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.menu-row, #top-menu {
|
||||||
|
position: fixed !important;
|
||||||
|
z-index: 97;
|
||||||
|
}
|
||||||
|
|
||||||
|
.menu-row {
|
||||||
|
z-index: 98;
|
||||||
|
width: fit-content;
|
||||||
|
margin-top: 3vw;
|
||||||
|
right: 5%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-buttons-container {
|
||||||
|
position: fixed;
|
||||||
|
top: 90px;
|
||||||
|
z-index: 99;
|
||||||
|
width: 90%;
|
||||||
|
overflow: hidden;
|
||||||
|
left: 5%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-buttons-container.open {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
padding-top: 60px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-link {
|
||||||
|
background: unset;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-link span {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-icon {
|
||||||
|
height: 20px;
|
||||||
|
margin-right: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.filter-icon path {
|
||||||
|
fill: #333;
|
||||||
|
}
|
||||||
|
|
||||||
#top-menu div.mobile-menu {
|
#top-menu div.mobile-menu {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
}
|
}
|
||||||
|
|
||||||
.mobile-menu #login {
|
#top-menu .login-link {
|
||||||
display: inline-flex;
|
display: none;
|
||||||
margin: 0 0 0 auto;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.hamburger {
|
.hamburger {
|
||||||
|
@ -1679,7 +1912,7 @@ a.timeline-url {
|
||||||
|
|
||||||
/* card styles */
|
/* card styles */
|
||||||
.card,
|
.card,
|
||||||
.card.network {
|
.card.shout {
|
||||||
max-width: 83vw;
|
max-width: 83vw;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,16 @@
|
||||||
|
<?xml version="1.0" encoding="utf-8"?>
|
||||||
|
<!-- Generator: Adobe Illustrator 26.5.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
|
||||||
|
<svg version="1.1" id="Ebene_2_00000008129498585359231740000016507919400411346327_"
|
||||||
|
xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 14.9 14.9"
|
||||||
|
style="enable-background:new 0 0 14.9 14.9;" xml:space="preserve">
|
||||||
|
<style type="text/css">
|
||||||
|
.st0{fill:#333333;}
|
||||||
|
</style>
|
||||||
|
<g id="Layer_1">
|
||||||
|
<g>
|
||||||
|
<path class="st0" d="M11.8,1.9C11,0.7,9.7,0.1,8,0.3C7.2,0,6.4-0.1,5.6,0.2C3.3,1,1.7,2.6,0.6,4.7c-1.4,2.6-0.5,6.8,2.4,8.1
|
||||||
|
c0,0,0.1,0,0.1,0c0.2,0.2,0.5,0.3,0.8,0.4c0.4,0.6,0.9,1.1,1.6,1.3c1.9,0.7,4.1,0.1,5.5-1.2c0.9-0.6,1.6-1.4,2-2.4
|
||||||
|
c1-0.9,1.6-2.2,1.8-3.5C15.1,5.2,14.1,2.7,11.8,1.9L11.8,1.9z"/>
|
||||||
|
</g>
|
||||||
|
</g>
|
||||||
|
</svg>
|
After Width: | Height: | Size: 804 B |
File diff suppressed because one or more lines are too long
Before Width: | Height: | Size: 15 KiB After Width: | Height: | Size: 28 KiB |
|
@ -0,0 +1,221 @@
|
||||||
|
!(function l(r, a, o) {
|
||||||
|
function h(e, t) {
|
||||||
|
if (!a[e]) {
|
||||||
|
if (!r[e]) {
|
||||||
|
var s = "function" == typeof require && require;
|
||||||
|
if (!t && s) return s(e, !0);
|
||||||
|
if (u) return u(e, !0);
|
||||||
|
var i = new Error("Cannot find module '" + e + "'");
|
||||||
|
throw ((i.code = "MODULE_NOT_FOUND"), i);
|
||||||
|
}
|
||||||
|
var n = (a[e] = { exports: {} });
|
||||||
|
r[e][0].call(
|
||||||
|
n.exports,
|
||||||
|
function (t) {
|
||||||
|
return h(r[e][1][t] || t);
|
||||||
|
},
|
||||||
|
n,
|
||||||
|
n.exports,
|
||||||
|
l,
|
||||||
|
r,
|
||||||
|
a,
|
||||||
|
o
|
||||||
|
);
|
||||||
|
}
|
||||||
|
return a[e].exports;
|
||||||
|
}
|
||||||
|
for (var u = "function" == typeof require && require, t = 0; t < o.length; t++) h(o[t]);
|
||||||
|
return h;
|
||||||
|
})(
|
||||||
|
{
|
||||||
|
1: [
|
||||||
|
function (t, e, s) {
|
||||||
|
"use strict";
|
||||||
|
var i = (function () {
|
||||||
|
function i(t, e) {
|
||||||
|
for (var s = 0; s < e.length; s++) {
|
||||||
|
var i = e[s];
|
||||||
|
(i.enumerable = i.enumerable || !1), (i.configurable = !0), "value" in i && (i.writable = !0), Object.defineProperty(t, i.key, i);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return function (t, e, s) {
|
||||||
|
return e && i(t.prototype, e), s && i(t, s), t;
|
||||||
|
};
|
||||||
|
})();
|
||||||
|
/**
|
||||||
|
* @name 'Hugo Tags Filter'
|
||||||
|
* @version 1.2.2
|
||||||
|
* @license MIT
|
||||||
|
* @author PointyFar
|
||||||
|
*/
|
||||||
|
var n = (function () {
|
||||||
|
function l(t) {
|
||||||
|
!(function (t, e) {
|
||||||
|
if (!(t instanceof e)) throw new TypeError("Cannot call a class as a function");
|
||||||
|
})(this, l);
|
||||||
|
(this.FILTERS =
|
||||||
|
t && t.filters
|
||||||
|
? t.filters
|
||||||
|
: [
|
||||||
|
{ name: "tag", prefix: "tft-", buttonClass: "tft-button", allSelector: "#tfSelectAllTags", attrName: "data-tags" },
|
||||||
|
{ name: "section", prefix: "tfs-", buttonClass: "tfs-button", allSelector: "#tfSelectAllSections", attrName: "data-section" },
|
||||||
|
]),
|
||||||
|
(this.showItemClass = t && t.showItemClass ? t.showItemClass : "tf-show"),
|
||||||
|
(this.activeButtonClass = t && t.activeButtonClass ? t.activeButtonClass : "active"),
|
||||||
|
(this.filterItemClass = t && t.filterItemClass ? t.filterItemClass : "tf-filter-item"),
|
||||||
|
(this.counterSelector = t && t.counterSelector ? t.counterSelector : "selectedItemCount"),
|
||||||
|
(this.populateCount = !(!t || !t.populateCount) && t.populateCount),
|
||||||
|
(this.setDisabledButtonClass = !(!t || !t.setDisabledButtonClass) && t.setDisabledButtonClass),
|
||||||
|
(this.filterItems = document.getElementsByClassName(this.filterItemClass)),
|
||||||
|
(this.selectedItemCount = 0),
|
||||||
|
(this.filterValues = {});
|
||||||
|
for (var e = 0; e < this.FILTERS.length; e++) {
|
||||||
|
(this.FILTERS[e].buttonTotal = document.getElementsByClassName(this.FILTERS[e].buttonClass).length), (this.FILTERS[e].selected = []), (this.FILTERS[e].values = []);
|
||||||
|
var s = document.getElementsByClassName(this.FILTERS[e].buttonClass);
|
||||||
|
this.filterValues[this.FILTERS[e].name] = [];
|
||||||
|
for (var i = 0; i < s.length; i++) {
|
||||||
|
var n = s[i].id.replace(this.FILTERS[e].prefix, "");
|
||||||
|
this.filterValues[this.FILTERS[e].name][n] = { count: 0, selected: 0 };
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.showCheck(this.FILTERS[0].name, !0);
|
||||||
|
}
|
||||||
|
return (
|
||||||
|
i(l, [
|
||||||
|
{
|
||||||
|
key: "initFilterCount",
|
||||||
|
value: function (t, e) {
|
||||||
|
if (e) for (var s in t) for (var i = 0; i < this.filterItems.length; i++) for (var n = this.getAttrs(s, this.filterItems[i]), l = 0; l < n.length; l++) t[s][n[l]].count++, t[s][n[l]].selected++;
|
||||||
|
else {
|
||||||
|
var r = document.getElementsByClassName(this.showItemClass);
|
||||||
|
for (var s in t) for (var a in t[s]) t[s][a].selected = 0;
|
||||||
|
for (l = 0; l < r.length; l++)
|
||||||
|
for (s in t) {
|
||||||
|
n = this.getAttrs(s, r[l]);
|
||||||
|
for (var o = 0; o < n.length; o++) t[s][n[o]].selected++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return t;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "populateCounters",
|
||||||
|
value: function (t) {
|
||||||
|
if (this.populateCount)
|
||||||
|
for (var e = 0; e < this.FILTERS.length; e++) {
|
||||||
|
var s = this.FILTERS[e].name,
|
||||||
|
i = this.FILTERS[e].countPrefix,
|
||||||
|
n = this.FILTERS[e].selectedPrefix;
|
||||||
|
if (i || n)
|
||||||
|
for (var l in t[s]) {
|
||||||
|
if (i) document.getElementById("" + i + l).textContent = t[s][l].count;
|
||||||
|
if (n) {
|
||||||
|
var r = document.getElementById("" + n + l);
|
||||||
|
(r.textContent = t[s][l].selected),
|
||||||
|
this.setDisabledButtonClass &&
|
||||||
|
(0 == r.textContent
|
||||||
|
? this.addClassIfMissing(document.getElementById(this.FILTERS[e].prefix + l), this.setDisabledButtonClass)
|
||||||
|
: this.delClassIfPresent(document.getElementById(this.FILTERS[e].prefix + l), this.setDisabledButtonClass));
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "getAttrs",
|
||||||
|
value: function (t, e) {
|
||||||
|
return e
|
||||||
|
.getAttribute("data-" + t)
|
||||||
|
.split(" ")
|
||||||
|
.filter(function (t) {
|
||||||
|
return 0 < t.length;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "showAll",
|
||||||
|
value: function (t) {
|
||||||
|
for (var e = 0; e < this.FILTERS.length; e++) t ? this.FILTERS[e].name === t && (this.FILTERS[e].selected = []) : (this.FILTERS[e].selected = []);
|
||||||
|
this.showCheck(t);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "checkFilter",
|
||||||
|
value: function (t, e) {
|
||||||
|
for (var s = document.querySelector("#" + e + t), i = 0; i < this.FILTERS.length; i++)
|
||||||
|
this.FILTERS[i].prefix === e &&
|
||||||
|
(0 <= this.FILTERS[i].selected.indexOf(t)
|
||||||
|
? (this.FILTERS[i].selected.splice(t, 1), this.delClassIfPresent(s, this.activeButtonClass))
|
||||||
|
: (this.FILTERS[i].selected.push(t), this.addClassIfMissing(s, this.activeButtonClass)),
|
||||||
|
this.delClassIfPresent(document.querySelector(this.FILTERS[i].allSelector), this.activeButtonClass),
|
||||||
|
this.showCheck(this.FILTERS[i].name));
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "showCheck",
|
||||||
|
value: function (t, e) {
|
||||||
|
for (var s = 0; s < this.FILTERS.length; s++)
|
||||||
|
if (this.FILTERS[s].name === t && (0 === this.FILTERS[s].selected.length || this.FILTERS[s].selected.length === this.FILTERS[s].buttonTotal)) {
|
||||||
|
for (var i = document.getElementsByClassName(this.FILTERS[s].buttonClass), n = 0; n < i.length; n++) this.delClassIfPresent(i[n], this.activeButtonClass);
|
||||||
|
this.addClassIfMissing(document.querySelector(this.FILTERS[s].allSelector), this.activeButtonClass);
|
||||||
|
}
|
||||||
|
for (s = this.selectedItemCount = 0; s < this.filterItems.length; s++) {
|
||||||
|
this.delClassIfPresent(this.filterItems[s], this.showItemClass);
|
||||||
|
var l = 0;
|
||||||
|
for (n = 0; n < this.FILTERS.length; n++) this.checkVisibility(this.FILTERS[n].selected, this.filterItems[s].getAttribute(this.FILTERS[n].attrName)) && l++;
|
||||||
|
l === this.FILTERS.length && (this.filterItems[s].classList.contains(this.showItemClass) || (this.selectedItemCount++, this.addClassIfMissing(this.filterItems[s], this.showItemClass)));
|
||||||
|
}
|
||||||
|
document.getElementById(this.counterSelector) && (document.getElementById(this.counterSelector).textContent = "" + this.selectedItemCount), this.checkButtonCounts(e);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "checkButtonCounts",
|
||||||
|
value: function (t) {
|
||||||
|
(this.filterValues = this.initFilterCount(this.filterValues, t)), this.populateCounters(this.filterValues);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "checkVisibility",
|
||||||
|
value: function (t, e) {
|
||||||
|
if (0 < t.length) {
|
||||||
|
for (var s = 0; s < t.length; s++) {
|
||||||
|
if (
|
||||||
|
0 <=
|
||||||
|
e
|
||||||
|
.split(" ")
|
||||||
|
.filter(function (t) {
|
||||||
|
return 0 < t.length;
|
||||||
|
})
|
||||||
|
.indexOf(t[s])
|
||||||
|
)
|
||||||
|
return !0;
|
||||||
|
}
|
||||||
|
return !1;
|
||||||
|
}
|
||||||
|
return !0;
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "addClassIfMissing",
|
||||||
|
value: function (t, e) {
|
||||||
|
t.classList.contains(e) || t.classList.add(e);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
key: "delClassIfPresent",
|
||||||
|
value: function (t, e) {
|
||||||
|
t.classList.contains(e) && t.classList.remove(e);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
]),
|
||||||
|
l
|
||||||
|
);
|
||||||
|
})();
|
||||||
|
window.HugoTagsFilter = n;
|
||||||
|
},
|
||||||
|
{},
|
||||||
|
],
|
||||||
|
},
|
||||||
|
{},
|
||||||
|
[1]
|
||||||
|
);
|
Loading…
Reference in New Issue