From bc3e1f9309ca2ca4e5db9e9e8c3fc2a0d2ce591b Mon Sep 17 00:00:00 2001 From: Jake Jarvis Date: Fri, 27 Mar 2020 20:58:52 -0400 Subject: [PATCH] set max width of pages in Hugo config.toml, retrieve value from SCSS https://gohugo.io/hugo-pipes/resource-from-template/ --- .markdownlintrc | 2 +- assets/sass/abstracts/_functions.scss | 2 +- assets/sass/abstracts/_variables.scss | 3 ++- assets/sass/components/_wave.scss | 1 + assets/sass/main.scss | 5 +++++ assets/sass/pages/_etc.scss | 2 +- assets/sass/pages/_single.scss | 2 +- config.toml | 7 ++++--- content/notes/coronavirus-open-source/index.md | 2 -- layouts/partials/functions/optimize-image.html | 2 +- layouts/partials/head/styles.html | 2 +- layouts/shortcodes/video.amp.html | 2 +- 12 files changed, 19 insertions(+), 13 deletions(-) diff --git a/.markdownlintrc b/.markdownlintrc index 4c40c643..e31b44ae 100644 --- a/.markdownlintrc +++ b/.markdownlintrc @@ -10,7 +10,7 @@ "no-blanks-blockquote": true, "no-empty-links": false, "no-hard-tabs": false, - "no-inline-html": { "allowed_elements": [ "span", "sup" ] }, + "no-inline-html": { "allowed_elements": [ "img", "span", "sup" ] }, "no-multiple-blanks": false, "no-trailing-punctuation": false, "single-h1": false, diff --git a/assets/sass/abstracts/_functions.scss b/assets/sass/abstracts/_functions.scss index ea5ed1ee..824a37f9 100644 --- a/assets/sass/abstracts/_functions.scss +++ b/assets/sass/abstracts/_functions.scss @@ -6,7 +6,7 @@ // Calculate lighter underline color compared to text color by // mix()'ing with background (#fff) to give the impression of // opacity but with MUCH better compatibility. - $color-opaque: mix($color, $color-background, $link-opacity); + $color-opaque: mix($color, $color-background, $link-underline-opacity); // Return non-gradient linear-gradient(): @return linear-gradient($color-opaque, $color-opaque); diff --git a/assets/sass/abstracts/_variables.scss b/assets/sass/abstracts/_variables.scss index b9f8f80f..c6098c07 100644 --- a/assets/sass/abstracts/_variables.scss +++ b/assets/sass/abstracts/_variables.scss @@ -14,10 +14,11 @@ $system-fonts: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", $system-fonts-emoji: "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol"; $system-fonts-monospace: "SFMono-Regular", "Consolas", "Liberation Mono", "Menlo", "Courier", monospace; +// stylelint-enable indentation // Misc Settings $responsive-width: 890px; -$link-opacity: 40%; +$link-underline-opacity: 40%; $link-underline-size: 2px; // Global Colors diff --git a/assets/sass/components/_wave.scss b/assets/sass/components/_wave.scss index 168e21ab..dfe78963 100644 --- a/assets/sass/components/_wave.scss +++ b/assets/sass/components/_wave.scss @@ -20,3 +20,4 @@ span.wave { 50% { transform: rotate( 0.0deg); } 100% { transform: rotate( 0.0deg); } } +// stylelint-enable indentation diff --git a/assets/sass/main.scss b/assets/sass/main.scss index 4b3d17b0..64a03cfe 100644 --- a/assets/sass/main.scss +++ b/assets/sass/main.scss @@ -1,5 +1,10 @@ @charset "UTF-8"; +// all variables set by Hugo's config.toml must go here +// stylelint-disable +$max-width: {{ printf "%d%s" .Site.Params.pageMaxWidth "px" }}; +// stylelint-enable + // Variables & Functions @import 'abstracts/variables'; @import 'abstracts/functions'; diff --git a/assets/sass/pages/_etc.scss b/assets/sass/pages/_etc.scss index e19c21c6..8ec6aff2 100644 --- a/assets/sass/pages/_etc.scss +++ b/assets/sass/pages/_etc.scss @@ -2,7 +2,7 @@ // Video Styles main#etc { - max-width: 910px; + max-width: $max-width; padding: 1.5em 2em; margin: 0 auto; diff --git a/assets/sass/pages/_single.scss b/assets/sass/pages/_single.scss index 0cbbcb56..52e79526 100644 --- a/assets/sass/pages/_single.scss +++ b/assets/sass/pages/_single.scss @@ -2,7 +2,7 @@ // Post Styles main#single { - max-width: 910px; + max-width: $max-width; padding: 1em 2em; margin: 0 auto; diff --git a/config.toml b/config.toml index 8889023d..55e3753d 100644 --- a/config.toml +++ b/config.toml @@ -2,8 +2,8 @@ baseURL = "https://jarv.is/" languageCode = "en-us" title = "Jake Jarvis" -# increase timeout for image processing -timeout = 120000 +# increase timeout for image processing (3 minutes) +timeout = 180000 canonifyURLs = true @@ -24,6 +24,7 @@ disableAliases = true [params] description = "Hi there! I'm a frontend web developer based in Boston, Massachusetts specializing in modern JavaScript frameworks and progressive web apps." domain = "jarv.is" + pageMaxWidth = 910 facebookAppID = "3357248167622283" gitRepo = "https://github.com/jakejarvis/jarv.is" defaultImage = "/me_large.jpg" @@ -66,7 +67,7 @@ disableAliases = true [[menu.main]] name = "Email" pre = "📬" - # encode my email address -- probably not effective but why not? + # encode my email address like it's 2005 ( ͡° ͜ʖ ͡°) url = "mailto:jake@jarv.is" weight = -70 diff --git a/content/notes/coronavirus-open-source/index.md b/content/notes/coronavirus-open-source/index.md index 183edfe9..9f6330ed 100644 --- a/content/notes/coronavirus-open-source/index.md +++ b/content/notes/coronavirus-open-source/index.md @@ -12,8 +12,6 @@ image: "covid19dashboards.png" draft: false --- - - {{< page-css >}} /* override link underlines */ h2 a { diff --git a/layouts/partials/functions/optimize-image.html b/layouts/partials/functions/optimize-image.html index 28ed32e1..2cfdaaf6 100644 --- a/layouts/partials/functions/optimize-image.html +++ b/layouts/partials/functions/optimize-image.html @@ -3,7 +3,7 @@ {{ $original := .Page.Resources.GetMatch (.Get "src") }} {{ .Scratch.Set "image" $original }} -{{ $setWidth := 910 }} +{{ $setWidth := .Site.Params.pageMaxWidth }} {{ if .Get "width" }} {{ $setWidth = (int (.Get "width")) }} diff --git a/layouts/partials/head/styles.html b/layouts/partials/head/styles.html index 3b99111f..5d80528b 100644 --- a/layouts/partials/head/styles.html +++ b/layouts/partials/head/styles.html @@ -1,2 +1,2 @@ -{{ $style := resources.Get "sass/main.scss" | resources.ToCSS (dict "targetPath" "style.css") | resources.PostCSS (dict "config" "postcss.config.js") }} +{{ $style := resources.Get "sass/main.scss" | resources.ExecuteAsTemplate "sass/main.scss" . | resources.ToCSS (dict "targetPath" "style.css") | resources.PostCSS (dict "config" "postcss.config.js") }} diff --git a/layouts/shortcodes/video.amp.html b/layouts/shortcodes/video.amp.html index a5fbf282..0c0f1439 100644 --- a/layouts/shortcodes/video.amp.html +++ b/layouts/shortcodes/video.amp.html @@ -1,6 +1,6 @@