mdn/blogamore
1
0
Fork 0
Code Issues Releases Activity

Kategorie + Archive und Hauptseite

Browse source
This commit is contained in:
mdn 2022-11-20 15:04:48 +01:00
parent 2f15333242
commit f2b5de5575
5 changed files with 74 additions and 72 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

64
assets/_own/css/style.css
View file

@ -1,26 +1,38 @@
html, body { html, body {
height: 100%; height: 100vh;
background-color: #fff; background-color: #fff;
font-family: 'Source Sans Pro', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif; font-family: 'Source Sans Pro', 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
} }
body { body {
_padding-top: 6.5rem; display: flex;
flex-direction: column;
min-height: 100vh;
}
main {
flex: 1;
/* Vorbereitung fuer fixed-top beim Header*/
_margin-top: 6.5rem;
}
a {
/* text-dark */
color: rgba(var(--bs-dark-rgb),var(--bs-text-opacity))!important;
} }
#content { #content {
min-height: 100%; _min-height: 100%;
height: auto; _height: auto;
border-radius: 5px; _border-radius: 5px;
box-shadow: 8px 14px 38px rgba(39,44,49,.06),1px 3px 8px rgba(39,44,49,.03); _box-shadow: 8px 14px 38px rgba(39,44,49,.06),1px 3px 8px rgba(39,44,49,.03);
transition: all .5s ease _transition: all .5s ease
} }
#content:hover { #contents:hover {
/* TODO den Shadow noch ausen-Rum legen (content+sidebar) und dann am besten nach obenund unten in den Header/Footer überschneiden lassen */ /* TODO den Shadow noch ausen-Rum legen (content+sidebar) und dann am besten nach obenund unten in den Header/Footer überschneiden lassen */
box-shadow: 0 0 1px rgba(39,44,49,.1),0 3px 16px rgba(39,44,49,.07); _box-shadow: 0 0 1px rgba(39,44,49,.1),0 3px 16px rgba(39,44,49,.07);
transition: all .3s ease; _transition: all .3s ease;
transform: translate3D(0,-1px,0) _transform: translate3D(0,-1px,0)
} }
.footer {
footer {
display: flex; display: flex;
padding: 0.5rem 3rem; padding: 0.5rem 3rem;
min-height: 4rem; min-height: 4rem;
@ -29,10 +41,10 @@ body {
align-items: center; align-items: center;
color: currentColor; color: currentColor;
} }
.footer a { footer a {
color: currentColor; color: currentColor;
} }
.footer p { footer p {
margin-top: 0.5rem; margin-top: 0.5rem;
margin-bottom: 0.5rem; margin-bottom: 0.5rem;
} }
@ -58,7 +70,7 @@ body {
} }
/* /*
* Blog sidebar * Blog - sidebar
*/ */
.blog-sidebar { .blog-sidebar {
fill_: currentColor; fill_: currentColor;
@ -70,13 +82,23 @@ body {
text-decoration: none !important; text-decoration: none !important;
} }
.tag-cloud { /*
display: inline-block; * Blog - Kategorien
padding: 0; */
margin: 0; .categories a {
text-decoration: none !important;
} }
.tag-cloud-link {
margin: 2px; /*
* Blog - Tags
*/
.tag-cloud {
display_: inline-block;
padding_: 0;
margin_: 0;
}
.tag-cloud-link a {
text-decoration: none !important;
} }
/* /*

1
assets/_own/sass/main.scss
View file

@ -30,6 +30,7 @@
@import "../../bootstrap/scss/navbar"; @import "../../bootstrap/scss/navbar";
@import "../../bootstrap/scss/pagination"; @import "../../bootstrap/scss/pagination";
@import "../../bootstrap/scss/badge"; @import "../../bootstrap/scss/badge";
@import "../../bootstrap/scss/list-group";
//@import "../../bootstrap/scss/placeholders"; //@import "../../bootstrap/scss/placeholders";
@import "../../bootstrap/scss/helpers"; @import "../../bootstrap/scss/helpers";

24
layouts/_default/baseof.html
View file

@ -2,20 +2,22 @@
<html lang="{{ .Site.LanguageCode }}"> <html lang="{{ .Site.LanguageCode }}">
{{- partial "head.html" . -}} {{- partial "head.html" . -}}
<body> <body>
<div class="container"> <!--<div classes="d-flex flex-column min-vh-100 vh-100">-->
{{- partial "header.html" . -}} {{- partial "header.html" . -}}
{{- block "head" . -}}{{- end }} <main role="main" class="container-md flex-grow-1">
{{- block "head" . -}}{{- end }}
<div class="row g-5"> <div class="row">
<div id="content" class="col-md-8"> <div id="content" class="col-md-8 border rounded shadow-lg p-3 mb-2">
{{- block "main" . -}}{{- end }} {{- block "main" . -}}{{- end }}
</div>
<div id="sidebar" class="col-md-4">
{{- block "sidebar" . -}}{{- end }}
</div>
</div> </div>
<div id="sidebar" class="col-md-4"> </main>
{{- block "sidebar" . -}}{{- end }}
</div>
</div>
{{- partial "footer.html" . -}} {{- partial "footer.html" . -}}
{{- partial "script.html" . -}} <!--</div>-->
</div> {{- partial "script.html" . -}}
</body> </body>
</html> </html>

55
layouts/blog/list.html
View file

@ -1,7 +1,7 @@
{{ define "head" }} {{ define "head" }}
{{ if eq .Type "blog" }} {{ if eq .Type "blog" }}
{{ $latestEntry := index (where (where .Site.RegularPages "Type" "blog") "Params.featured" true).ByPublishDate.Reverse 0 }} {{ $latestEntry := index (where (where .Site.RegularPages "Type" "blog") "Params.featured" true).ByPublishDate.Reverse 0 }}
<div class="p-4 p-md-5 m-2 mb-4 rounded text-bg-dark"> <div class="p-4 m-2 rounded text-bg-dark">
<div class="col-md6 px-0"> <div class="col-md6 px-0">
<h1 class="display-4 fst-italic">{{ $latestEntry.Title }}</h1> <h1 class="display-4 fst-italic">{{ $latestEntry.Title }}</h1>
<p class="lead my-3">{{ $latestEntry.Summary | safeHTML }}</p> <p class="lead my-3">{{ $latestEntry.Summary | safeHTML }}</p>
@ -38,47 +38,36 @@
{{ define "sidebar" }} {{ define "sidebar" }}
<div class="position-sticky blog-sidebar" style="top: 2rem;"> <div class="position-sticky blog-sidebar" style="top: 2rem;">
<div class="p-4"> <div class="p-4">
{{/* range $tax := .Site.Params.Blog.Taxonomies }}
{{ $taxUrl := $.Site.GetPage (printf "/%s" $tax) }}
<h4 class="fst-italic"><a href="{{- $taxUrl.Permalink -}}">{{ $tax }}</a></h4>
<ul class="mb-2">
{{ $parentLink := (printf "/%s/" $tax) }}
{{ $x := (index $.Site.Taxonomies "tags") }}
{{ range (index $.Site.Taxonomies $tax) }}
{{ printf "%#v" . }}
<li><a href="{{/* (printf "%s%s" $parentLink $key) * /}}">{{/* $key * /}}</a></li>
{{ end }}
</ul>
{{ end */}}
{{ $catIdent := .Site.Params.Blog.Categories | default "categories" }} {{ $catIdent := .Site.Params.Blog.Categories | default "categories" }}
{{ $cats := (index $.Site.Taxonomies $catIdent)}} {{ $cats := (index $.Site.Taxonomies $catIdent)}}
{{ if $cats }} {{ if $cats }}
<h4 class="fst-italic">Kategorien</h4> <h4 class="fst-italic border-bottom border-dark mt-2">Kategorien</h4>
<ul class="mb-2"> <div class="categories mb-2 d-inline-block">
{{ $parentLink := ($.Site.GetPage (printf "/categories")).Permalink }} {{ $parentLink := ($.Site.GetPage (printf "/categories")).Permalink }}
{{ range $key, $sites := $cats }} {{ range $key, $sites := $cats }}
<li><a href="{{ (printf "%s%s" $parentLink $key) }}">{{ $key }}</a>&nbsp;<small>({{ $sites.Count }})</small></li> <div class="m-1 d-inline-flex">
<a class="bg-dark text-white py-1 px-2 m-0 rounded-start" href="{{ (printf "%s%s" $parentLink $key) }}">{{ $key }}</a>
<div class="bg-danger text-white py-1 px-2 m-0 rounded-end">{{ $sites.Count }}</div>
</div>
{{ end }} {{ end }}
</ul> </div>
{{ end }} {{ end }}
{{/* https://mertbakir.gitlab.io/hugo/tag-cloud-in-hugo/ */}} {{/* https://mertbakir.gitlab.io/hugo/tag-cloud-in-hugo/ */}}
{{ $tagsIdent := .Site.Params.Blog.Tags | default "tags" }} {{ $tagsIdent := .Site.Params.Blog.Tags | default "tags" }}
{{ $tags := (index $.Site.Taxonomies $tagsIdent)}} {{ $tags := (index $.Site.Taxonomies $tagsIdent)}}
{{ if $tags }} {{ if $tags }}
<h4 class="fst-italic">Schlagwortwolke</h4> <h4 class="fst-italic border-bottom border-dark mt-2">Schlagwortwolke</h4>
<div class="tag-cloud"> <div class="tag-cloud d-inline-block m-0 p-0">
{{ $parentLink := ($.Site.GetPage (printf "/%s" $tagsIdent)).Permalink }} {{ $parentLink := ($.Site.GetPage (printf "/%s" $tagsIdent)).Permalink }}
{{ $maxCnt := mul 1.0 (index $tags.ByCount 0).Count }} {{ $maxCnt := mul 1.0 (index $tags.ByCount 0).Count }}
{{ $minCnt := mul 1.0 (index $tags.ByCount.Reverse 0).Count }} {{ $minCnt := mul 1.0 (index $tags.ByCount.Reverse 0).Count }}
{{ $div := math.Max 1 (sub $maxCnt $minCnt) }} {{ $div := math.Max 1 (sub $maxCnt $minCnt) }}
{{ range $key, $sites := $tags }} {{ range $key, $sites := $tags }}
<!-- add (mul (math.Pow (div $sites.Count $maxCnt) 2.0) 14.0) 8.0 px --> <!-- add (mul (math.Pow (div $sites.Count $maxCnt) 2.0) 14.0) 8.0 px -->
{{- (printf `<a class="tag-cloud-link" style="font-size: %.3frem;" href="%s" aria-label="%s %d Einträge">%s<sup>%d</sup></a>` {{- (printf `<a class="tag-cloud-link m-1 p-1" style="font-size: %.3frem;" href="%s" aria-label="%s %d Einträge">%s<sup>%d</sup></a>`
(add (mul (math.Pow (div (sub $sites.Count $minCnt) $div) 2.0) 0.6) 0.8) (add (mul (math.Pow (div (sub $sites.Count $minCnt) $div) 2.0) 0.6) 0.8)
($parentLink | relURL) $key $sites.Count $key $sites.Count ($key | relURL) $key $sites.Count $key $sites.Count
) | safeHTML -}} ) | safeHTML -}}
<!--<span class="badge">{{ $sites.Count }}</span>--> <!--<span class="badge">{{ $sites.Count }}</span>-->
@ -86,25 +75,13 @@
</div> </div>
{{ end }} {{ end }}
{{/* range $taxonomy_term, $taxonomy := .Site.Taxonomies }} <h4 class="fst-italic border-bottom border-dark mt-2">Archive</h4>
{{ with $.Site.GetPage (printf "/%s" $taxonomy_term) }} <div class="mb-2 list-group">
<h4 class="fst-italic"><a class="text-decoration-none" href="{{ .Permalink }}">{{ $taxonomy_term }}</a></h4>
<ul class="mb-2">
{{ $parentLink := .Permalink }}
{{ range $key, $sites := $taxonomy }}
<li><a href="{{ (printf "%s%s" $parentLink $key) }}">{{ $key }}</a></li>
{{ end }}
</ul>
{{ end }}
{{ end */}}
<h4 class="fst-italic">Archive</h4>
<ul class="mb-2">
{{/* Hier explizit auf Type achten!! */}} {{/* Hier explizit auf Type achten!! */}}
{{ range (where .Site.RegularPages "Type" "blog").GroupByDate "2006" }} {{ range (where .Site.RegularPages "Type" "blog").GroupByDate "2006" }}
<li><a href="/blog/{{ .Key }}">Year {{ .Key }}</a></li> <a class="list-group-item list-group-item-action" href="/blog/{{ .Key }}">Jahr {{ .Key }}</a>
{{ end }} {{ end }}
</ul> </div>
</div> </div>
</div> </div>
{{ end }} {{ end }}

2
layouts/partials/footer.html
View file

@ -1,4 +1,4 @@
<footer class="footer bg-dark text-white"> <footer class="bg-dark text-bg-dark">
<nav class="nav justify-content-center navbar-expand-md navbar-dark "> <nav class="nav justify-content-center navbar-expand-md navbar-dark ">
<a class="nav-link" href="#">Impressum & Datenschutz</a> <a class="nav-link" href="#">Impressum & Datenschutz</a>
{{ with .OutputFormats.Get "rss" -}} {{ with .OutputFormats.Get "rss" -}}