KureShisen/Hugo-theme-stack
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: article page widget support (#488)

Browse Source 
* feat: article page widget support

* refactor: get rid of article toolbar

Same 3 column layout for article page and homepage

* add missing space
This commit is contained in:
Jimmy Cai 2022-02-26 23:45:25 +01:00 committed by GitHub
parent 0fbbc12949
commit 4d552a9df5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 71 additions and 133 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

61
assets/scss/partials/layout/article.scss
View File

@ -122,67 +122,6 @@
} }
} }
.article-page.has-toc {
.left-sidebar {
display: none;
}
.right-sidebar {
width: 100%;
padding: 0;
display: none;
@include respond(xl) {
display: block;
top: var(--main-top-padding);
}
}
#article-toolbar {
display: block;
@include respond(md) {
padding: 0;
}
@include respond(xl) {
margin-top: 0;
position: sticky;
top: var(--main-top-padding);
flex-shrink: 1;
a {
background: transparent;
box-shadow: none;
border: 1px solid var(--body-text-color);
width: 100%;
margin-right: 0;
svg {
flex-shrink: 0;
}
}
}
}
.main-container {
align-items: start;
flex-direction: column;
@include respond(xl) {
flex-direction: row;
}
}
.main {
padding-top: 0;
@include respond(xl) {
padding-top: var(--main-top-padding);
}
}
}
.widget--toc { .widget--toc {
background-color: var(--card-background); background-color: var(--card-background);
border-radius: var(--card-border-radius); border-radius: var(--card-border-radius);

2
assets/scss/partials/sidebar.scss
View File

@ -37,7 +37,7 @@
} }
.right-sidebar { .right-sidebar {
flex-shrink: 0; width: 100%;
display: none; display: none;
&.sticky { &.sticky {

12
config.yaml
View File

@ -108,16 +108,8 @@ params:
id: id:
widgets: widgets:
enabled: homepage: []
- search page: []
- archives
- tag-cloud
archives:
limit: 5
tagCloud:
limit: 10
opengraph: opengraph:
twitter: twitter:

16
exampleSite/config.yaml
View File

@ -132,16 +132,16 @@ params:
host: host:
id: id:
widgets: widgets:
enabled: homepage:
- search - type: search
- archives - type: archives
- tag-cloud params:
archives:
limit: 5 limit: 5
- type: tag-cloud
tagCloud: params:
limit: 10 limit: 10
page:
- type: toc
opengraph: opengraph:
twitter: twitter:

3
layouts/_default/baseof.html
View File

@ -6,7 +6,8 @@
</head> </head>
<body class="{{ block `body-class` . }}{{ end }}"> <body class="{{ block `body-class` . }}{{ end }}">
{{- partial "head/colorScheme" . -}} {{- partial "head/colorScheme" . -}}
<div class="container main-container flex {{ block `container-class` . }}on-phone--column {{ if .Site.Params.widgets.enabled }}extended{{ else }}compact{{ end }}{{ end }}"> {{- $hasWidget := default (gt (len .Site.Params.widgets.homepage) 0) (.Scratch.Get "hasWidget") -}}
<div class="container main-container flex on-phone--column {{ if $hasWidget }}extended{{ else }}compact{{ end }}">
{{- block "left-sidebar" . -}} {{- block "left-sidebar" . -}}
{{ partial "sidebar/left.html" . }} {{ partial "sidebar/left.html" . }}
{{- end -}} {{- end -}}

2
layouts/_default/list.html
View File

@ -77,5 +77,5 @@
{{ end }} {{ end }}
{{ define "right-sidebar" }} {{ define "right-sidebar" }}
{{ partialCached "sidebar/right.html" . }} {{ partial "sidebar/right.html" (dict "Context" . "Scope" "homepage") }}
{{ end }} {{ end }}

59
layouts/_default/single.html
View File

@ -1,15 +1,26 @@
{{ define "body-class" }} {{ define "body-class" }}
{{ $TOCEnabled := default (default false .Site.Params.article.toc) .Params.toc }} article-page
{{- .Scratch.Set "hasTOC" (and (ge (len .TableOfContents) 100) $TOCEnabled) -}} {{/*
article-page {{ if (.Scratch.Get "hasTOC") }}has-toc{{ end }} Enable the right sidebar if
{{ end }} - Widget different from 'TOC' is enabled
- TOC is enabled and not empty
*/}}
{{- $HasWidgetNotTOC := false -}}
{{- $TOCWidgetEnabled := false -}}
{{- range .Site.Params.widgets.page -}}
{{- if ne .type "toc" -}}
{{ $HasWidgetNotTOC = true -}}
{{- else -}}
{{ $TOCWidgetEnabled = true -}}
{{- end -}}
{{- end -}}
{{ define "container-class" }} {{- $TOCManuallyDisabled := eq .Params.toc false -}}
{{ if (.Scratch.Get "hasTOC") }} {{- $TOCEnabled := and (not $TOCManuallyDisabled) $TOCWidgetEnabled -}}
extended {{- $hasTOC := ge (len .TableOfContents) 100 -}}
{{ else }} {{- .Scratch.Set "TOCEnabled" (and $TOCEnabled $hasTOC) -}}
on-phone--column {{ if .Site.Params.widgets.enabled }}extended{{ else }}compact{{ end }}
{{ end }} {{- .Scratch.Set "hasWidget" (or $HasWidgetNotTOC (and $TOCEnabled $hasTOC)) -}}
{{ end }} {{ end }}
{{ define "main" }} {{ define "main" }}
@ -30,32 +41,6 @@
{{ partialCached "article/components/photoswipe" . }} {{ partialCached "article/components/photoswipe" . }}
{{ end }} {{ end }}
{{ define "left-sidebar" }}
{{ if (.Scratch.Get "hasTOC") }}
<div id="article-toolbar">
<a href="{{ .Site.BaseURL | relLangURL }}" class="back-home">
{{ (resources.Get "icons/back.svg").Content | safeHTML }}
<span>{{ T "article.back" }}</span>
</a>
</div>
{{ else }}
{{ partial "sidebar/left.html" . }}
{{ end }}
{{ end }}
{{ define "right-sidebar" }} {{ define "right-sidebar" }}
{{ if (.Scratch.Get "hasTOC") }} {{ if .Scratch.Get "hasWidget" }}{{ partial "sidebar/right.html" (dict "Context" . "Scope" "page") }}{{ end}}
<aside class="sidebar right-sidebar sticky">
<section class="widget archives">
<div class="widget-icon">
{{ partial "helper/icon" "hash" }}
</div>
<h2 class="widget-title section-title">{{ T "article.tableOfContents" }}</h2>
<div class="widget--toc">
{{ .TableOfContents }}
</div>
</section>
</aside>
{{ end }}
{{ end }} {{ end }}

2
layouts/index.html
View File

@ -15,5 +15,5 @@
{{ end }} {{ end }}
{{ define "right-sidebar" }} {{ define "right-sidebar" }}
{{ partial "sidebar/right.html" . }} {{ partial "sidebar/right.html" (dict "Context" . "Scope" "homepage") }}
{{ end }} {{ end }}

13
layouts/partials/sidebar/right.html
View File

@ -1,8 +1,13 @@
{{ if .Site.Params.widgets.enabled }} {{- $scope := default "homepage" .Scope -}}
{{ $context := . }} {{- $context := .Context -}}
{{- with (index .Context.Site.Params.widgets $scope) -}}
<aside class="sidebar right-sidebar sticky"> <aside class="sidebar right-sidebar sticky">
{{ range $widget := .Site.Params.widgets.enabled }} {{ range $widget := . }}
{{ partial (printf "widget/%s" $widget) $context }} {{ if templates.Exists (printf "partials/widget/%s.html" .type) }}
{{ partial (printf "widget/%s" .type) (dict "Context" $context "Params" .params) }}
{{ else }}
{{ warnf "Widget %s not found" .type }}
{{ end }}
{{ end }} {{ end }}
</aside> </aside>
{{ end }} {{ end }}

12
layouts/partials/widget/archives.html
View File

@ -1,4 +1,6 @@
{{- $query := first 1 (where .Site.Pages "Layout" "==" "archives") -}} {{- $query := first 1 (where .Context.Site.Pages "Layout" "==" "archives") -}}
{{- $context := .Context -}}
{{- $limit := default 5 .Params.limit -}}
{{- if $query -}} {{- if $query -}}
{{- $archivesPage := index $query 0 -}} {{- $archivesPage := index $query 0 -}}
<section class="widget archives"> <section class="widget archives">
@ -7,17 +9,17 @@
</div> </div>
<h2 class="widget-title section-title">{{ T "widget.archives.title" }}</h2> <h2 class="widget-title section-title">{{ T "widget.archives.title" }}</h2>
{{ $pages := where .Site.RegularPages "Type" "in" .Site.Params.mainSections }} {{ $pages := where $context.Site.RegularPages "Type" "in" $context.Site.Params.mainSections }}
{{ $notHidden := where .Site.RegularPages "Params.hidden" "!=" true }} {{ $notHidden := where $context.Site.RegularPages "Params.hidden" "!=" true }}
{{ $filtered := ($pages | intersect $notHidden) }} {{ $filtered := ($pages | intersect $notHidden) }}
{{ $archives := $filtered.GroupByDate "2006" }} {{ $archives := $filtered.GroupByDate "2006" }}
<div class="widget-archive--list"> <div class="widget-archive--list">
{{ range $index, $item := first (add .Site.Params.widgets.archives.limit 1) ($archives) }} {{ range $index, $item := first (add $limit 1) ($archives) }}
{{- $id := lower (replace $item.Key " " "-") -}} {{- $id := lower (replace $item.Key " " "-") -}}
<div class="archives-year"> <div class="archives-year">
<a href="{{ $archivesPage.RelPermalink }}#{{ $id }}"> <a href="{{ $archivesPage.RelPermalink }}#{{ $id }}">
{{ if eq $index $.Site.Params.widgets.archives.limit }} {{ if eq $index $limit }}
<span class="year">{{ T "widget.archives.more" }}</span> <span class="year">{{ T "widget.archives.more" }}</span>
{{ else }} {{ else }}
<span class="year">{{ .Key }}</span> <span class="year">{{ .Key }}</span>

2
layouts/partials/widget/search.html
View File

@ -1,4 +1,4 @@
{{- $query := first 1 (where .Site.Pages "Layout" "==" "search") -}} {{- $query := first 1 (where .Context.Site.Pages "Layout" "==" "search") -}}
{{- if $query -}} {{- if $query -}}
{{- $searchPage := index $query 0 -}} {{- $searchPage := index $query 0 -}}
<form action="{{ $searchPage.RelPermalink }}" class="search-form widget" {{ with .OutputFormats.Get "json" -}}data-json="{{ .Permalink }}" {{- end }}> <form action="{{ $searchPage.RelPermalink }}" class="search-form widget" {{ with .OutputFormats.Get "json" -}}data-json="{{ .Permalink }}" {{- end }}>

4
layouts/partials/widget/tag-cloud.html
View File

@ -1,3 +1,5 @@
{{- $context := .Context -}}
{{- $limit := default 10 .Params.limit -}}
<section class="widget tagCloud"> <section class="widget tagCloud">
<div class="widget-icon"> <div class="widget-icon">
{{ partial "helper/icon" "tag" }} {{ partial "helper/icon" "tag" }}
@ -5,7 +7,7 @@
<h2 class="widget-title section-title">{{ T "widget.tagCloud.title" }}</h2> <h2 class="widget-title section-title">{{ T "widget.tagCloud.title" }}</h2>
<div class="tagCloud-tags"> <div class="tagCloud-tags">
{{ range first .Site.Params.widgets.tagCloud.limit .Site.Taxonomies.tags.ByCount }} {{ range first $limit $context.Site.Taxonomies.tags.ByCount }}
<a href="{{ .Page.RelPermalink }}" class="font_size_{{ .Count }}"> <a href="{{ .Page.RelPermalink }}" class="font_size_{{ .Count }}">
{{ .Page.Title }} {{ .Page.Title }}
</a> </a>

12
layouts/partials/widget/toc.html Normal file
View File

@ -0,0 +1,12 @@
{{ if (.Context.Scratch.Get "TOCEnabled") }}
<section class="widget archives">
<div class="widget-icon">
{{ partial "helper/icon" "hash" }}
</div>
<h2 class="widget-title section-title">{{ T "article.tableOfContents" }}</h2>
<div class="widget--toc">
{{ .Context.TableOfContents }}
</div>
</section>
{{ end }}