deepStateMirrors/tabi
1
0
Fork 1
mirror of https://github.com/welpo/tabi.git synced 2026-01-08 22:37:47 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

Merge c1840dfd36 into 689934edfe

Browse source
This commit is contained in:
Poolitzer 2026-01-07 11:57:21 +00:00 • committed by GitHub
commit 382d6f79d5
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
3 changed files with 41 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

2
content/blog/mastering-tabi-settings/index.md
View file

@ -415,6 +415,8 @@ invertible_image = false
- `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.
- `local_image_dark` is an optional path to an alternative image to be shown in dark mode. When set, `local_image` is shown in light mode only.
- `remote_image` and `remote_image_dark` is an alternative which you can use when you want to set an URL instead.
- `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.

25
templates/macros/list_posts.html
View file

@ -97,21 +97,36 @@
{% if post.extra.local_image or post.extra.remote_image %}
<li class="post-thumbnail">
<a href="{{ post.permalink }}">
{% if post.extra.local_image %}
{% if post.extra.local_image_dark %}
{# Show light image only in light mode, dark image only in dark mode #}
{% set meta_dark = get_image_metadata(path=post.extra.local_image_dark, allow_missing=true) %}
<img class="thumbnail-image img-dark"
alt="{{ post.extra.local_image_dark }}"
src="{{ get_url(path=post.extra.local_image_dark) }}"
{% if meta_dark.width %}width="{{ meta_dark.width }}"{% endif %}
{% if meta_dark.height %}height="{{ meta_dark.height }}"{% endif %}>
{% endif %}
{% set meta = get_image_metadata(path=post.extra.local_image, allow_missing=true) %}
<img class="thumbnail-image"
<img class="thumbnail-image{% if page.extra.local_image_dark %} img-light{% endif %}"
alt="{{ post.extra.local_image }}"
src="{{ get_url(path=post.extra.local_image) }}"
{% if meta.width %}width="{{ meta.width }}"{% endif %}
{% if meta.height %}height="{{ meta.height }}"{% endif %}>
{% elif post.extra.remote_image %}
<img class="thumbnail-image"
{% if post.extra.remote_image_dark %}
{# Show light image only in light mode, dark image only in dark mode #}
{% set meta_dark = get_image_metadata(path=post.extra.remote_image_dark, allow_missing=true) %}
<img class="thumbnail-image img-dark"
alt="{{ post.extra.remote_image_dark }}"
src="{{ get_url(path=post.extra.remote_image_dark) }}">
{% endif %}
<img class="thumbnail-image{% if page.extra.remote_image_dark %} img-light{% endif %}"
alt="{{ post.extra.remote_image }}"
src="{{ post.extra.remote_image }}">
{% endif %}
</a>
</li>
{% endif %}
{% endif %}
{% if post.draft %}
<li class="draft-label">{{ macros_translate::translate(key="draft", default="DRAFT", language_strings=language_strings) }}</li>

21
templates/partials/cards_pages.html
View file

@ -20,14 +20,31 @@
{% 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 %}
{% if page.extra.local_image_dark %}
{# Show light image only in light mode, dark image only in dark mode #}
{% set meta_dark = get_image_metadata(path=page.extra.local_image_dark, allow_missing=true) %}
<img class="card-image img-dark"
alt="{{ page.extra.local_image_dark }}"
src="{{ get_url(path=page.extra.local_image_dark) }}"
{% if meta_dark.width %}width="{{ meta_dark.width }}"{% endif %}
{% if meta_dark.height %}height="{{ meta_dark.height }}"{% endif %}>
{% endif %}
{% set meta = get_image_metadata(path=page.extra.local_image, allow_missing=true) %}
<img class="{{ card_image_class }}"
<img class="{{ card_image_class }}{% if page.extra.local_image_dark %} img-light{% endif %}"
alt="{{ page.extra.local_image }}"
src="{{ get_url(path=page.extra.local_image) }}"
{% if meta.width %}width="{{ meta.width }}"{% endif %}
{% if meta.height %}height="{{ meta.height }}"{% endif %}>
{% elif page.extra.remote_image %}
<img class="{{ card_image_class }}"
{% if page.extra.remote_image_dark %}
{# Show light image only in light mode, dark image only in dark mode #}
{% set meta_dark = get_image_metadata(path=page.extra.remote_image_dark, allow_missing=true) %}
<img class="card-image img-dark"
alt="{{ page.extra.remote_image_dark }}"
src="{{ page.extra.remote_image_dark }}">
{% endif %}
{% set meta = get_image_metadata(path=page.extra.remote_image_dark, allow_missing=true) %}
<img class="{{ card_image_class }}{% if page.extra.local_image_dark %} img-light{% endif %}"
alt="{{ page.extra.remote_image }}"
src="{{ page.extra.remote_image }}">
{% else %}