From cf7989e355d9709a298fb4aa3cffd673e2cc98fe Mon Sep 17 00:00:00 2001 From: welpo Date: Sat, 27 Dec 2025 14:42:06 +0100 Subject: [PATCH] =?UTF-8?q?=E2=9C=A8feat(projects):=20add=20invertible=5Fi?= =?UTF-8?q?mage=20option=20for=20project=20cards?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- content/blog/mastering-tabi-settings/index.ca.md | 4 +++- content/blog/mastering-tabi-settings/index.es.md | 4 +++- content/blog/mastering-tabi-settings/index.md | 4 +++- templates/partials/cards_pages.html | 5 +++-- 4 files changed, 12 insertions(+), 5 deletions(-) diff --git a/content/blog/mastering-tabi-settings/index.ca.md b/content/blog/mastering-tabi-settings/index.ca.md index b8669516..2cadcc54 100644 --- a/content/blog/mastering-tabi-settings/index.ca.md +++ b/content/blog/mastering-tabi-settings/index.ca.md @@ -1,7 +1,7 @@ +++ title = "Domina la configuració de tabi: guia completa" date = 2023-09-18 -updated = 2025-08-07 +updated = 2025-12-27 description = "Descobreix les múltiples maneres en què pots personalitzar tabi." [taxonomies] @@ -402,12 +402,14 @@ weight = 1 [extra] local_image = "img/tabi.webp" +invertible_image = false ``` - `title` és el títol del projecte. - `description` és la descripció del projecte. - `weight` determina l'ordre en què es mostren els projectes. Com menor sigui el pes, més amunt apareixerà el projecte. - `local_image` és la ruta de la imatge del projecte. Aquesta imatge es mostra a la pàgina de projectes. +- `invertible_image` inverteix els colors de la imatge en mode fosc. Útil per a logotips o icones en blanc i negre. Quan un usuari faci clic a la imatge o al títol d'un projecte, serà portat a la pàgina del projecte. Si prefereixes que els usuaris vagin a un enllaç extern, pots establir `link_to = "https://example.com"` a la secció `[extra]` del fitxer `.md` del projecte. diff --git a/content/blog/mastering-tabi-settings/index.es.md b/content/blog/mastering-tabi-settings/index.es.md index ba259fef..9f0a8186 100644 --- a/content/blog/mastering-tabi-settings/index.es.md +++ b/content/blog/mastering-tabi-settings/index.es.md @@ -1,7 +1,7 @@ +++ title = "Domina la configuración de tabi: guía completa" date = 2023-09-18 -updated = 2025-08-07 +updated = 2025-12-27 description = "Descubre las múltiples maneras en que puedes personalizar tabi." [taxonomies] @@ -403,12 +403,14 @@ weight = 1 [extra] local_image = "img/tabi.webp" +invertible_image = false ``` - `title` es el título del proyecto. - `description` es la descripción del proyecto. - `weight` determina el orden en el que se muestran los proyectos. Cuanto menor sea el peso, más arriba aparecerá el proyecto. - `local_image` es la ruta de la imagen del proyecto. Esta imagen se muestra en la página de proyectos. +- `invertible_image` invierte los colores de la imagen en modo oscuro. Útil para logotipos o iconos en blanco y negro. Cuando un usuario haga clic en la imagen o el título de un proyecto, será llevado a la página del proyecto. Si prefieres que los usuarios vayan a un enlace externo, puedes establecer `link_to = "https://example.com"` en la sección `[extra]` del archivo `.md` del proyecto. diff --git a/content/blog/mastering-tabi-settings/index.md b/content/blog/mastering-tabi-settings/index.md index 68e399a8..74290127 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-08-07 +updated = 2025-12-27 description = "Discover the many ways you can customise your tabi site." [taxonomies] @@ -408,12 +408,14 @@ weight = 1 [extra] local_image = "img/tabi.webp" +invertible_image = false ``` - `title` is the title of the project. - `description` is the description of the project. - `weight` determines the order in which the projects are shown. The lower the weight, the higher the project will appear. - `local_image` is the path to the image of the project. This image is shown on the projects page. +- `invertible_image` inverts the image colours in dark mode. Useful for black and white logos/icons. When a user clicks on the image or title of a project, they will be taken to the project's page. If you'd rather have users go to an external link, you can set `link_to = "https://example.com` in the `[extra]` section of the project's `.md` file. diff --git a/templates/partials/cards_pages.html b/templates/partials/cards_pages.html index 89bdabcc..b923b2c1 100644 --- a/templates/partials/cards_pages.html +++ b/templates/partials/cards_pages.html @@ -18,15 +18,16 @@ {% if page.taxonomies %} data-tags="{% for tax_name, terms in page.taxonomies %}{% for term in terms | unique %}{{ term | lower }}{% if not loop.last %},{% endif %}{% endfor %}{% endfor %}" {% endif %}> + {% if page.extra.invertible_image %}{% set card_image_class = "card-image invertible-image" %}{% else %}{% set card_image_class = "card-image" %}{% endif %} {% if page.extra.local_image %} {% set meta = get_image_metadata(path=page.extra.local_image, allow_missing=true) %} - {{ page.extra.local_image }} {% elif page.extra.remote_image %} - {{ page.extra.remote_image }} {% else %}