refactor/split css, templates

This commit is contained in:
f0x 2024-11-05 15:53:22 +01:00
commit 70342681c1
54 changed files with 1371 additions and 1600 deletions

View file

@ -18,11 +18,11 @@
*/ -}}
{{- with . }}
<section role="region" class="about-section apps" aria-labelledby="apps">
<h3 id="apps">Client applications</h3>
<div class="about-section-contents">
<section role="region" class="apps" aria-labelledby="apps">
<h2 id="apps">Client applications</h2>
<div>
<p>
Have an account on this instance and want to log in?
Have an account on this instance and want to log in?
GoToSocial does not provide its own webclient, but implements the Mastodon client API.
You can use a variety of clients to log in to your account here:
</p>
@ -30,87 +30,51 @@
<li class="applist-entry">
<div class="applist-text">
<p><strong>Semaphore</strong> is a web client designed for speed and simplicity.</p>
<a
href="https://semaphore.social/"
rel="nofollow noreferrer noopener"
target="_blank"
>
<a href="https://semaphore.social/" rel="nofollow noreferrer noopener" target="_blank">
Use Semaphore
</a>
</div>
<svg
role="img"
aria-labelledby="semaphore-title semaphore-desc"
class="applist-logo redraw"
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 146 120"
width="100"
height="100"
>
<svg role="img" aria-labelledby="semaphore-title semaphore-desc" class="applist-logo redraw"
xmlns="http://www.w3.org/2000/svg" viewBox="0 0 146 120" width="100" height="100">
<title id="semaphore-title">The Semaphore logo</title>
<desc id="semaphore-desc">A waving flag</desc>
<path d="M68.13 0C53.94 0 42.81 20 13.9 27.1l-2.23-5.29a6.5 6.5 0 0 0-5.17-10.4 6.5 6.5 0 0 0-.81 12.95L46.2 120l5.99-2.5-14.42-33.33c22.8-6.86 32.51-22.16 49.83-20.58 9.9.9 4.87 19.56 8.11 17.93 16.22-8.15 32.44-11.41 50.29-11.41-7.96-9.78-17.38-20.55-22.71-31.74L120.8 32c-2.32-7.33-2.56-14.75.87-22.22-9.74-3.26-21.1 0-32.45 4.9C82.2 9.77 79.5 0 68.13 0zM15.26 30.42c8.95 6.63 13.63 13.86 16.07 20.94l1.62 6.32c1.24 6.58 1.07 12.8 1.27 18.03z"></path>
<path
d="M68.13 0C53.94 0 42.81 20 13.9 27.1l-2.23-5.29a6.5 6.5 0 0 0-5.17-10.4 6.5 6.5 0 0 0-.81 12.95L46.2 120l5.99-2.5-14.42-33.33c22.8-6.86 32.51-22.16 49.83-20.58 9.9.9 4.87 19.56 8.11 17.93 16.22-8.15 32.44-11.41 50.29-11.41-7.96-9.78-17.38-20.55-22.71-31.74L120.8 32c-2.32-7.33-2.56-14.75.87-22.22-9.74-3.26-21.1 0-32.45 4.9C82.2 9.77 79.5 0 68.13 0zM15.26 30.42c8.95 6.63 13.63 13.86 16.07 20.94l1.62 6.32c1.24 6.58 1.07 12.8 1.27 18.03z">
</path>
</svg>
</li>
<li class="applist-entry">
<div class="applist-text">
<p><strong>Tusky</strong> is a lightweight mobile client for Android.</p>
<a
href="https://tusky.app"
rel="nofollow noreferrer noopener"
target="_blank"
>
<a href="https://tusky.app" rel="nofollow noreferrer noopener" target="_blank">
Get Tusky
</a>
</div>
<img
class="applist-logo"
src="/assets/tusky.svg"
<img class="applist-logo" src="/assets/tusky.svg"
alt="The Tusky mascot, a cartoon elephant tooting happily"
title="The Tusky mascot, a cartoon elephant tooting happily"
width="100"
height="100"
/>
title="The Tusky mascot, a cartoon elephant tooting happily" width="100" height="100" />
</li>
<li class="applist-entry">
<div class="applist-text">
<p><strong>Feditext</strong> (beta) is a beautiful client for iOS, iPadOS and macOS.</p>
<a
href="https://github.com/feditext/feditext"
rel="nofollow noreferrer noopener"
target="_blank"
>
<a href="https://github.com/feditext/feditext" rel="nofollow noreferrer noopener" target="_blank">
Get Feditext
</a>
</div>
<img
class="applist-logo"
src="/assets/feditext.svg"
<img class="applist-logo" src="/assets/feditext.svg"
alt="The Feditext logo, the characters 'ft' at a slight angle"
title="The Feditext logo, the characters 'ft' at a slight angle"
width="100"
height="100"
/>
title="The Feditext logo, the characters 'ft' at a slight angle" width="100" height="100" />
</li>
<li class="applist-entry">
<div class="applist-text">
<p>Or try one of the <strong>Mastodon clients</strong> listed on the official Mastodon page.</p>
<a
href="https://joinmastodon.org/apps"
rel="nofollow noreferrer noopener"
target="_blank"
>
<a href="https://joinmastodon.org/apps" rel="nofollow noreferrer noopener" target="_blank">
Get Mastodon apps
</a>
</div>
<img
class="applist-logo"
src="/assets/mastodon.svg"
<img class="applist-logo" src="/assets/mastodon.svg"
alt="The Mastodon logo, the character 'M' in a speech bubble"
title="The Mastodon logo, the character 'M' in a speech bubble"
width="100"
height="100"
/>
title="The Mastodon logo, the character 'M' in a speech bubble" width="100" height="100" />
</li>
</ul>
</div>