Git-Mirrors/privacyguides.org
1
0
Fork 0
mirror of https://github.com/privacyguides/privacyguides.org.git synced 2024-07-11 22:01:58 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add support for dark color-scheme logos to recommendation-card.html

Browse Source 
Specify `logo_dark` in yaml
This commit is contained in:
Jonah Aragon 2022-01-01 00:29:43 -06:00
parent 29037a6500
commit becbf3ddcb
No known key found for this signature in database
GPG Key ID: 6A957C9A9A9429F7
2 changed files with 7 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
_data/software/video-streaming-front-ends/1_invidious.yml
View File

@ -1,6 +1,7 @@
title: Invidious
type: Recommendation
logo: /assets/img/video-streaming/invidious.svg
logo_dark: /assets/img/video-streaming/invidious-dark.svg
description: |
<strong>Invidious</strong> is a free and open source front end for YouTube that is also self-hostable. There are list of <a href="https://instances.invidious.io">public instances</a>. Some instances have <a href="https://www.torproject.org">Tor</a> onion services support.

7
_includes/recommendation-card.html
View File

@ -2,7 +2,12 @@
<div class="card-body">
<div class="row p-3">
<div class="col-12 col-sm-4 col-md-3 text-center">
<img src="{{ item.logo }}" alt="{{ item.name }} logo" class="py-5 w-75">
<picture>
{% if item.logo_dark %}<source
srcset="{{ item.logo_dark }}"
media="(prefers-color-scheme: dark)">{% endif %}
<img src="{{ item.logo }}" alt= "{{ item.name }} logo" class="py-5 w-75">
</picture>
</div>
<div class="col-12 col-sm-8 col-md-9 text-center text-md-start pb-4">
<h2>{{ item.title }}</h2>