sd/site
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

make services clickthrough for info
Some checks failed
/ build (push) Has been cancelled
Details

Browse source
This commit is contained in:
Ruben 2025-10-28 23:24:36 -05:00
commit c746f1d669
Signed by: sneexy
GPG key ID: 8ECFA045E63BC583
4 changed files with 487 additions and 370 deletions
Download patch file Download diff file Expand all files Collapse all files

1
_includes/layouts/pages/index.njk
View file

@ -22,6 +22,7 @@
<p>Be kind to one another.</p>
<p>Who left this jar of RAM here?</p>
<p>The Game? What game?</p>
<p>Sorry! Only <i>modern</i> HTML and CSS allowed!</p>
<p>beeeeeeeep</p>
<p>We think Herobrine might have been removed, but we're not so sure.</p>
<p>Sorry for the downtime, we caught a Synth trying to eat the servers in the server room.</p>

751
_includes/layouts/pages/services/list.njk
View file

@ -1,350 +1,407 @@
<card-container>
<card-entry redlib>
<h3>
<img icon src="/assets/icons/redlib.svg" alt="">
Redlib
<span status>
<span><img src="https://status.synth.download/api/badge/19/status?style=flat-square" alt=""></span>
<icon-tabler cloud-network aria-label="Frontend"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
<p desc>A privacy respecting frontend for <a href="https://reddit.com">Reddit</a>.</p>
<p warning><icon-tabler alert-triangle aria-label="Warning"></icon-tabler> This instance may be nonfunctional from time to time.</p>
<buttons-container>
<a button href="https://reddit.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/redlib-org/redlib" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthoclokpnsxa2xloi5skskaltlbjjhpvadqrs7swz2vpqui4a.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://reddit.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://reddit.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry safetwitch>
<h3>
<img icon src="/assets/synth.download/icons/twitch.svg" alt="">
SafeTwitch
<span status>
<span><img src="https://status.synth.download/api/badge/21/status?style=flat-square" alt=""></span>
<icon-tabler cloud-network aria-label="Frontend"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
<p desc>A privacy respecting frontend for proxying and watching live <a href="https://twitch.com">Twitch</a> streams.</p>
<buttons-container>
<a button href="https://twitch.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://codeberg.org/safetwitch/safetwitch" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthj6e6xw3kjn2ipd3cmcvu5oic4znsvnjfisdd775wbp3xbqa.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://twitch.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://twitch.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry searxng>
<h3>
<img icon src="/assets/synth.download/icons/search.svg" alt="">
SearxNG
<span status>
<span><img src="https://status.synth.download/api/badge/20/status?style=flat-square" alt=""></span>
<icon-tabler search aria-label="Search"></icon-tabler>
<icon-tabler cloud-network aria-label="Frontend"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
<p desc><a href="https://en.wikipedia.org/wiki/Metasearch_engine">Metasearch engine</a> that retrieves web search results from multiple other search engines, while respecting user privacy.</p>
<buttons-container>
<a button href="https://searx.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://codeberg.org/safetwitch/safetwitch" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synth5agr6rfgw2ff6vx2qnlcee7o2vryeyubgnbflukmaohdyda.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://searx.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://searx.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry sharkey>
<h3>
<img icon src="/assets/icons/sharkey.svg" alt="">
Sharkey
<span status>
<span><img src="https://status.synth.download/api/badge/1/status?style=flat-square" alt=""></span>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
<p desc>Advanced, fun, featureful and federated social media platform for the <a href="https://fediverse.info">Fediverse</a>. <small>Based on <a href="https://misskey-hub.net">Misskey</a>.</small></p>
<p info><icon-tabler info-circle aria-label="Information"></icon-tabler> Accounts are located at <span>@booping.synth.download</span></p>
<buttons-container>
<a button href="https://booping.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="/fediverse" aria-label="Information">
<icon-tabler info-circle></icon-tabler>
</a>
<a button href="https://activitypub.software/TransFem-org/Sharkey" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthn43gye7ymvv7y63ru6lisoephszczlnojqlkz5ltwv66mta.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://booping.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://booping.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry mastodon>
<h3>
<img icon src="/assets/icons/mastodon.svg" alt="">
Mastodon
<span status>
<span><img src="https://status.synth.download/api/badge/5/status?style=flat-square" alt=""></span>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
<p desc>Traditional, Calmer, more Twitter-like and federated social media platform for the <a href="https://fediverse.info">Fediverse</a>. <small>Runs our own fork with added features.</small></p>
<p info><icon-tabler info-circle aria-label="Information"></icon-tabler> Accounts are located at <span>@merping.synth.download</span></p>
<buttons-container>
<a button href="https://merping.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="/fediverse" aria-label="Information">
<icon-tabler info-circle></icon-tabler>
</a>
<a button href="https://github.com/synth-download/mastodon" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthn43gye7ymvv7y63ru6lisoephszczlnojqlkz5ltwv66mta.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://merping.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://merping.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry iceshrimp advise-against>
<h3>
<img icon src="/assets/icons/iceshrimp.svg" alt="">
Iceshrimp.NET
<span status>
<span><img src="https://status.synth.download/api/badge/9/status?style=flat-square" alt=""></span>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
<p desc>Lightweight, Misskey-inspired software for the <a href="https://fediverse.info">Fediverse</a>.</p>
<p info><icon-tabler info-circle aria-label="Information"></icon-tabler> Accounts are located at <span>@synth.download</span></p>
<p warning><icon-tabler alert-triangle aria-label="Warning"></icon-tabler> We currently do not suggest using this software. Sharkey and Mastodon provide better and more stable user experiences.</p>
<buttons-container>
<a button href="https://beeping.synth.download" aria-label="Go">
<details redlib>
<summary>
<h3>
<img icon src="/assets/icons/redlib.svg" alt="">
Redlib
<span status>
<img src="https://status.synth.download/api/badge/19/status?style=flat-square" alt="">
<icon-tabler cloud-network aria-label="Frontend"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>A privacy respecting frontend for <a href="https://reddit.com">Reddit</a>.</p>
<p warning><icon-tabler alert-triangle aria-label="Warning"></icon-tabler> This instance may be nonfunctional from time to time.</p>
<buttons-container>
<a button href="https://reddit.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="/fediverse" aria-label="Information">
<icon-tabler info-circle></icon-tabler>
</a>
<a button href="https://iceshrimp.dev/iceshrimp/iceshrimp.net" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthrfmxti7rfwfh4gg6n5qiwbt6x52qudys4hql6eafb6qexoa.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://beeping.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://beeping.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry pds>
<h3>
<img icon src="/assets/synth.download/icons/atproto.svg" alt="">
PDS
<span status>
<span><img src="https://status.synth.download/api/badge/11/status?style=flat-square" alt=""></span>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
<p desc><b>P</b>ersonal <b>D</b>ata <b>S</b>erver, used to store your profile data and interact with applications in the <a href="https://atproto.com">Atmosphere</a>, such as <a href="https://bsky.app">Bluesky</a>.</p>
<buttons-container>
<a button href="https://pds.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/bluesky-social/pds" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</card-entry>
<card-entry pl-fe>
<h3>
<img icon src="/assets/synth.download/icons/pl-fe.svg" alt="">
pl-fe
<span status>
<icon-tabler device-desktop-cog aria-label="Client-side service, serves as a client or frontend where all data is accessed and stored on the users device."></icon-tabler>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
<p desc>General fediverse compatible client, using a baseline of the Mastodon API with extended support for more APIs and features from other softwares.</small></p>
<buttons-container>
<a button href="https://pl-fe.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://codeberg.org/mkljczk/pl-fe" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry phanpy>
<h3>
<img icon src="/assets/icons/phanpy.svg" alt="">
Phanpy
<span status>
<icon-tabler device-desktop-cog aria-label="Client-side service, serves as a client or frontend where all data is accessed and stored on the users device."></icon-tabler>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
<p desc>Opinionated Mastodon-API compatible fediverse client. <small>Our own fork with improved support for extra features, such as emoji reactions.</small></p>
<buttons-container>
<a button href="https://phanpy.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/zenfyrdev/phanpy" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry askjs>
<h3>
<img icon src="/assets/synth.download/icons/ask.svg" alt="">
AskJS
<span status>
<span><img src="https://status.synth.download/api/badge/16/status?style=flat-square" alt=""></span>
<icon-tabler mood-smile aria-label="Fun"></icon-tabler>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
<p desc>Anonymous asking site to ask users questions.</p>
<buttons-container>
<a button href="https://asking.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/ihateblueb/ask-js" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry xmpp>
<h3>
<img icon src="/assets/icons/xmpp.svg" alt="">
XMPP
<span status>
<span><img src="https://status.synth.download/api/badge/13/status?style=flat-square" alt=""></span>
<icon-tabler message aria-label="Chat"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
<p desc>Our <a href="https://ejabberd.im">Ejabberd</a> server, for the <a href="https://xmpp.org">XMPP chat protocol</a>.</p>
<buttons-container>
<a button href="https://github.com/processone/ejabberd" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a href="https://compliance.conversations.im/server/synth.download"><img src="https://compliance.conversations.im/badge/synth.download" alt="XMPP Specifications compliance: 100%"></a>
</buttons-container>
</card-entry>
<card-entry forgejo>
<h3>
<img icon src="/assets/icons/forgejo.svg" alt="">
Forgejo
<span status>
<span><img src="https://status.synth.download/api/badge/12/status?style=flat-square" alt=""></span>
<icon-tabler brand-git aria-label="Git"></icon-tabler>
<icon-tabler database-share aria-label="Sharing"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
<p desc>Self-hosted Git forge for storing code repositories.</p>
<buttons-container>
<a button href="https://forged.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://codeberg.org/forgejo/forgejo" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry vaultwarden>
<h3>
<img icon src="/assets/icons/vaultwarden.svg" alt="">
Vaultwarden
<span status>
<span><img src="https://status.synth.download/api/badge/24/status?style=flat-square" alt=""></span>
<icon-tabler user aria-label="Personal"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
<p desc>A Bitwarden-compatible password manager, hosted by us.</p>
<buttons-container>
<a button href="https://vault.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/dani-garcia/vaultwarden" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</card-entry>
<card-entry freshrss>
<h3>
<img icon src="/assets/icons/freshrss.svg" alt="">
FreshRSS
<span status>
<span><img src="https://status.synth.download/api/badge/15/status?style=flat-square" alt=""></span>
<icon-tabler user aria-label="Personal"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
<p desc>An online RSS reader and news aggregator.</p>
<buttons-container>
<a button href="https://rss.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/FreshRSS/FreshRSS" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</card-entry>
</a>
<a button href="https://github.com/redlib-org/redlib" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthoclokpnsxa2xloi5skskaltlbjjhpvadqrs7swz2vpqui4a.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://reddit.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://reddit.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details safetwitch>
<summary>
<h3>
<img icon src="/assets/synth.download/icons/twitch.svg" alt="">
SafeTwitch
<span status>
<img src="https://status.synth.download/api/badge/21/status?style=flat-square" alt="">
<icon-tabler cloud-network aria-label="Frontend"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>A privacy respecting frontend for proxying and watching live <a href="https://twitch.com">Twitch</a> streams.</p>
<buttons-container>
<a button href="https://twitch.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://codeberg.org/safetwitch/safetwitch" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthj6e6xw3kjn2ipd3cmcvu5oic4znsvnjfisdd775wbp3xbqa.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://twitch.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://twitch.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details searxng>
<summary>
<h3>
<img icon src="/assets/synth.download/icons/search.svg" alt="">
SearxNG
<span status>
<img src="https://status.synth.download/api/badge/20/status?style=flat-square" alt="">
<icon-tabler search aria-label="Search"></icon-tabler>
<icon-tabler cloud-network aria-label="Frontend"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc><a href="https://en.wikipedia.org/wiki/Metasearch_engine">Metasearch engine</a> that retrieves web search results from multiple other search engines, while respecting user privacy.</p>
<buttons-container>
<a button href="https://searx.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://codeberg.org/safetwitch/safetwitch" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synth5agr6rfgw2ff6vx2qnlcee7o2vryeyubgnbflukmaohdyda.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://searx.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://searx.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details sharkey>
<summary>
<h3>
<img icon src="/assets/icons/sharkey.svg" alt="">
Sharkey
<span status>
<img src="https://status.synth.download/api/badge/1/status?style=flat-square" alt="">
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>Advanced, fun, featureful and federated social media platform for the <a href="https://fediverse.info">Fediverse</a>. <small>Based on <a href="https://misskey-hub.net">Misskey</a>.</small></p>
<p info><icon-tabler info-circle aria-label="Information"></icon-tabler> Accounts are located at <span>@booping.synth.download</span></p>
<buttons-container>
<a button href="https://booping.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="/fediverse" aria-label="Information">
<icon-tabler info-circle></icon-tabler>
</a>
<a button href="https://activitypub.software/TransFem-org/Sharkey" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthn43gye7ymvv7y63ru6lisoephszczlnojqlkz5ltwv66mta.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://booping.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://booping.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details mastodon>
<summary>
<h3>
<img icon src="/assets/icons/mastodon.svg" alt="">
Mastodon
<span status>
<img src="https://status.synth.download/api/badge/5/status?style=flat-square" alt="">
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>Traditional, Calmer, more Twitter-like and federated social media platform for the <a href="https://fediverse.info">Fediverse</a>. <small>Runs our own fork with added features.</small></p>
<p info><icon-tabler info-circle aria-label="Information"></icon-tabler> Accounts are located at <span>@merping.synth.download</span></p>
<buttons-container>
<a button href="https://merping.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="/fediverse" aria-label="Information">
<icon-tabler info-circle></icon-tabler>
</a>
<a button href="https://github.com/synth-download/mastodon" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthn43gye7ymvv7y63ru6lisoephszczlnojqlkz5ltwv66mta.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://merping.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://merping.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details iceshrimp advise-against>
<summary>
<h3>
<img icon src="/assets/icons/iceshrimp.svg" alt="">
Iceshrimp.NET
<span status>
<img src="https://status.synth.download/api/badge/9/status?style=flat-square" alt="">
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>Lightweight, Misskey-inspired software for the <a href="https://fediverse.info">Fediverse</a>.</p>
<p info><icon-tabler info-circle aria-label="Information"></icon-tabler> Accounts are located at <span>@synth.download</span></p>
<p warning><icon-tabler alert-triangle aria-label="Warning"></icon-tabler> We currently do not suggest using this software. Sharkey and Mastodon provide better and more stable user experiences.</p>
<buttons-container>
<a button href="https://beeping.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="/fediverse" aria-label="Information">
<icon-tabler info-circle></icon-tabler>
</a>
<a button href="https://iceshrimp.dev/iceshrimp/iceshrimp.net" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a right button i2p href="http://synthrfmxti7rfwfh4gg6n5qiwbt6x52qudys4hql6eafb6qexoa.b32.i2p" aria-label="I2P">
<icon-tabler vector></icon-tabler>
</a>
<a button yggdrasil href="http://beeping.ygg.synth.download" aria-label="Yggdrasil">
<icon-tabler leaf></icon-tabler>
</a>
<a button tor href="http://beeping.synth3ty6s54waoilizkfdgt2ry4fxdaoxgen5yp6ymeeytjbtvlgtyd.onion" aria-label="Tor">
<icon-tabler spiral></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details pds>
<summary>
<h3>
<img icon src="/assets/synth.download/icons/atproto.svg" alt="">
PDS
<span status>
<img src="https://status.synth.download/api/badge/11/status?style=flat-square" alt="">
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc><b>P</b>ersonal <b>D</b>ata <b>S</b>erver, used to store your profile data and interact with applications in the <a href="https://atproto.com">Atmosphere</a>, such as <a href="https://bsky.app">Bluesky</a>.</p>
<buttons-container>
<a button href="https://pds.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/bluesky-social/pds" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details pl-fe>
<summary>
<h3>
<img icon src="/assets/synth.download/icons/pl-fe.svg" alt="">
pl-fe
<span status>
<icon-tabler device-desktop-cog aria-label="Client-side service, serves as a client or frontend where all data is accessed and stored on the users device."></icon-tabler>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>General fediverse compatible client, using a baseline of the Mastodon API with extended support for more APIs and features from other softwares.</small></p>
<buttons-container>
<a button href="https://pl-fe.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://codeberg.org/mkljczk/pl-fe" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details phanpy>
<summary>
<h3>
<img icon src="/assets/icons/phanpy.svg" alt="">
Phanpy
<span status>
<icon-tabler device-desktop-cog aria-label="Client-side service, serves as a client or frontend where all data is accessed and stored on the users device."></icon-tabler>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler planet aria-label="Public"></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>Opinionated Mastodon-API compatible fediverse client. <small>Our own fork with improved support for extra features, such as emoji reactions.</small></p>
<buttons-container>
<a button href="https://phanpy.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/zenfyrdev/phanpy" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details askjs>
<summary>
<h3>
<img icon src="/assets/synth.download/icons/ask.svg" alt="">
AskJS
<span status>
<img src="https://status.synth.download/api/badge/16/status?style=flat-square" alt="">
<icon-tabler mood-smile aria-label="Fun"></icon-tabler>
<icon-tabler social aria-label="Social"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>Anonymous asking site to ask users questions.</p>
<buttons-container>
<a button href="https://asking.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/ihateblueb/ask-js" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details xmpp>
<summary>
<h3>
<img icon src="/assets/icons/xmpp.svg" alt="">
XMPP
<span status>
<img src="https://status.synth.download/api/badge/13/status?style=flat-square" alt="">
<icon-tabler message aria-label="Chat"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>Our <a href="https://ejabberd.im">Ejabberd</a> server, for the <a href="https://xmpp.org">XMPP chat protocol</a>.</p>
<buttons-container>
<a button href="https://github.com/processone/ejabberd" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
<a href="https://compliance.conversations.im/server/synth.download"><img src="https://compliance.conversations.im/badge/synth.download" alt="XMPP Specifications compliance: 100%"></a>
</buttons-container>
</details-content>
</details>
<details forgejo>
<summary>
<h3>
<img icon src="/assets/icons/forgejo.svg" alt="">
Forgejo
<span status>
<img src="https://status.synth.download/api/badge/12/status?style=flat-square" alt="">
<icon-tabler brand-git aria-label="Git"></icon-tabler>
<icon-tabler database-share aria-label="Sharing"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>Self-hosted Git forge for storing code repositories.</p>
<buttons-container>
<a button href="https://forged.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://codeberg.org/forgejo/forgejo" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details vaultwarden>
<summary>
<h3>
<img icon src="/assets/icons/vaultwarden.svg" alt="">
Vaultwarden
<span status>
<img src="https://status.synth.download/api/badge/24/status?style=flat-square" alt="">
<icon-tabler user aria-label="Personal"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>A Bitwarden-compatible password manager, hosted by us.</p>
<buttons-container>
<a button href="https://vault.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/dani-garcia/vaultwarden" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
<details freshrss>
<summary>
<h3>
<img icon src="/assets/icons/freshrss.svg" alt="">
FreshRSS
<span status>
<img src="https://status.synth.download/api/badge/15/status?style=flat-square" alt="">
<icon-tabler user aria-label="Personal"></icon-tabler>
<icon-tabler lock aria-label="Private, requires user registration for full access or complete usage. Refer to the information page, if linked."></icon-tabler>
</span>
</h3>
</summary>
<details-content>
<p desc>An online RSS reader and news aggregator.</p>
<buttons-container>
<a button href="https://rss.synth.download" aria-label="Go">
<icon-tabler arrow-forward></icon-tabler>
</a>
<a button href="https://github.com/FreshRSS/FreshRSS" aria-label="Source">
<icon-tabler brand-git></icon-tabler>
</a>
</buttons-container>
</details-content>
</details>
</card-container>

45
_includes/styles/base/base.css
View file

@ -357,7 +357,9 @@ card-container {
display: grid;
gap: 1.2rem;
grid-template-columns: repeat(auto-fill, minmax(19rem, 1fr));
grid-template-rows: masonry;
/* regular card entries */
card-entry {
background-color: var(--background-secondary);
border-radius: 1rem;
@ -367,16 +369,54 @@ card-container {
height: auto;
padding: .6rem;
width: auto;
}
/* detail elements */
details {
background-color: var(--background-secondary);
border-radius: 1rem;
border: .15rem solid var(--border);
height: fit-content;
min-width: 19rem;
transition: .2s;
width: auto;
details-content {
display: block;
padding: .6rem;
}
summary {
border-radius: 1rem;
cursor: pointer;
outline: 0 solid var(--accent);
padding: .6rem;
transition: .3s;
&:hover { outline: .2rem solid var(--accent); }
&::marker { content: ""; }
h3 { margin: 0; padding-bottom: 0; }
}
&[open] {
border-color: color-mix(in srgb, var(--warning) 50%, transparent);
summary {
border-bottom: .15rem solid var(--border);
}
}
}
card-entry, details {
h3 {
border-bottom: unset;
display: inline;
margin-bottom: 1rem;
margin-top: 0;
vertical-align: top;
[icon] {
height: 1.4rem;
transition: .3s;
vertical-align: top;
vertical-align: inherit;
}
span[status] {
@ -398,7 +438,6 @@ card-container {
align-self: center;
border-radius: 10rem;
height: 1.2rem;
vertical-align: middle;
width: auto;
}
}
@ -407,7 +446,7 @@ card-container {
&:hover {
h3 {
[icon] {
margin-right: .4rem;
margin-right: .6rem;
transform: rotate(15deg) scale(2.5) translateX(-.1rem) translateY(-.2rem);
}
}

60
_includes/styles/pages/services.css
View file

@ -22,71 +22,91 @@ article#services {
/* frontends */
&:not(:has(input#service-frontend:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[cloud-network]) {
display: none;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[cloud-network]) {
display: none;
}
}
}
/* search */
&:not(:has(input#service-search:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[search]) {
display: none;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[search]) {
display: none;
}
}
}
/* social */
&:not(:has(input#service-social:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[social]) {
display: none;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[social]) {
display: none;
}
}
}
/* fun */
&:not(:has(input#service-fun:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[mood-smile]) {
display: none;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[mood-smile]) {
display: none;
}
}
}
/* chat */
&:not(:has(input#service-chat:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[message]) {
display: none;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[message]) {
display: none;
}
}
}
/* sharing */
&:not(:has(input#service-sharing:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[database-share]) {
display: none;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[database-share]) {
display: none;
}
}
}
/* git */
&:not(:has(input#service-git:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[brand-git]) {
display: none;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[brand-git]) {
display: none;
}
}
}
/* personal */
&:not(:has(input#service-personal:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[user]) {
display: none;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[user]) {
display: none;
}
}
}
/* public */
&:not(:has(input#service-public:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[planet]) {
display: none !important;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[planet]) {
display: none !important;
}
}
}
/* private */
&:not(:has(input#service-private:checked)) {
card-container card-entry:has(h3 span[status] icon-tabler[lock]) {
display: none !important;
card-container card-entry, card-container details {
&:has(h3 span[status] icon-tabler[lock]) {
display: none !important;
}
}
}
}