From 934d5f1a7bf5b4f11491068ae509e2cba952cf97 Mon Sep 17 00:00:00 2001 From: steven-y-e Date: Wed, 29 Sep 2021 16:28:45 -0400 Subject: [PATCH 1/4] fix(theme): styles renamed featured header image class on article pages so that they're (somewhat) more distinct from article preview images on list pages --- blog/themes/mineral/layouts/_default/single.html | 2 +- blog/themes/mineral/static/css/mineral.css | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/blog/themes/mineral/layouts/_default/single.html b/blog/themes/mineral/layouts/_default/single.html index bca5238..66549f8 100644 --- a/blog/themes/mineral/layouts/_default/single.html +++ b/blog/themes/mineral/layouts/_default/single.html @@ -6,7 +6,7 @@ {{if isset .Params "image" }} - {{ .Title }} + {{ .Title }} {{ end }}
diff --git a/blog/themes/mineral/static/css/mineral.css b/blog/themes/mineral/static/css/mineral.css index 140889e..7794bf0 100644 --- a/blog/themes/mineral/static/css/mineral.css +++ b/blog/themes/mineral/static/css/mineral.css @@ -55,6 +55,6 @@ article p img { hyphens: auto; } -img.preview { +img.preview, img.heading { width: 100%; } -- 2.40.1 From fbc7ef18fa023b3e5d3b9093c7fa0de0442c06ef Mon Sep 17 00:00:00 2001 From: steven-y-e Date: Wed, 29 Sep 2021 16:49:52 -0400 Subject: [PATCH 2/4] style(root): one stray indent --- root/public/index.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/root/public/index.html b/root/public/index.html index 926c777..41a003d 100644 --- a/root/public/index.html +++ b/root/public/index.html @@ -1,6 +1,6 @@ - friends of mineral town + friends of mineral town -- 2.40.1 From a23f32927602fb49b82b6b75cb6a268efd2f01db Mon Sep 17 00:00:00 2001 From: steven-y-e Date: Sat, 2 Oct 2021 10:32:27 -0400 Subject: [PATCH 3/4] fix(styles): shrank header on larger views prevent line break/overflow on long words like "Professional" and "Birkenstock" on larger displays --- blog/themes/mineral/static/css/skeleton.css | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/blog/themes/mineral/static/css/skeleton.css b/blog/themes/mineral/static/css/skeleton.css index d24e310..ef8aac0 100644 --- a/blog/themes/mineral/static/css/skeleton.css +++ b/blog/themes/mineral/static/css/skeleton.css @@ -143,11 +143,11 @@ h6 { font-size: 1.4rem; line-height: 1.6; letter-spacing: 0; } /* Larger than phablet */ @media (min-width: 550px) { - h1 { font-size: 4.0rem; } - h2 { font-size: 3.2rem; } - h3 { font-size: 3.0rem; } - h4 { font-size: 2.8rem; } - h5 { font-size: 2.4rem; } + h1 { font-size: 3.2rem; } + h2 { font-size: 2.6rem; } + h3 { font-size: 2.4rem; } + h4 { font-size: 2.2rem; } + h5 { font-size: 2.0rem; } h6 { font-size: 1.5rem; } } -- 2.40.1 From 1b3086d3515d7266481f06c6e6e726d62a8eb529 Mon Sep 17 00:00:00 2001 From: steven-y-e Date: Sat, 2 Oct 2021 10:33:17 -0400 Subject: [PATCH 4/4] fix(theme): defined height on article thumbnails helps masonryjs work better --- .../themes/mineral/layouts/_default/list.html | 2 + blog/themes/mineral/static/css/mineral.css | 50 +++++++++++++++---- 2 files changed, 41 insertions(+), 11 deletions(-) diff --git a/blog/themes/mineral/layouts/_default/list.html b/blog/themes/mineral/layouts/_default/list.html index 0887495..9452d03 100644 --- a/blog/themes/mineral/layouts/_default/list.html +++ b/blog/themes/mineral/layouts/_default/list.html @@ -14,7 +14,9 @@

{{ .Title }}

{{if isset .Params "image" }} +
{{ .Title }} +
{{ end }} {{ if ne .Kind "term" }}

{{.Date.Format "January 2, 2006"}}

diff --git a/blog/themes/mineral/static/css/mineral.css b/blog/themes/mineral/static/css/mineral.css index 7794bf0..f76e44f 100644 --- a/blog/themes/mineral/static/css/mineral.css +++ b/blog/themes/mineral/static/css/mineral.css @@ -33,8 +33,35 @@ article p img { cursor: auto; } -/* hide some pagination links on tablet/mobile-width views */ +/* automatically hyphenate long words in summaries on list pages */ +.summary { + -webkit-hyphens: auto; + -ms-hyphens: auto; + hyphens: auto; +} + +img.heading { + width: 100%; +} + +div.preview { + width: 100%; + height: 12rem; + overflow: hidden; +} + +img.preview { + width: 100%; + height: 12rem; + object-fit: cover; + position: absolute; + left: 50%; + transform: translate(-50%, 0); +} + + @media (max-width: 420px) { + /* hide some pagination links on mobile-width views */ .mobile-hidden { display: none; } @@ -43,18 +70,19 @@ article p img { } } @media (max-width: 550px) { + /* hide some pagination links on tablet-width views */ .tablet-hidden { display: none; } + + /* enlarge article thumbnail on smaller views */ + div.preview { + height: 20rem; + } + + img.preview { + height: 20rem; + } + } -/* automatically hyphenate long words in summaries on list pages */ -.summary { - -webkit-hyphens: auto; - -ms-hyphens: auto; - hyphens: auto; -} - -img.preview, img.heading { - width: 100%; -} -- 2.40.1