Add site params content_max_width, metadata_max_width

master
Will Faught 3 years ago
parent f98f3d1af2
commit 64455aeb92

@ -212,6 +212,7 @@ paige:
scripts_path: "my-assets/my-bootstrap.bundle.min.js" # Use local Bootstrap scripts
styles_path: "my-assets/my-bootstrap.min.css" # Use local Bootstrap styles
color: "#123456" # Theme color for Safari and Windows
content_max_width: 66ch # Page table of contents and content max width
comments:
cactus: # cactus.chat
account_id: "123456"
@ -234,6 +235,7 @@ paige:
hide_theme_comment: true # Don't put a link to this project in a code comment
hide_theme_link: true # Don't put a link to this project in the footer
menu_style: "links" # Menu is link list for "links", tab list for "tabs", or pill list if unset
metadata_max_width: 100ch # Page metadata max width
rss:
managing_editor: "Michael Bluth"
web_master: "Michael Bluth"

@ -1,5 +1,7 @@
<article>
{{ partial "paige/metadata" . }}
{{ partial "paige/toc" . }}
{{ partial "paige/content" . }}
<div class="align-items-center d-flex flex-column mb-0">
{{ partial "paige/metadata" . }}
{{ partial "paige/toc" . }}
{{ partial "paige/content" . }}
</div>
</article>

@ -1,17 +1,9 @@
{{ if .Content }}
<section>
<div class="container-fluid">
<div class="justify-content-center row">
<div class="col col-auto px-0">
<article>
{{ if .Scratch.Get "paige_show_full_pages" }}
{{ .Content }}
{{ else }}
{{ .Content | replaceRE `(<h[1-6] id="([^"]+)".+)(</h[1-6]+>)` `${1}<a class="paige-header-link" href="#${2}">#</a>${3}` | safeHTML }}
{{ end }}
</article>
</div>
</div>
</div>
<section class="paige-content">
{{ if .Scratch.Get "paige_show_full_pages" }}
{{ .Content }}
{{ else }}
{{ .Content | replaceRE `(<h[1-6] id="([^"]+)".+)(</h[1-6]+>)` `${1}<a class="paige-header-link" href="#${2}">#</a>${3}` | safeHTML }}
{{ end }}
</section>
{{ end }}

@ -1,4 +1,4 @@
<section>
<section class="paige-metadata">
{{ partial "paige/title" . }}
{{ partial "paige/description" . }}
{{ partial "paige/other" . }}

@ -1,11 +1,11 @@
<script>
function paigeResize() {
var e = document.querySelector("body > div.container > div.row > div.col");
var e = document.querySelector('body > div.container');
var s = getComputedStyle(e);
var px = parseFloat(s.paddingLeft) + parseFloat(s.paddingRight);
var bx = parseFloat(s.borderLeftWidth) + parseFloat(s.borderRightWidth);
var w = e.offsetWidth - px - bx;
var es = document.querySelectorAll("article > div");
var es = document.querySelectorAll('section[class="paige-content"] > div');
for (var i = 0; i < es.length; i++) {
var e = es[i];
if (e.offsetWidth !== w) {

@ -1,8 +1,4 @@
<style>
article > div {
margin-bottom: 1rem;
}
body, html {
height: 100%;
}
@ -21,6 +17,22 @@ h1:hover .paige-header-link, h2:hover .paige-header-link, h3:hover .paige-header
display: inline;
}
section[class="paige-content"] > div {
margin-bottom: 1rem;
}
{{ with .Site.Params.paige.content_max_width }}
section[class="paige-content"], section[class="paige-toc"] {
max-width: {{ . }};
}
{{ end }}
{{ with .Site.Params.paige.metadata_max_width }}
section[class="paige-metadata"] {
max-width: {{ . }};
}
{{ end }}
.paige-header-link {
display: none;
margin-left: 0.25ch;

@ -1,11 +1,7 @@
{{ if and .Content .Params.paige.toc (ne .TableOfContents `<nav id="TableOfContents"></nav>`) }}
<section>
<div class="container-fluid mb-3">
<div class="justify-content-center row">
<div class="border col col-auto pe-3 ps-3 pt-3 rounded">
{{ .TableOfContents }}
</div>
</div>
<section class="paige-toc">
<div class="border mb-3 pe-3 ps-3 pt-3 rounded">
{{ .TableOfContents }}
</div>
</section>
{{ end }}

Loading…
Cancel
Save