diff options
Diffstat (limited to 'src/content/index.adoc')
| -rw-r--r-- | src/content/index.adoc | 17 |
1 files changed, 13 insertions, 4 deletions
diff --git a/src/content/index.adoc b/src/content/index.adoc index 4065605..e13706f 100644 --- a/src/content/index.adoc +++ b/src/content/index.adoc @@ -16,7 +16,10 @@ export custom_body=true <h2>Why Papo?</h2> <div class="why_papo-cards-container"> <div class="why_papo-card"> - <img class="icon" src="img/shield-light.svg" alt="shild icon" /> + <picture> + <source srcset="img/shield/dark.svg" media="(prefers-color-scheme: dark)" /> + <img src="img/shield/light.svg" class="icon" alt="an icon of a small outlined shield inside a chat bubble" /> + </picture> <h3>Privacy-first hosted team chat</h3> <p> A convenient hosted service for you to subscribe to and delegate management of, @@ -25,7 +28,10 @@ export custom_body=true </p> </div> <div class="why_papo-card"> - <img class="icon" src="img/database-light.svg" alt="database with an x icon" /> + <picture> + <source srcset="img/database/dark.svg" media="(prefers-color-scheme: dark)" /> + <img src="img/database/light.svg" class="icon" alt="an outlined database icon with an "X" marker on its right-bottom corner" /> + </picture> <h3>No gratuitous data collection</h3> <p> No "accept necessary cookies" or third-party tracking. Revenue is made via @@ -33,7 +39,10 @@ export custom_body=true </p> </div> <div class="why_papo-card"> - <img class="icon" src="img/diagram-light.svg" alt="diagram icon" /> + <picture> + <source srcset="img/diagram/dark.svg" media="(prefers-color-scheme: dark)" /> + <img src="img/diagram/light.svg" class="icon" alt="a small outlined icon of a cog surrounded by 6 smaller circles with a short dashed line between the cog and each circle, where each circle also has 2 dashed lines coming from and going to the next circle, fully surrounding the inner cog" /> + </picture> <h3>Build for interoperability</h3> <p> Built on existing open standards, we're not in the business of profiting from @@ -52,5 +61,5 @@ export custom_body=true <h3>Purposefully designed to consectetur adipiscing elit</h3> </div> </hgroup> - <!-- https://codepen.io/Laisses/pen/qBzwmoz --> + <!-- https://codepen.io/Laisses/pen/qBzwmoz --> ++++ |