Rockingcool
/
paige-hugo
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

Add page, site prefixes to all CSS names

Browse Source
master
Will Faught 5 months ago
parent 03208bde58
commit aabb52bd64
11 changed files with 139 additions and 134 deletions
Show Stats Download Patch File Download Diff File

131
README.md
Unescape Escape View File

@ -1035,107 +1035,112 @@ Use CSS selectors to extend the default styling.
Page identifiers:
<dl>
<dt><code>#paige-alert</code></dt>
<dt><code>#paige-page-alert</code></dt>
<dd>The page alert.</dd>
<dt><code>#paige-authors</code></dt>
<dt><code>#paige-page-authors</code></dt>
<dd>The page authors.</dd>
<dt><code>#paige-breadcrumbs</code></dt>
<dd>The site breadcrumbs.</dd>
<dt><code>#paige-collections</code></dt>
<dd>The site collection pages.</dd>
<dt><code>#paige-collections-header</code></dt>
<dd>The site collection pages header.</dd>
<dt><code>#paige-content</code></dt>
<dt><code>#paige-page-collections</code></dt>
<dd>The page collections.</dd>
<dt><code>#paige-page-collections-header</code></dt>
<dd>The page collections header.</dd>
<dt><code>#paige-page-content</code></dt>
<dd>The page content.</dd>
<dt><code>#paige-copyright</code></dt>
<dd>The site copyright.</dd>
<dt><code>#paige-credit</code></dt>
<dd>The site credit.</dd>
<dt><code>#paige-date</code></dt>
<dt><code>#paige-page-date</code></dt>
<dd>The page date.</dd>
<dt><code>#paige-edit</code></dt>
<dd>The page edit link.</dd>
<dt><code>#paige-file</code></dt>
<dd>The page edit and history links.</dd>
<dt><code>#paige-history</code></dt>
<dd>The page history link.</dd>
<dt><code>#paige-keywords</code></dt>
<dd>The page keywords.</dd>
<dt><code>#paige-license</code></dt>
<dd>The site license.</dd>
<dt><code>#paige-menu</code></dt>
<dd>The site menu.</dd>
<dt><code>#paige-metadata</code></dt>
<dd>The page metadata.</dd>
<dt><code>#paige-next</code></dt>
<dd>The next page link.</dd>
<dt><code>#paige-page-description</code></dt>
<dd>The page description.</dd>
<dt><code>#paige-page-edit</code></dt>
<dd>The page edit link.</dd>
<dt><code>#paige-page-file</code></dt>
<dd>The container of the page edit and history links.</dd>
<dt><code>#paige-page-footer</code></dt>
<dd>The page footer that contains the page edit, history, next, and previous links.</dd>
<dt><code>#paige-page-header</code></dt>
<dd>The page header that contains the page title, description, metadata, and table of contents.</dd>
<dt><code>#paige-page-title</code></dt>
<dd>The page title.</dd>
<dt><code>#paige-subpages</code></dt>
<dd>The page sub-pages.</dd>
<dt><code>#paige-subpages-header</code></dt>
<dd>The page subpages header.</dd>
<dt><code>#paige-pagination</code></dt>
<dt><code>#paige-page-history</code></dt>
<dd>The page history link.</dd>
<dt><code>#paige-page-keywords</code></dt>
<dd>The page keywords.</dd>
<dt><code>#paige-page-metadata</code></dt>
<dd>The page metadata.</dd>
<dt><code>#paige-page-next</code></dt>
<dd>The next page link.</dd>
<dt><code>#paige-page-pages</code></dt>
<dd>The page pages.</dd>
<dt><code>#paige-page-pages-header</code></dt>
<dd>The page pages header.</dd>
<dt><code>#paige-page-pagination</code></dt>
<dd>The pagination of sub-pages.</dd>
<dt><code>#paige-prev</code></dt>
<dt><code>#paige-page-prev</code></dt>
<dd>The previous page link.</dd>
<dt><code>#paige-reading-time</code></dt>
<dt><code>#paige-page-reading-time</code></dt>
<dd>The page reading time.</dd>
<dt><code>#paige-sections</code></dt>
<dd>The page section sub-pages.</dd>
<dt><code>#paige-sections-header</code></dt>
<dd>The page section sub-pages header.</dd>
<dt><code>#paige-series</code></dt>
<dt><code>#paige-page-sections</code></dt>
<dd>The page sections.</dd>
<dt><code>#paige-page-sections-header</code></dt>
<dd>The page sections header.</dd>
<dt><code>#paige-page-series</code></dt>
<dd>The page series.</dd>
<dt><code>#paige-siblings</code></dt>
<dd>The page next and previous links.</dd>
<dt><code>#paige-page-siblings</code></dt>
<dd>The container of the page next and previous links.</dd>
<dt><code>#paige-page-title</code></dt>
<dd>The page title.</dd>
<dt><code>#paige-page-toc</code></dt>
<dd>The page table of contents.</dd>
</dl>
Site identifiers:
<dl>
<dt><code>#paige-site-breadcrumbs</code></dt>
<dd>The site breadcrumbs.</dd>
<dt><code>#paige-site-copyright</code></dt>
<dd>The site copyright.</dd>
<dt><code>#paige-site-credit</code></dt>
<dd>The site credit.</dd>
<dt><code>#paige-site-description</code></dt>
<dd>The site description.</dd>
<dt><code>#paige-site-footer</code></dt>
<dd>The site footer that contains the site copyright, license, and credit.</dd>
<dt><code>#paige-site-header</code></dt>
<dd>The site header that contains the site title, description, menu, and breadcrumbs.</dd>
<dt><code>#paige-site-license</code></dt>
<dd>The site license.</dd>
<dt><code>#paige-site-menu</code></dt>
<dd>The site menu.</dd>
<dt><code>#paige-site-title</code></dt>
<dd>The site title.</dd>
<dt><code>#paige-toc</code></dt>
<dd>The table of contents.</dd>
</dl>
Page classes:
<dl>
<dt><code>.paige-keyword</code></dt>
<dt><code>.paige-page-keyword</code></dt>
<dd>A keyword.</dd>
<dt><code>.paige-keyword-category</code></dt>
<dt><code>.paige-page-keyword-category</code></dt>
<dd>A category keyword.</dd>
<dt><code>.paige-keyword-tag</code></dt>
<dt><code>.paige-page-keyword-tag</code></dt>
<dd>A tag keyword.</dd>
<dt><code>.paige-keywords</code></dt>
<dt><code>.paige-page-keywords</code></dt>
<dd>The keywords.</dd>
</dl>
Sub-page classes:
<dl>
<dt><code>.paige-authors</code></dt>
<dt><code>.paige-page-authors</code></dt>
<dd>The authors.</dd>
<dt><code>.paige-date</code></dt>
<dt><code>.paige-page-date</code></dt>
<dd>The date.</dd>
<dt><code>.paige-description</code></dt>
<dd>The description.</dd>
<dt><code>.paige-metadata</code></dt>
<dt><code>.paige-page-metadata</code></dt>
<dd>The metadata.</dd>
<dt><code>.paige-page</code></dt>
<dd>A page.</dd>
<dt><code>.paige-reading-time</code></dt>
<dt><code>.paige-page-reading-time</code></dt>
<dd>The reading time.</dd>
<dt><code>.paige-series</code></dt>
<dt><code>.paige-page-series</code></dt>
<dd>The series.</dd>
<dt><code>.paige-summary</code></dt>
<dd>The summary.</dd>
@ -1234,7 +1239,7 @@ try the following in `yoursite/hugo.toml`:
```toml
[params.paige]
style = """
#paige-content > * { margin-left: auto; margin-right: auto; max-width: 40rem; }
#paige-page-content > * { margin-left: auto; margin-right: auto; max-width: 40rem; }
"""
```
@ -1249,11 +1254,11 @@ try the following in `yoursite/hugo.toml`:
```toml
[params.paige]
style = """
#paige-content > * { margin-left: auto; margin-right: auto; max-width: 40rem; }
#paige-content > img,
#paige-content > .paige-image,
#paige-content > .paige-vimeo,
#paige-content > .paige-youtube { max-width: 100%; }
#paige-page-content > * { margin-left: auto; margin-right: auto; max-width: 40rem; }
#paige-page-content > img,
#paige-page-content > .paige-image,
#paige-page-content > .paige-vimeo,
#paige-page-content > .paige-youtube { max-width: 100%; }
"""
```

64
exampleSite/content/customizations/style.md
Unescape Escape View File

@ -8,25 +8,25 @@ tags = ["singles", "style"]
title = "Style Data"
[paige]
style = """
#paige-authors,
#paige-breadcrumbs,
#paige-content,
#paige-copyright,
#paige-credit,
#paige-date,
#paige-description,
#paige-file,
#paige-keywords,
#paige-license,
#paige-menu,
#paige-page-title,
#paige-page-authors,
#paige-page-content,
#paige-page-date,
#paige-page-description,
#paige-reading-time,
#paige-series,
#paige-siblings,
#paige-site-title,
#paige-page-file,
#paige-page-keywords,
#paige-page-reading-time,
#paige-page-series,
#paige-page-siblings,
#paige-page-title,
#paige-page-toc,
#paige-site-breadcrumbs,
#paige-site-copyright,
#paige-site-credit,
#paige-site-description,
#paige-toc {
#paige-site-license,
#paige-site-menu,
#paige-site-title {
font-style: italic;
}
"""
@ -101,25 +101,25 @@ This page has the following parameters:
[paige]
style = """
#paige-authors,
#paige-breadcrumbs,
#paige-content,
#paige-copyright,
#paige-credit,
#paige-date,
#paige-description,
#paige-file,
#paige-keywords,
#paige-license,
#paige-menu,
#paige-page-title,
#paige-page-authors,
#paige-page-content,
#paige-page-date,
#paige-page-description,
#paige-reading-time,
#paige-series,
#paige-siblings,
#paige-site-title,
#paige-page-file,
#paige-page-keywords,
#paige-page-reading-time,
#paige-page-series,
#paige-page-siblings,
#paige-page-title,
#paige-page-toc,
#paige-site-breadcrumbs,
#paige-site-copyright,
#paige-site-credit,
#paige-site-description,
#paige-toc {
#paige-site-license,
#paige-site-menu,
#paige-site-title {
font-style: italic;
}
"""

2
layouts/_default/paige/cloud.html
Unescape Escape View File

@ -4,7 +4,7 @@
{{ partial "paige/page.html" $page }}
{{ with $page.Pages }}
<div id="paige-subpages">
<div id="paige-page-pages">
<ul class="list-inline text-center">
{{ range (sort . "LinkTitle") }}
<li class="list-inline-item">

14
layouts/partials/paige/list-item.html
Unescape Escape View File

@ -55,7 +55,7 @@
{{ end }}
{{ with $keywords }}
<p class="paige-keywords paige-row-short text-center text-secondary">
<p class="paige-page-keywords paige-row-short text-center text-secondary">
{{ range $i, $term := . -}}
{{- $kind := false -}}
@ -68,18 +68,18 @@
{{- if $normal -}}
{{- if gt $i 0 }} · {{ end -}}
<a class="link-secondary paige-keyword paige-keyword-{{ $kind }}" href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
<a class="link-secondary paige-page-keyword paige-page-keyword-{{ $kind }}" href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
{{- else -}}
{{- if gt $i 0 }} {{ end -}}
<a class="badge paige-keyword paige-keyword-{{ $kind }} text-bg-secondary text-decoration-none" href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
<a class="badge paige-page-keyword paige-page-keyword-{{ $kind }} text-bg-secondary text-decoration-none" href="{{ .RelPermalink }}">{{ .LinkTitle }}</a>
{{- end -}}
{{- end }}
</p>
{{ end }}
{{ with $series }}
<p class="paige-row-short paige-series text-center text-secondary">
<p class="paige-row-short paige-page-series text-center text-secondary">
{{ range $i, $series := . -}}
{{- if gt $i 0 }} · {{ end -}}
@ -89,7 +89,7 @@
{{ end }}
{{ with $authors }}
<p class="paige-authors text-center paige-row-short text-secondary">
<p class="paige-page-authors text-center paige-row-short text-secondary">
{{ range $i, $author := . -}}
{{- if gt $i 0 }} · {{ end -}}
@ -99,12 +99,12 @@
{{ end }}
{{ with $date }}
<p class="paige-date text-center paige-row-short text-secondary">
<p class="paige-page-date text-center paige-row-short text-secondary">
<time datetime="{{ .Format `2006-01-02` }}">{{ time.Format $format . }}</time>
</p>
{{ end }}
{{ with $time }}
<p class="paige-reading-time paige-row-short text-center text-secondary">{{ . }} {{ i18n "paige_minutes" . }}</p>
<p class="paige-page-reading-time paige-row-short text-center text-secondary">{{ . }} {{ i18n "paige_minutes" . }}</p>
{{ end }}
</div>

14
layouts/partials/paige/list.html
Unescape Escape View File

@ -7,7 +7,7 @@
{{ $pager := .pager }}
{{ if or $pager.HasPrev $pager.HasNext }}
<div id="paige-pagination">
<div id="paige-page-pagination">
<div class="d-flex justify-content-center">
<nav aria-label="{{ i18n `paige_page_list_navigation` }}">
<ul class="pagination">
@ -58,9 +58,9 @@
{{ end }}
{{ with $collections }}
<div id="paige-collections">
<div id="paige-page-collections">
{{ if or $sections $pages }}
<h2 class="h5 text-center" id="paige-collections-header">{{ i18n "paige_collections" }}</h2>
<h2 class="h5 text-center" id="paige-page-collections-header">{{ i18n "paige_collections" }}</h2>
{{ end }}
{{ if or $sections $pages }}
@ -80,9 +80,9 @@
{{ end }}
{{ with $sections }}
<div id="paige-sections">
<div id="paige-page-sections">
{{ if or $collections $pages }}
<h2 class="h5 text-center" id="paige-sections-header">{{ i18n "paige_sections" }}</h2>
<h2 class="h5 text-center" id="paige-page-sections-header">{{ i18n "paige_sections" }}</h2>
{{ end }}
{{ if $pages }}
@ -102,9 +102,9 @@
{{ end }}
{{ with $pages }}
<div id="paige-subpages">
<div id="paige-page-pages">
{{ if or $collections $sections }}
<h2 class="h5 text-center" id="paige-subpages-header">{{ i18n "paige_pages" }}</h2>
<h2 class="h5 text-center" id="paige-page-pages-header">{{ i18n "paige_pages" }}</h2>
{{ end }}
{{ $pager := $page.Paginate . }}

12
layouts/partials/paige/page-footer.html
Unescape Escape View File

@ -22,15 +22,15 @@
{{ partial "paige/func-include.html" (dict "name" "page-footer-first%s.html" "page" $page) }}
{{ if or $edit $history }}
<div id="paige-file">
<div id="paige-page-file">
{{ with $edit }}
<div class="paige-row-short text-center text-secondary" id="paige-edit">
<div class="paige-row-short text-center text-secondary" id="paige-page-edit">
<a class="link-secondary" href="{{ . }}">{{ i18n "paige_edit_this_page" }}</a>
</div>
{{ end }}
{{ with $history }}
<div class="paige-row-short text-center text-secondary" id="paige-history">
<div class="paige-row-short text-center text-secondary" id="paige-page-history">
<a class="link-secondary" href="{{ . }}">{{ i18n "paige_edit_history" }}</a>
</div>
{{ end }}
@ -38,13 +38,13 @@
{{ end }}
{{ if or $next $prev }}
<div id="paige-siblings">
<div id="paige-page-siblings">
{{ with $prev }}
<div class="paige-row-short text-center text-secondary" id="paige-next"><a class="link-secondary" href="{{ .Permalink }}">{{ .LinkTitle }}</a> &rsaquo;</div>
<div class="paige-row-short text-center text-secondary" id="paige-page-next"><a class="link-secondary" href="{{ .Permalink }}">{{ .LinkTitle }}</a> &rsaquo;</div>
{{ end }}
{{ with $next }}
<div class="paige-row-short text-center text-secondary" id="paige-prev">&lsaquo; <a class="link-secondary" href="{{ .Permalink }}">{{ .LinkTitle }}</a></div>
<div class="paige-row-short text-center text-secondary" id="paige-page-prev">&lsaquo; <a class="link-secondary" href="{{ .Permalink }}">{{ .LinkTitle }}</a></div>
{{ end }}
</div>
{{ end }}

20
layouts/partials/paige/page-header.html
Unescape Escape View File

@ -33,9 +33,9 @@
{{ end }}
{{ if or $authors $date $keywords $time $series }}
<div id="paige-metadata">
<div id="paige-page-metadata">
{{ with $keywords }}
<p class="{{ if $normal }} paige-row-short {{ end }} text-center {{ if $normal }} text-secondary {{ end }}" id="paige-keywords">
<p class="{{ if $normal }} paige-row-short {{ end }} text-center {{ if $normal }} text-secondary {{ end }}" id="paige-page-keywords">
{{ range $i, $term := . -}}
{{- $kind := false -}}
@ -48,18 +48,18 @@
{{- if $normal -}}
{{- if gt $i 0 }} · {{ end -}}
<a class="link-secondary paige-keyword paige-keyword-{{ $kind }}" href="{{ .RelPermalink }}" {{ if $microdata }} itemprop="keywords" {{ end }}>{{ .LinkTitle }}</a>
<a class="link-secondary paige-page-keyword paige-page-keyword-{{ $kind }}" href="{{ .RelPermalink }}" {{ if $microdata }} itemprop="keywords" {{ end }}>{{ .LinkTitle }}</a>
{{- else -}}
{{- if gt $i 0 }} {{ end -}}
<a class="badge paige-keyword paige-keyword-{{ $kind }} text-bg-secondary text-decoration-none" href="{{ .RelPermalink }}" {{ if $microdata }} itemprop="keywords" {{ end }}>{{ .LinkTitle }}</a>
<a class="badge paige-page-keyword paige-page-keyword-{{ $kind }} text-bg-secondary text-decoration-none" href="{{ .RelPermalink }}" {{ if $microdata }} itemprop="keywords" {{ end }}>{{ .LinkTitle }}</a>
{{- end -}}
{{- end }}
</p>
{{ end }}
{{ with $series }}
<p class="paige-row-short text-center text-secondary" id="paige-series">
<p class="paige-row-short text-center text-secondary" id="paige-page-series">
{{ range $i, $series := . -}}
{{- if gt $i 0 }} · {{ end -}}
@ -69,7 +69,7 @@
{{ end }}
{{ with $authors }}
<p class="paige-row-short text-center text-secondary" id="paige-authors">
<p class="paige-row-short text-center text-secondary" id="paige-page-authors">
{{ range $i, $author := . -}}
{{- if gt $i 0 }} · {{ end -}}
@ -79,23 +79,23 @@
{{ end }}
{{ with $date }}
<p class="paige-row-short text-center text-secondary" id="paige-date">
<p class="paige-row-short text-center text-secondary" id="paige-page-date">
<time datetime="{{ .Format `2006-01-02` }}" {{ if $microdata }} itemprop="datePublished" {{ end }}>{{ time.Format $format . }}</time>
</p>
{{ end }}
{{ with $time }}
<p class="paige-row-short text-center text-secondary" id="paige-reading-time" {{ if $microdata }} itemprop="timeRequired" {{ end }}>{{ . }} {{ i18n "paige_minutes" . }}</p>
<p class="paige-row-short text-center text-secondary" id="paige-page-reading-time" {{ if $microdata }} itemprop="timeRequired" {{ end }}>{{ . }} {{ i18n "paige_minutes" . }}</p>
{{ end }}
</div>
{{ end }}
{{ with $alert }}
<div class="alert alert-{{ .type }} paige-row-tall" id="paige-alert" role="alert">{{ .message | markdownify }}</div>
<div class="alert alert-{{ .type }} paige-row-tall" id="paige-page-alert" role="alert">{{ .message | markdownify }}</div>
{{ end }}
{{ if $toc }}
<div class="paige-row-tall" id="paige-toc">
<div class="paige-row-tall" id="paige-page-toc">
<div class="border pe-3 ps-3 pt-3 rounded">
{{ $page.TableOfContents }}
</div>

2
layouts/partials/paige/page.html
Unescape Escape View File

@ -48,7 +48,7 @@
{{ partial "paige/page-header.html" $page }}
{{ with $content }}
<main class="mw-100" id="paige-content">{{ . | safeHTML }}</main>
<main class="mw-100" id="paige-page-content">{{ . | safeHTML }}</main>
{{ end }}
{{ partial "paige/page-footer.html" $page }}

6
layouts/partials/paige/site-footer.html
Unescape Escape View File

@ -20,15 +20,15 @@
{{ partial "paige/func-include.html" (dict "name" "site-footer-first%s.html" "page" $page) }}
{{ with $copyright }}
<p class="paige-row-short text-center text-secondary" id="paige-copyright" {{ if $microdata }} itemprop="copyrightNotice" {{ end }}>{{ . }}</p>
<p class="paige-row-short text-center text-secondary" id="paige-site-copyright" {{ if $microdata }} itemprop="copyrightNotice" {{ end }}>{{ . }}</p>
{{ end }}
{{ with $license }}
<p class="paige-row-short text-center text-secondary" id="paige-license">{{ . }}</p>
<p class="paige-row-short text-center text-secondary" id="paige-site-license">{{ . }}</p>
{{ end }}
{{ with $credit }}
<p class="paige-row-short text-center text-secondary" id="paige-credit">{{ . }}</p>
<p class="paige-row-short text-center text-secondary" id="paige-site-credit">{{ . }}</p>
{{ end }}
{{ partial "paige/func-include.html" (dict "name" "site-footer-last%s.html" "page" $page) }}

6
layouts/partials/paige/site-header.html
Unescape Escape View File

@ -48,7 +48,7 @@
{{ if $menu }}
{{ with site.Menus.main }}
<nav aria-label="{{ i18n `paige_menu` }}" class="paige-row-tall" id="paige-menu">
<nav aria-label="{{ i18n `paige_menu` }}" class="paige-row-tall" id="paige-site-menu">
<ul class="align-items-center justify-content-center nav {{ if $pills }} nav-pills {{ else if $tabs }} nav-tabs {{ else if $underline }} nav-underline {{ end }}">
{{ range . }}
{{ $menuPath := strings.TrimPrefix $basePath .URL }}
@ -110,7 +110,7 @@
{{ $pages = sort $pages "LinkTitle" }}
<nav aria-label="{{ i18n `paige_menu` }}" class="paige-row-tall" id="paige-menu">
<nav aria-label="{{ i18n `paige_menu` }}" class="paige-row-tall" id="paige-site-menu">
<ul class="align-items-center justify-content-center nav {{ if $pills }} nav-pills {{ else if $tabs }} nav-tabs {{ else if $underline }} nav-underline {{ end }}">
{{ with $title }}
{{ $active := eq $page.Section "" }}
@ -139,7 +139,7 @@
{{ end }}
{{ with $breadcrumbs }}
<nav aria-label="{{ i18n `paige_breadcrumbs` }}" class="paige-row-tall" id="paige-breadcrumbs">
<nav aria-label="{{ i18n `paige_breadcrumbs` }}" class="paige-row-tall" id="paige-site-breadcrumbs">
<div class="d-flex justify-content-center">
<ol class="breadcrumb mb-0">
{{ $reverse := .Reverse }}

2
layouts/partials/paige/style.html
Unescape Escape View File

@ -73,7 +73,7 @@ blockquote > p:last-of-type {
.paige-row-short:last-child,
.paige-row-tall,
.paige-video,
#paige-content > *,
#paige-page-content > *,
table {
margin-bottom: 1rem;
}

Write Preview
Loading…
Cancel
Save