From c3e34bb48fd811192c69c499bcaa4ee1f67cb4e2 Mon Sep 17 00:00:00 2001 From: rra Date: Thu, 8 Jul 2021 10:42:38 +0200 Subject: [PATCH] initial commit - WIP --- archetypes/default.md | 2 + layouts/404.html | 0 layouts/_default/_markdown/render-image.html | 2 + layouts/_default/baseof.html | 30 +++ layouts/_default/list.html | 23 ++ layouts/_default/single.html | 16 ++ layouts/index.html | 26 +++ layouts/partials/card.html | 34 +++ layouts/partials/footer.html | 5 + layouts/partials/head.html | 25 +++ layouts/partials/header.html | 12 ++ layouts/partials/video_box.html | 29 +++ static/css/main.css | 216 +++++++++++++++++++ static/css/video-box.css | 172 +++++++++++++++ theme.toml | 21 ++ 15 files changed, 613 insertions(+) create mode 100644 archetypes/default.md create mode 100644 layouts/404.html create mode 100644 layouts/_default/_markdown/render-image.html create mode 100644 layouts/_default/baseof.html create mode 100644 layouts/_default/list.html create mode 100644 layouts/_default/single.html create mode 100644 layouts/index.html create mode 100644 layouts/partials/card.html create mode 100644 layouts/partials/footer.html create mode 100644 layouts/partials/head.html create mode 100644 layouts/partials/header.html create mode 100644 layouts/partials/video_box.html create mode 100644 static/css/main.css create mode 100644 static/css/video-box.css create mode 100644 theme.toml diff --git a/archetypes/default.md b/archetypes/default.md new file mode 100644 index 0000000..ac36e06 --- /dev/null +++ b/archetypes/default.md @@ -0,0 +1,2 @@ ++++ ++++ diff --git a/layouts/404.html b/layouts/404.html new file mode 100644 index 0000000..e69de29 diff --git a/layouts/_default/_markdown/render-image.html b/layouts/_default/_markdown/render-image.html new file mode 100644 index 0000000..7d332b9 --- /dev/null +++ b/layouts/_default/_markdown/render-image.html @@ -0,0 +1,2 @@ +{{- $image := .Page.Resources.GetMatch (printf "%s" (.Destination | safeURL)) -}} +{{- .PlainText | htmlUnescape -}} diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html new file mode 100644 index 0000000..13acd96 --- /dev/null +++ b/layouts/_default/baseof.html @@ -0,0 +1,30 @@ + + + {{- partial "head.html" . -}} + + {{- partial "header.html" . -}} +
+ {{- block "main" . }}{{- end }} +
+ {{- partial "footer.html" . -}} + + + + + diff --git a/layouts/_default/list.html b/layouts/_default/list.html new file mode 100644 index 0000000..cd6e480 --- /dev/null +++ b/layouts/_default/list.html @@ -0,0 +1,23 @@ +{{ define "main" }} +
+
+ {{ range .Pages }} +
+
+
+

{{ .Title }}

+ +
+ {{ if .Truncated }} +
+ {{ .Summary }} +

Read More…

+ {{ else }} +
+ {{ end }} +
+
+
+ {{ end }} +
+{{ end }} diff --git a/layouts/_default/single.html b/layouts/_default/single.html new file mode 100644 index 0000000..25f08f3 --- /dev/null +++ b/layouts/_default/single.html @@ -0,0 +1,16 @@ +{{ define "main" }} +
+ +
+{{ end }} diff --git a/layouts/index.html b/layouts/index.html new file mode 100644 index 0000000..55f9b6e --- /dev/null +++ b/layouts/index.html @@ -0,0 +1,26 @@ +{{ define "main" }} +
+
+ {{ range (.Paginator 10).Pages }} + + + {{ if in .Params.category "tv"}} + + {{- partial "video_box.html" . -}} + + {{ else }} + + {{- partial "card.html" . -}} + + {{ end }} + + {{ end }} +
+ + + + +{{ end }} + diff --git a/layouts/partials/card.html b/layouts/partials/card.html new file mode 100644 index 0000000..9154a32 --- /dev/null +++ b/layouts/partials/card.html @@ -0,0 +1,34 @@ +
+
+
+

{{ .Title }}

+ +
+ + {{ $img := (.Resources.ByType "image").GetMatch "*featured*" }} + +
+
+ {{ .Summary }} +
+ {{ with $img }} + {{ $thumb := .Resize "400x300"}} +
+ {{ .Title }} +
+ {{ end }} +
+ {{ if .Truncated }} + + {{ end }} + +
+
\ No newline at end of file diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html new file mode 100644 index 0000000..e033aca --- /dev/null +++ b/layouts/partials/footer.html @@ -0,0 +1,5 @@ +
+
+ Imprint - Privacy Policy - Copyright +
+
\ No newline at end of file diff --git a/layouts/partials/head.html b/layouts/partials/head.html new file mode 100644 index 0000000..3180365 --- /dev/null +++ b/layouts/partials/head.html @@ -0,0 +1,25 @@ + + + + + {{ if .IsHome }} {{ .Site.Title }} {{ else }} {{ .Title }} | {{ .Site.Title }} {{ end }} + + {{- if or .Description .Site.Params.description }} + + {{- end }} + {{- if or .Description .Site.Params.description }} + + {{- end }} + + + + + + {{ with .Site.Params.favicon }} + + {{ end }} + + {{ with .OutputFormats.Get "rss" -}} + {{ printf `` .Rel .MediaType.Type .Permalink $.Site.Title | safeHTML }} + {{ end -}} + diff --git a/layouts/partials/header.html b/layouts/partials/header.html new file mode 100644 index 0000000..65d7386 --- /dev/null +++ b/layouts/partials/header.html @@ -0,0 +1,12 @@ +
+

{{ .Site.Title }}

+ +
\ No newline at end of file diff --git a/layouts/partials/video_box.html b/layouts/partials/video_box.html new file mode 100644 index 0000000..86c58bb --- /dev/null +++ b/layouts/partials/video_box.html @@ -0,0 +1,29 @@ +
+
+ + + +
{{.Params.video_duration}}
+
+
+
+
+
+ +
+ diff --git a/static/css/main.css b/static/css/main.css new file mode 100644 index 0000000..4ffaef1 --- /dev/null +++ b/static/css/main.css @@ -0,0 +1,216 @@ +/*nice body-border color combos + +antiquewhite - burlywood +peachpuff - tomato +lightpink - crimson +lightblue - cornflowerblue +palegreen - lightseagreen + +fonts +bungeeshade +allerta +*/ + +:root { + --border-color: tomato; +} + +/*Main Stuff*/ +body { + font-size:16px; + font-family: sans-serif; + color: maroon; +} + + a { + color: #1B4C8A; + } + +* { + box-sizing: border-box; +} + +#content { + margin: 2em auto; + max-width: 80%; + margin-bottom: 0; + } + +.card{ + + border: 2px solid var(--border-color); + box-shadow:1em 1em 0 #d2d1c8; + background-color: #fff09d; + max-width: 600px; + margin-bottom: 2em; + flex: auto; + margin: 0 3em 3em 0; + align-self: start; + + } + + .card{ + background-color: peachpuff; + } + + + .card:nth-child(even){ + transform: rotate(-1deg); + } + + .card:nth-child(odd){ + transform: rotate(1deg); + } + + .card:nth-child(5){ + transform: rotate(2deg); + } + + + .video.box{ + margin-top:3em; + } + + .bar{ + border: 2px solid var(--border-color); + box-shadow: 0.6em 0.6em 0 #d2d1c8; + margin-bottom: 2em; + margin-top:3em; + display: inline-block; + background-color: #fff09d; + } + +.h-feed{ + display: flex; + flex-flow: row wrap; + width: 100%; + +} + +/* base header & menu */ + +#top-menu{ + transform: rotate(-3deg); + margin-left: 2em; +} + +.logo { + margin-left: 0.5em; + margin-right: 0.5em; + margin-top: 0.2em; + margin-bottom: 0.2em; +} + +.logo a { + text-decoration: none; +} + +.menu { + border-top: 2px solid var(--border-color); + margin: 0px; + padding: 0px; + +} + +.menu ul{ + list-style-type: none; + margin: 0; + padding: 0; + display: flex; +} + +.menu-nav-item { + border-right: 2px solid var(--border-color); + padding: 0.5em; +} + +/*Article Summary Cards*/ + +.h-entry{ +} + +.h-entry header { + display: flex; + border-bottom: 2px solid var(--border-color); +} + +.h-entry header h2{ + padding: 0.2em; + margin: 0; + padding-right: 0.3em; + padding-left: 0.3em; + border-right: 2px solid var(--border-color); +} + +.h-entry header h2:hover{ + box-shadow: inset 4px 4px 0px tomato; + cursor: pointer; +} + +.h-entry header h2 a { + text-decoration: none; + color: var(--border-color); +} + + +.h-entry header .header-metadata{ + margin: 0; + padding: 0.5em; + display: flex; + flex-flow: column wrap; + font-size: 0.9em; + align-content: flex-end; +} + +.p-summary.truncated.image { + display: flex; + flex-direction: row-reverse; +} + +.p-summary.truncated { + display: flex; + flex-direction: column; +} + +.summary-text { + flex: 1; + padding: 1em; + max-height: 300px; + min-width: 20ch; + text-overflow: ellipsis; + overflow: hidden; +} + +.summary-image > img { + height: 100%; + object-fit: cover; + max-width: 100%; + +} + +.summary-image{ + border-right: 2px solid var(--border-color); +} + +footer.post-footer { + display: flex; + flex-flow: row-reverse; +} + +.footer-filler{ + border-top: 2px solid var(--border-color); + flex-grow: 1; +} +.read-more { + border-top: 2px solid var(--border-color); + border-left: 2px solid var(--border-color); + align-content: flex-end; + padding: 0.2em 1em 0.2em 1em; + font-size: 0.9rem; +} + +/* footer */ + +footer.bar { + margin-top:0; +} \ No newline at end of file diff --git a/static/css/video-box.css b/static/css/video-box.css new file mode 100644 index 0000000..d53f6fd --- /dev/null +++ b/static/css/video-box.css @@ -0,0 +1,172 @@ +:root { + --video-border-color: burlywood; + --video-background-color: antiquewhite; +} + .video-box { + border:2px solid var(--video-border-color); + max-width:560px; + margin:auto; + box-shadow:1em 1em 0 #d2d1c8; + margin-bottom: 2em; + color: chocolate; + } + + .video-box:nth-child(even){ + transform: rotate(-1deg); + } + + .video-box:nth-child(odd){ + transform: rotate(1deg); + } + + .video-box:nth-child(5){ + transform: rotate(3deg); + } + + + .video-box img { + max-width: 100%; + } + + .video-box .media { + line-height: 0; + } + + .metadata{ + display: flex; + flex-direction: column; + background-color: var(--video-background-color); + font-size:0.9rem; + } + + + .title{ + margin-top:0; + border-top: 2px solid var(--video-border-color); + padding:0.5em; + font-weight:700; + font-size:1.3rem; + } + + .footer{ + margin-top:0; + border-top: 2px solid var(--video-border-color); + display: flex; + justify-content: space-between; + } + + .channel{ + border-right: 2px solid var(--video-border-color); + padding-left: 1em; + padding-right: 1em; + padding-top: 0.2em; + display: inline-block; + padding-bottom: 0.2em; + } + + .date { + float:right; + border-left: 2px solid var(--video-border-color); + padding-left: 1em; + padding-right: 1em; + padding-top: 0.2em; + display: inline-block; + padding-bottom: 0.2em; + } + + .description{ + padding: 1em; + display: block; + /*transition: height 0.5s linear;*/ + overflow: hidden; + border-top: 2px solid var(--video-border-color); + } + + .collapsed { + border-top: 0px; + /*transform:scaleY(0);*/ + height: 0; + padding:0; + } + + .descr_button { + cursor: pointer; + flex-grow: 1; + text-align: center; + } + + .descr_button a { + color:inherit; + text-decoration: inherit; + } + + .descr_button a:before { + content:'↕'; + vertical-align: sub; + } + + .descr_button:hover { + box-shadow: inset 2px 2px 0px #95948c; + } + + .play-icon { + width: 0; + height: 0; + position: absolute; + left: 50%; + top: 50%; + transform: translate(-50%,-50%) scale(.5); + border-top: 13px solid transparent; + border-bottom: 13px solid transparent; + border-left: 18px solid hsla(0,0%,100%,.95); + } + + .video-thumbnail { + position: absolute; + width: 100%; + height: 100%; + top: 0; + } + .video-thumbnail { + display: flex; + flex-direction: column; + position: relative; + overflow: hidden; + background-color: #ececec; + transition: filter .2s ease; + } + +.video-thumbnail-duration-overlay { + display: inline-block; + background-color: var(--video-background-color); + color: chocolate; + font-size: 14px; + line-height: 1.1; + z-index: 10; + position: absolute; + padding: 1px 3px 1px 3px; + right: 5px; + bottom: 5px; + border: 2px solid var(--video-border-color); + } + + .play-overlay { + transition: all .2s ease; + position: absolute; + right: 0; + bottom: 0; + width: inherit; + height: inherit; + opacity: 0; + background-color: rgba(0,0,0,.3); + } + +.video-thumbnail:hover { + text-decoration:none!important +} +.video-thumbnail:hover .play-overlay { +opacity:1 +} +.video-thumbnail:hover .play-overlay .play-icon { +transform:translate(-50%,-50%) scale(1) +} diff --git a/theme.toml b/theme.toml new file mode 100644 index 0000000..72ac31f --- /dev/null +++ b/theme.toml @@ -0,0 +1,21 @@ +# theme.toml template for a Hugo theme +# See https://github.com/gohugoio/hugoThemes#themetoml for an example + +name = "Lumbung" +license = "AGPL3" +licenselink = "https://github.com/yourname/yourtheme/blob/master/LICENSE" +description = "" +homepage = "http://example.com/" +tags = [] +features = [] +min_version = "0.41.0" + +[author] + name = "" + homepage = "" + +# If porting an existing theme +[original] + name = "" + homepage = "" + repo = ""