From 84f3301f1c6e49db33403ea6de3d6bf4d6bd7dcb Mon Sep 17 00:00:00 2001 From: Jeremiah Russell Date: Mon, 10 Feb 2025 17:47:56 +0000 Subject: [PATCH 01/10] =?UTF-8?q?=E2=9C=A8=20feat(webmentions):=20add=20we?= =?UTF-8?q?bmentions=20support=20templates?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - create webmentions partial template for page head integration - add webmentions shortcode template to position webmentions on the page --- templates/partials/webmentions.html | 70 +++++++++++++++++++++++++++ templates/shortcodes/webmentions.html | 8 +++ 2 files changed, 78 insertions(+) create mode 100644 templates/partials/webmentions.html create mode 100644 templates/shortcodes/webmentions.html diff --git a/templates/partials/webmentions.html b/templates/partials/webmentions.html new file mode 100644 index 0000000..453ee76 --- /dev/null +++ b/templates/partials/webmentions.html @@ -0,0 +1,70 @@ +{# Incorporate webmention.io links and script into the page head. +1. Provide the link to the webmention data in the at webmention.io. +2. Link to the stylesheet for styling webmentions on a page. +3. Add and configure the javascript to fetch and display the webmentions collected at webmention.io. #} + + + + +{# Calculate the configured data for the script, if any #} + +{% set script_data = "" %} + +{% if config.extra.webmentions.id %} + {% set script_data = script_data ~ "data-id=" ~ config.extra.webmentions.id %} +{% endif %} + +{% if config.extra.webmentions.page_url %} + {% set script_data = script_data ~ " data-page-url=" ~ config.extra.webmentions.page_url %} +{% endif %} + +{% if config.extra.webmentions.add_urls %} + {% set script_data = script_data ~ "data-add-urls=" ~ config.extra.webmentions.add_urls %} +{% endif %} + +{% if config.extra.webmentions.wordcount %} + {% set script_data = script_data ~ " data-wordcount=" ~ config.extra.webmentions.wordcount %} +{% endif %} + +{% if config.extra.webmentions.max_webmentions %} + {% set script_data = script_data ~ "data-max-webmentions=" ~ config.extra.webmentions.max_webmentions %} +{% endif %} + +{% if config.extra.webmentions.prevent_spoofing %} + {% set script_data = script_data ~ "data-prevent-spoofing=" ~ config.extra.webmentions.prevent_spoofing %} +{% endif %} + +{% if config.extra.webmentions.sort_by %} + {% set script_data = script_data ~ "data-sort-by=" ~ config.extra.webmentions.sort_by %} +{% endif %} + +{% if config.extra.webmentions.sort_dir %} + {% set script_data = script_data ~ "data-sort-dir=" ~ config.extra.webmentions.sort_dir %} +{% endif %} + +{% if config.extra.webmentions.comments_are_reactions %} + {% set script_data = script_data ~ " data-comments-are-reactions=" ~ config.extra.webmentions.comments_are_reactions %} +{% endif %} + + + +{# + + +#} \ No newline at end of file diff --git a/templates/shortcodes/webmentions.html b/templates/shortcodes/webmentions.html new file mode 100644 index 0000000..33986fb --- /dev/null +++ b/templates/shortcodes/webmentions.html @@ -0,0 +1,8 @@ +{%- set format = config.extra.webmentions.format | default(value="") -%} +{% if format == "" %} +{%- set dash = "" -%} +{% else %} +{%- set dash = "-" -%} +{% endif %} + +
hello
\ No newline at end of file From cab76ee50701c9019acf7dfabdf2604f81409f98 Mon Sep 17 00:00:00 2001 From: Jeremiah Russell Date: Tue, 11 Feb 2025 06:32:11 +0000 Subject: [PATCH 02/10] =?UTF-8?q?=E2=9C=A8=20feat(config):=20add=20webment?= =?UTF-8?q?ion=20support?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - introduce webmention.io configuration for enhanced comment integration - add connect-src directive for webmention.io to CSP policy --- config.toml | 42 ++++++++++++++++++++++++++++++++++++++++++ theme.toml | 42 ++++++++++++++++++++++++++++++++++++++++++ 2 files changed, 84 insertions(+) diff --git a/config.toml b/config.toml index 4e73800..533c1c0 100644 --- a/config.toml +++ b/config.toml @@ -328,6 +328,7 @@ allowed_domains = [ { directive = "script-src", domains = ["'self'"] }, { directive = "style-src", domains = ["'self'"] }, { directive = "frame-src", domains = ["player.vimeo.com", "https://www.youtube-nocookie.com"] }, +# { directive = "connect-src", domains = [ "https://webmention.io"] }, ] # Enable the CSP directives configured (or default). @@ -363,6 +364,47 @@ service = "goatcounter" # Leave this field empty if you're using the service's default hosting. self_hosted_url = "https://tabi-stats.osc.garden" +[extra.webmentions] +# enable = true +# Specify the domain registered with webmention.io. +# domain = "www.example.com" + +# The HTML ID for the object to fill in with the webmention data. +# Defaults to "webmentions" +# id = "webmentions" + +# data configuration for the webmention.min.js script +# The base URL to use for this page. Defaults to window.location +page_url = "https://beesbuzz.biz/code/439-Falsehoods-programmers-believe-about-email" + +# Additional URLs to check, separated by |s +# add_urls + +# The maximum number of words to render in reply mentions. +# wordcount = 20 + +# The maximum number of mentions to retrieve. Defaults to 30. +# max_webmentions + +# By default, Webmentions render using the mf2 'url' element, which plays +# nicely with webmention bridges (such as brid.gy and telegraph) +# but allows certain spoofing attacks. If you would like to prevent +# spoofing, set this to a non-empty string (e.g. "true"). +# prevent_spoofing + +# What to order the responses by; defaults to 'published'. See +# https://github.com/aaronpk/webmention.io#api +# sort_by + +# The order to sort the responses by; defaults to 'up' (i.e. oldest +# first). See https://github.com/aaronpk/webmention.io#api +# sort_dir + +# If set to a non-empty string (e.g. "true"), will display comment-type responses +# (replies/mentions/etc.) as being part of the reactions +# (favorites/bookmarks/etc.) instead of in a separate comment list. +# comments_are_reactions = "true" + # giscus support for comments. https://giscus.app # Setup instructions: https://welpo.github.io/tabi/blog/comments/#setup [extra.giscus] diff --git a/theme.toml b/theme.toml index 5772e61..417323f 100644 --- a/theme.toml +++ b/theme.toml @@ -285,6 +285,7 @@ allowed_domains = [ { directive = "script-src", domains = ["'self'"] }, { directive = "style-src", domains = ["'self'"] }, { directive = "frame-src", domains = ["player.vimeo.com", "https://www.youtube-nocookie.com"] }, +# { directive = "connect-src", domains = [ "https://webmention.io"] }, ] # Enable the CSP directives configured (or default). @@ -320,6 +321,47 @@ custom_subset = true # Leave this field empty if you're using the service's default hosting. # self_hosted_url = "" +[extra.webmentions] +# enable = true +# Specify the domain registered with webmention.io. +# domain = "www.example.com" + +# The HTML ID for the object to fill in with the webmention data. +# Defaults to "webmentions" +# id = "webmentions" + +# data configuration for the webmention.min.js script +# The base URL to use for this page. Defaults to window.location +page_url = "https://beesbuzz.biz/code/439-Falsehoods-programmers-believe-about-email" + +# Additional URLs to check, separated by |s +# add_urls + +# The maximum number of words to render in reply mentions. +# wordcount = 20 + +# The maximum number of mentions to retrieve. Defaults to 30. +# max_webmentions + +# By default, Webmentions render using the mf2 'url' element, which plays +# nicely with webmention bridges (such as brid.gy and telegraph) +# but allows certain spoofing attacks. If you would like to prevent +# spoofing, set this to a non-empty string (e.g. "true"). +# prevent_spoofing + +# What to order the responses by; defaults to 'published'. See +# https://github.com/aaronpk/webmention.io#api +# sort_by + +# The order to sort the responses by; defaults to 'up' (i.e. oldest +# first). See https://github.com/aaronpk/webmention.io#api +# sort_dir + +# If set to a non-empty string (e.g. "true"), will display comment-type responses +# (replies/mentions/etc.) as being part of the reactions +# (favorites/bookmarks/etc.) instead of in a separate comment list. +# comments_are_reactions = "true" + # giscus support for comments. https://giscus.app # Setup instructions: https://welpo.github.io/tabi/blog/comments/#setup [extra.giscus] From b930658f862dc2c274689570aa486ff1ad8a81f2 Mon Sep 17 00:00:00 2001 From: Jeremiah Russell Date: Tue, 11 Feb 2025 06:46:30 +0000 Subject: [PATCH 03/10] =?UTF-8?q?=E2=9C=A8=20feat(webmention):=20add=20web?= =?UTF-8?q?mention.js=20for=20embedding=20webmentions?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - add webmention.js to enable client-side embedding of webmentions from webmention.io - support multiple configuration parameters for customization - based on PlaidWeb/webmention.js ✨ feat(webmention): add minified version of webmention.js - include webmention.min.js as a minified version for optimized loading - mirror functionality of the unminified webmention.js --- static/js/webmention.js | 475 ++++++++++++++++++++++++++++++++++++ static/js/webmention.min.js | 3 + 2 files changed, 478 insertions(+) create mode 100644 static/js/webmention.js create mode 100644 static/js/webmention.min.js diff --git a/static/js/webmention.js b/static/js/webmention.js new file mode 100644 index 0000000..49d23d3 --- /dev/null +++ b/static/js/webmention.js @@ -0,0 +1,475 @@ +/* webmention.js + +Simple thing for embedding webmentions from webmention.io into a page, client-side. + +(c)2018-2022 fluffy (http://beesbuzz.biz) + +Permission is hereby granted, free of charge, to any person obtaining a copy +of this software and associated documentation files (the "Software"), to deal +in the Software without restriction, including without limitation the rights +to use, copy, modify, merge, publish, distribute, sublicense, and/or sell +copies of the Software, and to permit persons to whom the Software is +furnished to do so, subject to the following conditions: + +The above copyright notice and this permission notice shall be included in all +copies or substantial portions of the Software. + +THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR +IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, +FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE +AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER +LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, +OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE +SOFTWARE. + +GitHub repo (for latest released versions, issue tracking, etc.): + + https://github.com/PlaidWeb/webmention.js + +Basic usage: + + + + + - + {# If JavaScript is disabled, hide the button. #} + + + {%- endif -%} {%- if config.extra.analytics.service -%} @@ -151,6 +153,11 @@ {%- endif -%} + {# Webmentions #} + {%- if config.extra.webmentions.enable -%} + {%- include "partials/webmentions.html" -%} + {%- endif -%} + {# Search #} {%- if config.build_search_index -%} {%- if config.search.index_format -%} From e9cfbdc2eb5e2f64fb28d3db0416b2e171f20c71 Mon Sep 17 00:00:00 2001 From: Jeremiah Russell Date: Tue, 11 Feb 2025 08:03:01 +0000 Subject: [PATCH 06/10] =?UTF-8?q?=E2=9C=A8=20feat(shortcodes):=20add=20web?= =?UTF-8?q?mentions=20section?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - introduce a section for displaying webmentions for posts - include subsections for mentions of posts and sites mentioned in posts 📝 docs(shortcodes): correct typos and improve clarity - fix spacing and punctuation issues in Mermaid diagrams - correct typo in "Provides" within the swap image section - update Markdown syntax in admonition examples - change "tranquility" to "tranquillity" in multilingual quote - correct movie title from "Beoning" to "Burning" - add usage examples for webmentions section --- content/blog/shortcodes/index.md | 57 ++++++++++++++++++++++++-------- 1 file changed, 43 insertions(+), 14 deletions(-) diff --git a/content/blog/shortcodes/index.md b/content/blog/shortcodes/index.md index 34ef9f8..f65a9c5 100644 --- a/content/blog/shortcodes/index.md +++ b/content/blog/shortcodes/index.md @@ -1,7 +1,7 @@ +++ title = "Custom shortcodes" date = 2023-02-19 -updated = 2024-12-28 +updated = 2025-02-11 description = "This theme includes some useful custom shortcodes that you can use to enhance your posts. Whether you want to display images that adapt to light and dark themes, or format a professional-looking reference section, these custom shortcodes have got you covered." [taxonomies] @@ -79,9 +79,9 @@ classDiagram +MakeAssumptions() } CognitiveDistortions *-- AllOrNothingThinking - CognitiveDistortions *-- Overgeneralization + CognitiveDistortions*-- Overgeneralization CognitiveDistortions *-- MentalFilter - CognitiveDistortions *-- JumpingToConclusions + CognitiveDistortions*-- JumpingToConclusions {% end %} The Mermaid shortcode supports two parameters: @@ -121,6 +121,7 @@ Useful if you want to use a different image for the light and dark themes: {{ dual_theme_image(light_src="img/paris_day.webp", dark_src="img/paris_night.webp" alt="The Eiffel tower") }} #### Usage + ``` {{/* dual_theme_image(light_src="img/paris_day.webp", dark_src="img/paris_night.webp" alt="The Eiffel tower") */}} ``` @@ -151,7 +152,7 @@ Images with too much brightness or contrast can be jarring against a dark backgr ### Swap image on hover -Povides an interaction where the image displayed changes as the user hovers over it. Useful for before-after comparisons, for example. +Provides an interaction where the image displayed changes as the user hovers over it. Useful for before-after comparisons, for example. {{ image_hover(default_src="img/edited.webp", hovered_src="img/raw.webp", default_alt="Edited picture", hovered_alt="Original shot") }} @@ -193,7 +194,7 @@ All other image shortcodes can be made into full-width by setting the optional p Display a path or URL on the next code block found. If it starts with "http", it will become a link. Particularly useful when used in conjunction with the [remote text shortcode](#remote-text). -{{ add_src_to_code_block(src="https://github.com/welpo/doteki/blob/main/.gitignore") }} +{{ add_src_to_code_block(src="") }} ```.gitignore {{ remote_text(src="https://raw.githubusercontent.com/welpo/doteki/main/.gitignore") }} @@ -292,19 +293,19 @@ Display lines 3 to 7 (both inclusive) of a local file: Bring attention to information with these admonition shortcodes. They come in five `type`s: `note`, `tip`, `info`, `warning`, and `danger`. -{{ admonition(type="note", text="Some **content** with _Markdown_ `syntax`. Check [this `api`](#).") }} +{{ admonition(type="note", text="Some **content** with *Markdown* `syntax`. Check [this `api`](#).") }} -{{ admonition(type="tip", text="Some **content** with _Markdown_ `syntax`. Check [this `api`](#).") }} +{{ admonition(type="tip", text="Some **content** with *Markdown* `syntax`. Check [this `api`](#).") }} -{{ admonition(type="info", text="Some **content** with _Markdown_ `syntax`. Check [this `api`](#).") }} +{{ admonition(type="info", text="Some **content** with *Markdown* `syntax`. Check [this `api`](#).") }} -{{ admonition(type="warning", text="Some **content** with _Markdown_ `syntax`. Check [this `api`](#).") }} +{{ admonition(type="warning", text="Some **content** with *Markdown* `syntax`. Check [this `api`](#).") }} -{{ admonition(type="danger", text="Some **content** with _Markdown_ `syntax`. Check [this `api`](#).") }} +{{ admonition(type="danger", text="Some **content** with *Markdown* `syntax`. Check [this `api`](#).") }} You can change the `title` and `icon` of the admonition. Both parameters take a string and default to the type of admonition. `icon` can be any of the available admonition types. -{{ admonition(type="note", icon="tip", title="Custom title and icon", text="Some **content** with _Markdown_ `syntax`. Check [this `api`](#).") }} +{{ admonition(type="note", icon="tip", title="Custom title and icon", text="Some **content** with *Markdown* `syntax`. Check [this `api`](#).") }} #### Usage @@ -332,12 +333,12 @@ Both methods support the same parameters (`type`, `icon`, and `title`), with the This shortcode allows you to display both the translated and original text for a quote. The quotation marks will be added automatically: -{{ multilingual_quote(original="Qué sosiego, ir por la vida en silencio, saludando sólo a los amigos.", translated="What tranquility, to go through life in silence, greeting only friends.", author="Francisco Umbral") }} +{{ multilingual_quote(original="Qué sosiego, ir por la vida en silencio, saludando sólo a los amigos.", translated="What tranquillity, to go through life in silence, greeting only friends.", author="Francisco Umbral") }} #### Usage ``` -{{/* multilingual_quote(original="Qué sosiego, ir por la vida en silencio, saludando sólo a los amigos.", translated="What tranquility, to go through life in silence, greeting only friends.", author="Francisco Umbral") */}} +{{/* multilingual_quote(original="Qué sosiego, ir por la vida en silencio, saludando sólo a los amigos.", translated="What tranquillity, to go through life in silence, greeting only friends.", author="Francisco Umbral") */}} ``` ### References with hanging indent @@ -394,7 +395,7 @@ Use this shortcode if you want to have a wider table, paragraph, code block… O | Title | Year | Director | Cinematographer | Genre | IMDb | Duration | |-------------------|-------|----------------------|-----------------------|---------------|-------|--------------| -| Beoning | 2018 | Lee Chang-dong | Hong Kyung-pyo | Drama/Mystery | 7.5 | 148 min | +| Burning | 2018 | Lee Chang-dong | Hong Kyung-pyo | Drama/Mystery | 7.5 | 148 min | | The Master | 2012 | Paul Thomas Anderson | Mihai Mălaimare Jr. | Drama/History | 7.1 | 137 min | | The Tree of Life | 2011 | Terrence Malick | Emmanuel Lubezki | Drama | 6.8 | 139 min | @@ -419,10 +420,12 @@ Force the text direction of a content block. Overrides both the global `force_co Accepts the parameter `direction`: the desired text direction. This can be either "ltr" (left-to-right) or "rtl" (right-to-left). Defaults to "ltr". {% force_text_direction(direction="rtl") %} + ```python def مرحبا_بالعالم(): print("مرحبا بالعالم!") ``` + {% end %} #### Usage @@ -439,3 +442,29 @@ def مرحبا_بالعالم(): {%/* end */%} ```` + +## Displaying webmentions for your posts + +As described by the recommended W3C standard [Webmention][1] is a simple way to notify any URL when you mention it on your site. From the receiver's perspective, it's a way to request notifications when other sites mention it. + +For static sites [webmention.io][2] hosts a webmention endpoint that can be used to receive webmentions. This feature fetches the webmentions stored at webmention.io and displays them for a page. You will need to have setup an account for your website at webmention.io. When you enable the webmention feature it will advertise your webmention.io endpoint and display the webmentions for any post using the webmention shortcut. + +### Configuration and Usage + +Enable webmentions for your site, add the following to your `config.toml` file: + +```toml +[extra.webmentions] +enable = true +# Specify the domain registered with webmention.io. +domain = "www.example.com" +``` + +Add the shortcut on the page where you want to display the webmentions: + +``` +{{/* webmentions() */}} +``` + +[1]: https://www.w3.org/TR/webmention/#abstract-p-1 +[2]: https://webmention.io/ From f2d13b9468564ddf0adfff558727bf42d5233c40 Mon Sep 17 00:00:00 2001 From: Jeremiah Russell Date: Tue, 11 Feb 2025 08:57:39 +0000 Subject: [PATCH 07/10] =?UTF-8?q?=F0=9F=93=9D=20docs(blog):=20add=20webmen?= =?UTF-8?q?tions=20section=20to=20mastering=20tabi=20settings?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - introduce webmentions as per W3C standard - provide configuration and usage instructions - include links for further reading --- content/blog/mastering-tabi-settings/index.md | 33 ++++++++++++++++++- 1 file changed, 32 insertions(+), 1 deletion(-) diff --git a/content/blog/mastering-tabi-settings/index.md b/content/blog/mastering-tabi-settings/index.md index ab8814b..58c4234 100644 --- a/content/blog/mastering-tabi-settings/index.md +++ b/content/blog/mastering-tabi-settings/index.md @@ -1,7 +1,7 @@ +++ title = "Mastering tabi Settings: A Comprehensive Guide" date = 2023-09-18 -updated = 2025-02-02 +updated = 2025-02-11 description = "Discover the many ways you can customise your tabi site." [taxonomies] @@ -759,6 +759,37 @@ If you have enabled a system globally, but want to disable it on a specific page Read [the docs](@/blog/comments/index.md) for more information on the available systems and their setup. +## Webmentions + +As described by the recommended W3C standard [Webmention][1] is a simple way to notify any URL when you mention it on your site. From the receiver's perspective, it's a way to request notifications when other sites mention it. + +For static sites [webmention.io][2] hosts a webmention endpoint that can be used to receive webmentions. This feature fetches the webmentions stored at webmention.io and displays them for a page. You will need to have setup an account for your website at webmention.io. When you enable the webmention feature it will advertise your webmention.io endpoint and display the webmentions for any post using the webmention shortcut. + +### Configuration and Usage + +Enable webmentions for your site by adding the following to your `config.toml` file. A directive for CSP is required to allow the webmention.io endpoint to be used. + +```toml +[extra] +allowed_domains = [ + { directive = "connect-src", domains = [ "https://webmention.io"] }, +] + +[extra.webmentions] +enable = true +# Specify the domain registered with webmention.io. +domain = "www.example.com" +``` + +Add the shortcut on the page where you want to display the webmentions: + +``` +{{/* webmentions() */}} +``` + +[1]: https://www.w3.org/TR/webmention/#abstract-p-1 +[2]: https://webmention.io/ + ### Analytics | Page | Section | `config.toml` | Follows Hierarchy | Requires JavaScript | From ee88359ad657db2355b07da8b413ffb3eed548a4 Mon Sep 17 00:00:00 2001 From: Jeremiah Russell Date: Tue, 11 Feb 2025 09:07:47 +0000 Subject: [PATCH 08/10] =?UTF-8?q?=F0=9F=92=84=20style(blog):=20remove=20tr?= =?UTF-8?q?ailing=20space=20in=20markdown=20text?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - eliminate unwanted space at the end of a sentence for style consistency --- content/blog/mastering-tabi-settings/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/content/blog/mastering-tabi-settings/index.md b/content/blog/mastering-tabi-settings/index.md index 58c4234..30b8141 100644 --- a/content/blog/mastering-tabi-settings/index.md +++ b/content/blog/mastering-tabi-settings/index.md @@ -113,7 +113,7 @@ The description is regular Markdown content, set outside the front matter. #### Listing Recent Posts -To show posts on your main page, you first need to decide where these posts will be served from: the root path (`/`) or a subdirectory (e.g., `/blog`). +To show posts on your main page, you first need to decide where these posts will be served from: the root path (`/`) or a subdirectory (e.g., `/blog`). **Option A: Serve posts from the root path (`/`)** From 30819dd890f231aa8758f02127f1aeed009577f0 Mon Sep 17 00:00:00 2001 From: Jeremiah Russell Date: Tue, 11 Feb 2025 12:17:32 +0000 Subject: [PATCH 09/10] =?UTF-8?q?=F0=9F=92=84=20style(sass):=20enhance=20w?= =?UTF-8?q?ebmention=20styling=20with=20variables=20=20=20-=20add=20color?= =?UTF-8?q?=20and=20background=20color=20variables=20for=20consistent=20st?= =?UTF-8?q?yling=20=20=20-=20update=20margins=20and=20padding=20for=20bett?= =?UTF-8?q?er=20layout?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ♻️ refactor(css): migrate and rename webmention CSS to SCSS - move webmention.css to sass/parts/_webmention.scss - remove unused webmention.min.css - update template to remove old stylesheet link --- sass/main.scss | 1 + .../parts/_webmention.scss | 18 ++++++++++++++---- static/webmention.min.css | 1 - templates/partials/webmentions.html | 1 - 4 files changed, 15 insertions(+), 6 deletions(-) rename static/webmention.css => sass/parts/_webmention.scss (77%) delete mode 100644 static/webmention.min.css diff --git a/sass/main.scss b/sass/main.scss index f2b36c7..d1d13ae 100644 --- a/sass/main.scss +++ b/sass/main.scss @@ -23,6 +23,7 @@ @use 'parts/_tags.scss'; @use 'parts/_theme-switch.scss'; @use 'parts/_zola-error.scss'; +@use 'parts/_webmention.scss'; @font-face { src: local('Inter'), diff --git a/static/webmention.css b/sass/parts/_webmention.scss similarity index 77% rename from static/webmention.css rename to sass/parts/_webmention.scss index ab34847..8458b23 100644 --- a/static/webmention.css +++ b/sass/parts/_webmention.scss @@ -3,6 +3,8 @@ position: relative; z-index: 100; line-height: 1.2em; + color: var(--text-color); + background-color: var(--background-color); } #webmentions .comments { @@ -15,8 +17,10 @@ #webmentions h2 { font-size: medium; margin: 0; + margin-top: 1.4em; + margin-bottom: 1.2em; padding: 2px; - /* background: #ccc; */ + background: var(--background-color); } #webmentions .reacts img { @@ -49,10 +53,16 @@ margin-right: 1ex; } +#webmentions a.source { + margin-right: 1ex; + text-decoration: none; + color: var(--primary-color); + background-color: var(--background-color); +} + #webmentions a.reaction img { max-height: 1.3em; display: inline; - /* padding-right: .5em; */ width: auto; margin-right: -1ex; border-radius: 25%; @@ -69,7 +79,7 @@ } #webmentions .comments li .text { - color: #555; + color: var(--meta-color); font-style: italic; text-decoration: none; text-wrap: wrap; @@ -77,7 +87,7 @@ } #webmentions .comments li .name { - color: #111; + color: var(--meta-color); padding-left: 0.5em; } diff --git a/static/webmention.min.css b/static/webmention.min.css deleted file mode 100644 index c12d90e..0000000 --- a/static/webmention.min.css +++ /dev/null @@ -1 +0,0 @@ -#webmentions{margin:0;position:relative;z-index:100;line-height:1.2em}#webmentions .comments{max-height:20em;overflow-x:hidden;overflow-y:scroll;font-size:80%}#webmentions h2{font-size:medium;margin:0;padding:2px}#webmentions .reacts img{margin:3px -1ex 1px 0;display:inline}#webmentions img.missing{background:#fff;border:dashed #000 1px}#webmentions ul{list-style-type:none;margin:0;padding:4px}#webmentions li{text-indent:-1em;padding-left:1em}#webmentions a.reaction{position:relative;text-decoration:none;text-shadow:0 0 3px #fff;margin-right:0;letter-spacing:-1ex;margin-right:1ex}#webmentions a.reaction img{max-height:1.3em;display:inline;width:auto;margin-right:-1ex;border-radius:25%}#webmentions a.reaction sub{font-size:50%}#webmentions .comments li{white-space:nowrap;text-overflow:ellipsis;overflow:hidden}#webmentions .comments li .text{color:#555;font-style:italic;text-decoration:none;text-wrap:wrap;padding-left:.5em}#webmentions .comments li .name{color:#111;padding-left:.5em}#webmentions .comments li .emoji{display:none} \ No newline at end of file diff --git a/templates/partials/webmentions.html b/templates/partials/webmentions.html index 453ee76..5d4d68b 100644 --- a/templates/partials/webmentions.html +++ b/templates/partials/webmentions.html @@ -4,7 +4,6 @@ 3. Add and configure the javascript to fetch and display the webmentions collected at webmention.io. #} - {# Calculate the configured data for the script, if any #} From 51f36844f0428fc2f1cc4751d091b534c552b737 Mon Sep 17 00:00:00 2001 From: Jeremiah Russell Date: Tue, 11 Feb 2025 13:01:39 +0000 Subject: [PATCH 10/10] =?UTF-8?q?=F0=9F=93=9D=20docs(blog):=20remove=20dup?= =?UTF-8?q?licate=20updated=20date=20in=20blog=20metadata?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - delete repeated updated date entry from the blog post metadata --- content/blog/mastering-tabi-settings/index.md | 1 - 1 file changed, 1 deletion(-) diff --git a/content/blog/mastering-tabi-settings/index.md b/content/blog/mastering-tabi-settings/index.md index 6e59959..1fdb47a 100644 --- a/content/blog/mastering-tabi-settings/index.md +++ b/content/blog/mastering-tabi-settings/index.md @@ -2,7 +2,6 @@ title = "Mastering tabi Settings: A Comprehensive Guide" date = 2023-09-18 updated = 2025-02-11 -updated = 2025-02-11 description = "Discover the many ways you can customise your tabi site." [taxonomies]