From f97270c33147199c15718f4b58b68541b824d56a Mon Sep 17 00:00:00 2001 From: "C. Lente" <7017340+clente@users.noreply.github.com> Date: Tue, 25 Apr 2023 17:57:50 -0300 Subject: Add Herman style --- assets/herman.css | 180 +++++++++++++++++++++++++++++++++++++++++++ layouts/_default/baseof.html | 2 +- layouts/_default/single.html | 2 +- 3 files changed, 182 insertions(+), 2 deletions(-) create mode 100644 assets/herman.css diff --git a/assets/herman.css b/assets/herman.css new file mode 100644 index 0000000..509af4a --- /dev/null +++ b/assets/herman.css @@ -0,0 +1,180 @@ +:root { + --color-dark: hsl(228, 15%, 11%); /* 1a1a1a */ + --color-light: #fafafa; + --color-primary: #1a8fe3; + --spacing: 1.5rem; +} + +body { + background: var(--color-dark); + color: var(--color-light); + padding: 2.5rem; + font-family: Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, 'URW Gothic', + source-sans-pro, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", + "Segoe UI Symbol", "Noto Color Emoji"; + font-size: 1.2rem; + line-height: 1.4; + min-height: 100vh; + max-width: 1600px; + margin: 0 auto; + word-wrap: break-word; +} + +header, +main, +footer { + max-width: 70ch; + margin-inline: auto; +} + +header { + padding-bottom: var(--spacing); +} + +nav a, a.blog-tags { + margin-right: calc(var(--spacing) / 3); +} +a.blog-tags { + line-height: 1.8; +} + +main { + padding-bottom: var(--spacing); +} + +footer { + text-align: center; + padding-top: var(--spacing); +} + +a { + color: currentColor; + text-decoration-color: var(--color-primary); + text-decoration-thickness: 0.3ex; + text-underline-offset: 0.3ex; +} + +a:hover { + text-decoration-thickness: 0.4ex; +} + +img { + display: block; + max-width: 100%; + height: auto; +} + +h1, +h2, +h3, +h4, +h5 { + font-weight: 700; + line-height: 1.3; +} + +h1 { + font-size: 3.55rem; +} +h2 { + font-size: 2.66rem; +} +h3 { + font-size: 2rem; +} +h4 { + font-size: 1.5rem; +} +h5 { + font-size: 1.13rem; +} + +ul, +ol { + padding-inline-start: var(--spacing); +} +li { + margin-block-start: var(--spacing); +} + +blockquote { + padding-inline-start: var(--spacing); + border-inline-start: 0.2em solid; + font-style: italic; +} + +:is(h1, h2, h3, h4, h5, blockquote) { + margin-block-end: calc(var(--spacing) / 2); +} +:is(h1, h2, h3, h4, h5) + * { + margin-block-start: calc(var(--spacing) / 3); +} +:is(h1, h2, h3, h4, h5) + :where(h2, h3, h4, h5) { + margin-block-start: calc(var(--spacing) * 2); +} + +blockquote { + max-width: 50ch; +} + +.title { + text-decoration: none; +} +.title h1 { + font-size: 2rem; + margin-top: calc(var(--spacing) / 2); +} + +ul.blog-posts { + list-style-type: none; + padding: unset; +} +ul.blog-posts li { + display: flex; + flex-direction: column; +} +@media screen and (min-width: 600px) { + ul.blog-posts li { + flex-direction: row; + gap: calc(var(--spacing) / 2); + } +} +ul.blog-posts li span { + min-width: 11ch; +} +time { + opacity: 0.5; + font-style: normal; +} + +code { + padding: 1px calc(var(--spacing) / 4); + color: #f8f8f2; + background-color: #282a36; + font-size: 1rem; +} + +pre code { + display: block; + padding: calc(var(--spacing) / 2); + white-space: pre-wrap; + overflow-x: auto; +} + +table { + width: 100%; +} +table, +th, +td { + border: 1px solid; + border-collapse: collapse; + border-color: var(--color-light); + padding: calc(var(--spacing) / 2); +} + +.disabled { + color: currentColor; + cursor: not-allowed; + opacity: 0.5; +} diff --git a/layouts/_default/baseof.html b/layouts/_default/baseof.html index 7aa0605..0b0cdff 100644 --- a/layouts/_default/baseof.html +++ b/layouts/_default/baseof.html @@ -11,7 +11,7 @@ {{- partial "seo_tags.html" . -}} - {{ $style := resources.Get "style.css" | minify }} + {{ $style := resources.Get "herman.css" | minify }} {{ $syntax := resources.Get "syntax.css" | minify }} diff --git a/layouts/_default/single.html b/layouts/_default/single.html index cd6b095..6c6ee69 100644 --- a/layouts/_default/single.html +++ b/layouts/_default/single.html @@ -14,7 +14,7 @@

{{ range (.GetTerms "tags") }} - #{{ .LinkTitle }}   + #{{ .LinkTitle }} {{ end }}

{{ end }} -- cgit v1.2.3 From 69ff6b3e176edd238055d52f26511bf77cedbbdb Mon Sep 17 00:00:00 2001 From: "C. Lente" <7017340+clente@users.noreply.github.com> Date: Wed, 26 Apr 2023 00:28:32 -0300 Subject: Dial down comment color --- assets/syntax.css | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/assets/syntax.css b/assets/syntax.css index 5f15788..a28d967 100644 --- a/assets/syntax.css +++ b/assets/syntax.css @@ -69,11 +69,11 @@ /* Operator */ .chroma .o { color: #ff79c6 } /* OperatorWord */ .chroma .ow { color: #ff79c6 } /* Punctuation .chroma .p { } */ -/* Comment */ .chroma .c { color: #7c90d0 } -/* CommentHashbang */ .chroma .ch { color: #7c90d0 } -/* CommentMultiline */ .chroma .cm { color: #7c90d0 } -/* CommentSingle */ .chroma .c1 { color: #7c90d0 } -/* CommentSpecial */ .chroma .cs { color: #7c90d0 } +/* Comment */ .chroma .c { color: #8491b8 } +/* CommentHashbang */ .chroma .ch { color: #8491b8 } +/* CommentMultiline */ .chroma .cm { color: #8491b8 } +/* CommentSingle */ .chroma .c1 { color: #8491b8 } +/* CommentSpecial */ .chroma .cs { color: #8491b8 } /* CommentPreproc */ .chroma .cp { color: #ff79c6 } /* CommentPreprocFile */ .chroma .cpf { color: #ff79c6 } /* Generic .chroma .g { } */ -- cgit v1.2.3 From be1cbcc552b76f0e2e57933339c69f5ea473f1cb Mon Sep 17 00:00:00 2001 From: "C. Lente" <7017340+clente@users.noreply.github.com> Date: Wed, 26 Apr 2023 00:29:04 -0300 Subject: Tweaks for herman.css on mobile --- assets/herman.css | 66 ++++++++++++++++++++++++++++++------------------------- 1 file changed, 36 insertions(+), 30 deletions(-) diff --git a/assets/herman.css b/assets/herman.css index 509af4a..cf54dd2 100644 --- a/assets/herman.css +++ b/assets/herman.css @@ -1,20 +1,22 @@ :root { - --color-dark: hsl(228, 15%, 11%); /* 1a1a1a */ + font-size: 62.5%; /* 10px */ + --color-dark: #181a20; /* 1a1a1a */ --color-light: #fafafa; --color-primary: #1a8fe3; - --spacing: 1.5rem; + --size: 1rem; + --spacing: calc(var(--size) * 2.4); } body { background: var(--color-dark); color: var(--color-light); - padding: 2.5rem; + padding: 4rem; font-family: Avenir, 'Avenir Next LT Pro', Montserrat, Corbel, 'URW Gothic', source-sans-pro, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"; - font-size: 1.2rem; - line-height: 1.4; - min-height: 100vh; + font-size: calc(var(--size) * 1.8); + line-height: 1.5; + min-height: 80vh; max-width: 1600px; margin: 0 auto; word-wrap: break-word; @@ -32,10 +34,10 @@ header { } nav a, a.blog-tags { - margin-right: calc(var(--spacing) / 3); + margin-right: calc(var(--spacing) / 2); } a.blog-tags { - line-height: 1.8; + line-height: 2; } main { @@ -74,19 +76,19 @@ h5 { } h1 { - font-size: 3.55rem; + font-size: calc(var(--size) * 5.7); } h2 { - font-size: 2.66rem; + font-size: calc(var(--size) * 4.3); } h3 { - font-size: 2rem; + font-size: calc(var(--size) * 3.2); } h4 { - font-size: 1.5rem; + font-size: calc(var(--size) * 2.4); } h5 { - font-size: 1.13rem; + font-size: calc(var(--size) * 1.8); } ul, @@ -101,6 +103,7 @@ blockquote { padding-inline-start: var(--spacing); border-inline-start: 0.2em solid; font-style: italic; + max-width: 50ch; } :is(h1, h2, h3, h4, h5, blockquote) { @@ -113,15 +116,11 @@ blockquote { margin-block-start: calc(var(--spacing) * 2); } -blockquote { - max-width: 50ch; -} - .title { text-decoration: none; } .title h1 { - font-size: 2rem; + font-size: calc(var(--size) * 3.2); margin-top: calc(var(--spacing) / 2); } @@ -133,31 +132,25 @@ ul.blog-posts li { display: flex; flex-direction: column; } -@media screen and (min-width: 600px) { - ul.blog-posts li { - flex-direction: row; - gap: calc(var(--spacing) / 2); - } -} ul.blog-posts li span { min-width: 11ch; } + time { opacity: 0.5; font-style: normal; } code { - padding: 1px calc(var(--spacing) / 4); - color: #f8f8f2; + font-family: ui-monospace, 'Cascadia Code', 'Source Code Pro', + Menlo, Consolas, 'DejaVu Sans Mono', monospace; + padding: 2px calc(var(--spacing) / 4); background-color: #282a36; - font-size: 1rem; + font-size: calc(var(--size) * 1.4); } - pre code { display: block; - padding: calc(var(--spacing) / 2); - white-space: pre-wrap; + padding: var(--spacing); overflow-x: auto; } @@ -178,3 +171,16 @@ td { cursor: not-allowed; opacity: 0.5; } + +@media screen and (min-width: 600px) { + ul.blog-posts li { + flex-direction: row; + gap: calc(var(--spacing) / 2); + } +} + +@media screen and (max-width: 600px) { + :root { + --size: 0.9rem; + } +} -- cgit v1.2.3 From 603876b88d754a10cdbcf11b18c4fcc4dc0aaa91 Mon Sep 17 00:00:00 2001 From: "C. Lente" <7017340+clente@users.noreply.github.com> Date: Thu, 27 Apr 2023 11:55:52 -0300 Subject: Adjust heading sizes --- assets/herman.css | 26 ++++++++------------------ layouts/_default/list.html | 2 +- 2 files changed, 9 insertions(+), 19 deletions(-) diff --git a/assets/herman.css b/assets/herman.css index cf54dd2..1eae1f3 100644 --- a/assets/herman.css +++ b/assets/herman.css @@ -69,25 +69,21 @@ img { h1, h2, h3, -h4, -h5 { +h4 { font-weight: 700; line-height: 1.3; } h1 { - font-size: calc(var(--size) * 5.7); + font-size: calc(var(--size) * 4.2); } h2 { - font-size: calc(var(--size) * 4.3); + font-size: calc(var(--size) * 3.4); } h3 { - font-size: calc(var(--size) * 3.2); + font-size: calc(var(--size) * 2.6); } h4 { - font-size: calc(var(--size) * 2.4); -} -h5 { font-size: calc(var(--size) * 1.8); } @@ -106,13 +102,13 @@ blockquote { max-width: 50ch; } -:is(h1, h2, h3, h4, h5, blockquote) { +:is(h1, h2, h3, h4, blockquote) { margin-block-end: calc(var(--spacing) / 2); } -:is(h1, h2, h3, h4, h5) + * { +:is(h1, h2, h3, h4) + * { margin-block-start: calc(var(--spacing) / 3); } -:is(h1, h2, h3, h4, h5) + :where(h2, h3, h4, h5) { +:is(h1, h2, h3, h4) + :where(h2, h3, h4) { margin-block-start: calc(var(--spacing) * 2); } @@ -120,7 +116,7 @@ blockquote { text-decoration: none; } .title h1 { - font-size: calc(var(--size) * 3.2); + font-size: calc(var(--size) * 3.4); margin-top: calc(var(--spacing) / 2); } @@ -178,9 +174,3 @@ td { gap: calc(var(--spacing) / 2); } } - -@media screen and (max-width: 600px) { - :root { - --size: 0.9rem; - } -} diff --git a/layouts/_default/list.html b/layouts/_default/list.html index c251837..0bfe2ec 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -28,7 +28,7 @@ {{ if not .Data.Singular }}
{{ range .Site.Taxonomies.tags }} - #{{ .Page.Title }}   + #{{ .Page.Title }} {{ end }}
{{ end }} -- cgit v1.2.3 From 2419e25e73f60be3c18893df06ad61ed928bf277 Mon Sep 17 00:00:00 2001 From: "C. Lente" <7017340+clente@users.noreply.github.com> Date: Thu, 27 Apr 2023 12:25:09 -0300 Subject: Update social cards --- assets/herman.css | 2 +- assets/images/social_card_bg.png | Bin 651110 -> 6698 bytes assets/images/social_card_fg.png | Bin 367423 -> 4656 bytes assets/style.css | 147 -------------------------------------- layouts/partials/social_card.html | 4 +- 5 files changed, 3 insertions(+), 150 deletions(-) delete mode 100644 assets/style.css diff --git a/assets/herman.css b/assets/herman.css index 1eae1f3..b80a9d8 100644 --- a/assets/herman.css +++ b/assets/herman.css @@ -1,6 +1,6 @@ :root { font-size: 62.5%; /* 10px */ - --color-dark: #181a20; /* 1a1a1a */ + --color-dark: #181a20; --color-light: #fafafa; --color-primary: #1a8fe3; --size: 1rem; diff --git a/assets/images/social_card_bg.png b/assets/images/social_card_bg.png index ad1d528..857ea63 100644 Binary files a/assets/images/social_card_bg.png and b/assets/images/social_card_bg.png differ diff --git a/assets/images/social_card_fg.png b/assets/images/social_card_fg.png index 01b207c..e005b0a 100644 Binary files a/assets/images/social_card_fg.png and b/assets/images/social_card_fg.png differ diff --git a/assets/style.css b/assets/style.css deleted file mode 100644 index 3b90566..0000000 --- a/assets/style.css +++ /dev/null @@ -1,147 +0,0 @@ -body { - font-family: Verdana, sans-serif; - margin: auto; - padding: 20px; - max-width: 720px; - text-align: left; - background-color: #1d1f27; - word-wrap: break-word; - overflow-wrap: break-word; - line-height: 1.5; - color: #c9d1d9; -} - -h1, -h2, -h3, -h4, -h5, -h6, -strong, -b { - color: #eee; -} - -a { - color: #8cc2dd; -} - -.title { - text-decoration: none; - border: 0; -} -.title h1 { - font-size: 24px; - margin: 19.92px 0 19.92px 0; -} - -.title span { - font-weight: 400; -} - -nav a { - margin-right: 10px; -} - -textarea { - background-color: #252525; - color: #ddd; - width: 100%; - font-size: 16px; -} - -input { - background-color: #252525; - color: #ddd; - font-size: 16px; -} - -content { - line-height: 1.6; -} - -table { - width: 100%; -} - -table, -th, -td { - border: 1px solid; - border-collapse: collapse; - border-color: #c9d1d9; - padding: 5px; -} - -img { - max-width: 100%; -} - -code { - padding: 2px 5px; - color: #f8f8f2; - background-color: #282a36; -} - -pre code { - display: block; - padding: 20px; - white-space: pre-wrap; - font-size: 14px; - overflow-x: auto; -} - -blockquote { - border-left: 1px solid #999; - color: #ccc; - padding-left: 20px; - font-style: italic; -} - -footer { - padding: 25px; - text-align: center; -} - -.helptext { - color: #aaa; - font-size: small; -} - -.errorlist { - color: #eba613; - font-size: small; -} - -/* blog posts */ -ul.blog-posts { - list-style-type: none; - padding: unset; -} - -ul.blog-posts li { - display: flex; - margin-bottom: 10px; -} - -ul.blog-posts li span { - flex: 0 0 130px; -} - -ul.blog-posts li a:visited { - color: #8b6fcb; -} - -a.blog-tags { - line-height: 2; -} - -h3.blog-filter { - margin-bottom: 0; -} - -.disabled { - color: currentColor; - cursor: not-allowed; - opacity: 0.7; -} diff --git a/layouts/partials/social_card.html b/layouts/partials/social_card.html index 8bf397f..97f08c3 100644 --- a/layouts/partials/social_card.html +++ b/layouts/partials/social_card.html @@ -5,7 +5,7 @@ {{ $fg = $fg.Filter (images.Text .Title (dict "font" $font - "color" "#f8f8f2" + "color" "#fafafa" "size" 130 "linespacing" 20 "x" 0 @@ -18,7 +18,7 @@ {{ $fg = $fg.Filter (images.Text $byline (dict "font" $font - "color" "#c9d1d9" + "color" "#898a8d" "size" 60 "linespacing" 30 "x" 0 -- cgit v1.2.3 From d5bf66d0715e620aeca1b748ae8612721e0b67bd Mon Sep 17 00:00:00 2001 From: "C. Lente" <7017340+clente@users.noreply.github.com> Date: Mon, 8 May 2023 14:20:04 -0300 Subject: Fix font-size on mobile --- assets/herman.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/assets/herman.css b/assets/herman.css index b80a9d8..a61d6c9 100644 --- a/assets/herman.css +++ b/assets/herman.css @@ -148,6 +148,8 @@ pre code { display: block; padding: var(--spacing); overflow-x: auto; + -webkit-text-size-adjust: 100%; + -moz-text-size-adjust: 100%; } table { -- cgit v1.2.3 From 8bafe5a7ae99729c8df7ed333212a74491e56814 Mon Sep 17 00:00:00 2001 From: Caio Lente <7017340+clente@users.noreply.github.com> Date: Fri, 29 Sep 2023 21:00:14 -0300 Subject: Ignore todo --- .gitignore | 3 ++- 1 file changed, 2 insertions(+), 1 deletion(-) diff --git a/.gitignore b/.gitignore index 6274ee4..305d231 100644 --- a/.gitignore +++ b/.gitignore @@ -1,3 +1,4 @@ .hugo_build.lock .DS_Store -resources/ \ No newline at end of file +resources/ +todo.md \ No newline at end of file -- cgit v1.2.3 From 591f62e5233a9fe0e158ab8cbe72ab25815474a0 Mon Sep 17 00:00:00 2001 From: Caio Lente <7017340+clente@users.noreply.github.com> Date: Mon, 16 Oct 2023 22:44:59 -0300 Subject: Bring updates from main --- layouts/partials/footer.html | 2 +- layouts/partials/nav.html | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/layouts/partials/footer.html b/layouts/partials/footer.html index dca6c23..9290715 100644 --- a/layouts/partials/footer.html +++ b/layouts/partials/footer.html @@ -1,3 +1,3 @@ - {{ .Site.Copyright }} | {{ markdownify .Site.Language.Params.params.madeWith }} + {{ .Site.Copyright }} | {{ markdownify .Site.Params.madeWith }} \ No newline at end of file diff --git a/layouts/partials/nav.html b/layouts/partials/nav.html index 3f1a416..5ee4552 100644 --- a/layouts/partials/nav.html +++ b/layouts/partials/nav.html @@ -4,7 +4,7 @@ {{ with .Site.Social.email }} Email {{ end }} -RSS +RSS {{ $translations := dict }} -- cgit v1.2.3 From 15f8ac86325dcb4e37cdfd38121a8a0380d68624 Mon Sep 17 00:00:00 2001 From: Caio Lente <7017340+clente@users.noreply.github.com> Date: Mon, 16 Oct 2023 23:45:47 -0300 Subject: Suggest render: false in adition to link: url --- README.md | 5 ++++- 1 file changed, 4 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index 85c662c..7cfc801 100644 --- a/README.md +++ b/README.md @@ -102,7 +102,10 @@ already implemented: - Static content: you can create empty blog entries that act as links to static files by including `link: "{url}"` in a post's [front - matter](https://gohugo.io/content-management/front-matter/). + matter](https://gohugo.io/content-management/front-matter/). You can also add + `render: false` to your [build + options](https://gohugo.io/content-management/build-options/#readout) to avoid + rendering a blank post. - Single-use CSS (EXPERIMENTAL): you can add some styles to a single page by writing the CSS you need in `assets/{custom_css}.css` and then including `style: "{custom_css}.css"` in the [front -- cgit v1.2.3 From f991890cc202aac9d00578c9fa3d6004e9f9ece0 Mon Sep 17 00:00:00 2001 From: Caio Lente <7017340+clente@users.noreply.github.com> Date: Mon, 16 Oct 2023 23:46:00 -0300 Subject: Add icon idicating external posts --- layouts/_default/list.html | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/layouts/_default/list.html b/layouts/_default/list.html index 0bfe2ec..3813bd0 100644 --- a/layouts/_default/list.html +++ b/layouts/_default/list.html @@ -14,7 +14,7 @@ {{ if .Params.link }} - {{ .Title }} + {{ .Title }} ↪ {{ else }} {{ .Title }} {{ end }} -- cgit v1.2.3 From 7f9bae2d9d6436e3f90b2d9d8d21de896b34716b Mon Sep 17 00:00:00 2001 From: Caio Lente <7017340+clente@users.noreply.github.com> Date: Thu, 4 Jan 2024 23:24:51 -0300 Subject: New absfigure shortcode --- README.md | 2 ++ layouts/shortcodes/absfigure.html | 29 +++++++++++++++++++++++++++++ 2 files changed, 31 insertions(+) create mode 100644 layouts/shortcodes/absfigure.html diff --git a/README.md b/README.md index 0636c04..2704d2a 100644 --- a/README.md +++ b/README.md @@ -115,6 +115,8 @@ already implemented: - Reply by email: if you supply an email address, the theme creates a "Reply to this post by email" button at the end of every post (see Kev Quirk's [original implementation](https://kevquirk.com/adding-the-post-title-to-my-reply-by-email-button)). +- `absfigure` shortcode: a shortcut to use the `figure` shortcode that also + converts relative URLs into absolute URLs by using the `absURL` function. - Single-use CSS (EXPERIMENTAL): you can add some styles to a single page by writing the CSS you need in `assets/{custom_css}.css` and then including `style: "{custom_css}.css"` in the [front diff --git a/layouts/shortcodes/absfigure.html b/layouts/shortcodes/absfigure.html new file mode 100644 index 0000000..ad60c6c --- /dev/null +++ b/layouts/shortcodes/absfigure.html @@ -0,0 +1,29 @@ + + {{- if .Get "link" -}} + + {{- end -}} + {{ with .Get + {{- if .Get "link" }}{{ end -}} + {{- if or (or (.Get "title") (.Get "caption")) (.Get "attr") -}} +
+ {{ with (.Get "title") -}} +

{{ . }}

+ {{- end -}} + {{- if or (.Get "caption") (.Get "attr") -}}

+ {{- .Get "caption" | markdownify -}} + {{- with .Get "attrlink" }} + + {{- end -}} + {{- .Get "attr" | markdownify -}} + {{- if .Get "attrlink" }}{{ end }}

+ {{- end }} +
+ {{- end }} + \ No newline at end of file -- cgit v1.2.3 From 58693036cfc0f9307c5ed9fdb381266cbbb57cae Mon Sep 17 00:00:00 2001 From: Caio Lente <7017340+clente@users.noreply.github.com> Date: Tue, 6 Feb 2024 13:39:01 -0300 Subject: Typo on docs --- README.md | 2 +- exampleSite/config.toml | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/README.md b/README.md index 2704d2a..730302d 100644 --- a/README.md +++ b/README.md @@ -206,7 +206,7 @@ enableRobotsTXT = true # (EXPERIMENTAL) This theme is capable of dynamically generating social cards # for posts that don't have `images` defined in their front matter; By setting # `generateSocialCard` to false, you can prevent this behavior. For more - # information see layouts/partials/seo_tags.html + # information see layouts/partials/social_card.html generateSocialCard = true # Social media. Delete any item you aren't using to make sure it won't show up diff --git a/exampleSite/config.toml b/exampleSite/config.toml index 6fe641f..3c8b0d0 100644 --- a/exampleSite/config.toml +++ b/exampleSite/config.toml @@ -66,7 +66,7 @@ enableRobotsTXT = true # (EXPERIMENTAL) This theme is capable of dynamically generating social cards # for posts that don't have `images` defined in their front matter; By setting # `generateSocialCard` to false, you can prevent this behavior. For more - # information see layouts/partials/seo_tags.html + # information see layouts/partials/social_card.html generateSocialCard = true # Social media. Delete any item you aren't using to make sure it won't show up -- cgit v1.2.3 From 116e87f7d0f0983da1530ddb8831c070d3b147f5 Mon Sep 17 00:00:00 2001 From: Caio Lente <7017340+clente@users.noreply.github.com> Date: Tue, 6 Feb 2024 13:55:31 -0300 Subject: Heuristic for reducing font size on social cards with long titles --- layouts/partials/social_card.html | 15 +++++++++++++-- 1 file changed, 13 insertions(+), 2 deletions(-) diff --git a/layouts/partials/social_card.html b/layouts/partials/social_card.html index 6faacc0..d171da0 100644 --- a/layouts/partials/social_card.html +++ b/layouts/partials/social_card.html @@ -3,14 +3,25 @@ {{ $fg := resources.Get "images/social_card_fg.png"}} {{ $bg := resources.Get "images/social_card_bg.png"}} -{{ $fg = $fg.Filter (images.Text .Title (dict +{{ if gt (len .Title) 45 }} + {{ $fg = $fg.Filter (images.Text .Title (dict + "font" $font + "color" "#fafafa" + "size" 95 + "linespacing" 16 + "x" 0 + "y" 0 + )) }} +{{ else }} + {{ $fg = $fg.Filter (images.Text .Title (dict "font" $font "color" "#fafafa" "size" 130 "linespacing" 20 "x" 0 "y" 0 -)) }} + )) }} +{{ end }} {{ $date := .Date.Format (default "2006-01-02" .Site.Params.dateFormat) }} {{ $author := (default $.Site.Params.author.name ($.Param "author") ) }} -- cgit v1.2.3