diff --git a/assets/css/comments.css b/assets/css/comments.css new file mode 100644 index 0000000..8f01997 --- /dev/null +++ b/assets/css/comments.css @@ -0,0 +1,121 @@ +/* Isso styling */ +h4.isso-thread-heading { + color: var(--text-0); + margin-bottom: 8px; +} + +.isso-comment:not(:first-of-type), +.isso-follow-up .isso-comment { + border-color: var(--background-3); +} + +.isso-author, +.isso-page-author-suffix, +.isso-comment-footer, +.isso-comment-footer .isso-votes { + color: var(--text-gray-0); +} + +.isso-comment-header .isso-spacer, +.isso-spacer:hover, +.isso-permalink, +.isso-permalink:hover { + color: var(--text-gray-1) !important; +} +a.isso-author:hover, +.isso-permalink:hover { + text-decoration: underline !important; +} + +.isso-comment.isso-is-page-author > .isso-text-wrapper { + background-color: var(--background-accent-1); +} + +.isso-feedlink:hover, +.isso-reply { + color: var(--link-0) !important; + text-shadow: unset !important; +} +.isso-reply:hover { + text-decoration: underline; +} + +.isso-text pre, +.isso-text :not(pre) > code { + background-color: var(--background-2); + border: none; + padding: 2px 4px; + border-radius: 5px; + /* thanks isso.css for setting this to 85% for whatever reason */ + font-size: 0.75em; +} + +.isso-input-wrapper input, +.isso-post-action > input, +.isso-textarea, +.isso-preview { + color: var(--text-1); + background-color: var(--background-1); + border-color: var(--background-2) !important; +} + +.isso-input-wrapper input:focus, +.isso-textarea:focus { + border-color: var(--background-3) !important; +} + +.isso-post-action > input:hover { + background-color: var(--background-2); +} +.isso-post-action > input:focus, +.isso-post-action > input:active { + background-color: var(--background-3); +} + +.isso-textarea { + margin-bottom: 4px; +} +.isso-input-wrapper { + display: inline-flex; + flex-direction: column; + margin-right: 4px; + max-width: 25%; +} +.isso-input-wrapper input { + order: 1; +} +.isso-input-wrapper label { + order: 2; + font-size: small; +} +.isso-post-action { + margin-left: 4px; + margin-top: 0; +} +@media screen and (max-width: 600px) { + .isso-input-wrapper { + display: block; + max-width: 100%; + } +} + +@media print { + .comments { + break-before: always; + } + .isso-comment { + max-width: unset; + } + .isso-text-wrapper { + break-inside: avoid; + } + + .isso-postbox, + .isso-feedlink { + display: none; + } +} + +.isso-target { + animation: target-fade 10s ease-out; /* defined in bobatheme */ +} diff --git a/assets/css/search.css b/assets/css/search.css new file mode 100644 index 0000000..0fc0880 --- /dev/null +++ b/assets/css/search.css @@ -0,0 +1,9 @@ +/* put on body so it overrides the defaults set in :root by pagefind.css */ +body { + /* https://pagefind.app/docs/ui-usage/#customising-the-styles */ + --pagefind-ui-background: var(--background-1); + --pagefind-ui-border: var(--background-2); + --pagefind-ui-primary: var(--link-0); + --pagefind-ui-tag: var(--background-1); + --pagefind-ui-text: var(--text-1); +} diff --git a/assets/js/share-event.js b/assets/js/share-event.js new file mode 100644 index 0000000..38acef8 --- /dev/null +++ b/assets/js/share-event.js @@ -0,0 +1,3 @@ +function share_event(service) { + plausible("Share", {props: {Network: service}}); +} diff --git a/layouts/_partials/comments.html b/layouts/_partials/comments.html index 2b20747..99a3bf0 100644 --- a/layouts/_partials/comments.html +++ b/layouts/_partials/comments.html @@ -1,4 +1,56 @@ -{{/* - Create a file named `layouts/partials/comments.html` at your site root to - add a comment system. Page variables are passed. -*/}} +{{ with resources.Get "css/comments.css" | fingerprint "sha512" }} + +{{ end }} + +
+ If you provide an email address, you can enable notifications for + replies to your comment. It will not be shown publicly. +
+ + + +{{ $url := .Permalink }} +{{ if .IsTranslated }} + {{ with index .AllTranslations 0 }} + {{ $url = .Permalink }} + {{ end }} +{{ end }} + + + + + diff --git a/layouts/_partials/head.html b/layouts/_partials/head.html index 456c5b1..06b7049 100644 --- a/layouts/_partials/head.html +++ b/layouts/_partials/head.html @@ -16,6 +16,27 @@ {{ with resources.Get "js/bobatheme.js" | fingerprint "sha512" }} {{ end }} + {{ if not hugo.IsServer }} + + + {{ with resources.Get "js/share-event.js" | fingerprint "sha512" }} + + {{ end }} + {{ end }} + + {{ if eq .Layout "search" }} + {{ with resources.Get "css/search.css" | fingerprint "sha512" }} + + {{ end }} + + + + + {{ end }} {{ with .Site.Params.faviconSVG }} @@ -26,6 +47,10 @@