diff options
Diffstat (limited to 'web/template')
| -rw-r--r-- | web/template/about.tmpl | 178 | ||||
| -rw-r--r-- | web/template/index.tmpl | 8 | ||||
| -rw-r--r-- | web/template/index_apps.tmpl | 182 |
3 files changed, 207 insertions, 161 deletions
diff --git a/web/template/about.tmpl b/web/template/about.tmpl index a23dfa953..46349a4c3 100644 --- a/web/template/about.tmpl +++ b/web/template/about.tmpl @@ -21,7 +21,15 @@ {{- if .instance.Description }} {{ .instance.Description | noescape }} {{- else }} -<p>No description has yet been set for this instance.<p> +<p>No description has yet been set for this instance.</p> +{{- end }} +{{- end -}} + +{{- define "termsAndConditions" -}} +{{- if .instance.Terms }} +{{ .instance.Terms | noescape }} +{{- else }} +<p>No terms and conditions have yet been set for this instance.</p> {{- end }} {{- end -}} @@ -60,90 +68,124 @@ Polls can have up to {{- with . }} <main class="about"> + <nav class="about-section" aria-labelledby="toc"> + <h3 id="toc">Table of Contents</h3> + <div class="about-section-contents"> + <ol> + <li><a href="#about">About {{ .instance.Title -}}</a></li> + <li><a href="#contact">Contact</a></li> + <li><a href="#features">Features</a></li> + <li><a href="#languages">Languages</a></li> + <li><a href="#rules">Rules</a></li> + <li><a href="#terms">Terms and Conditions</a></li> + <li><a href="#moderated-servers">Moderated Servers</a></li> + </ol> + </div> + </nav> <section class="about-section" role="region" aria-labelledby="about"> <h3 id="about">About {{ .instance.Title -}}</h3> - {{- with . }} - {{- include "description" . | indent 2 }} - {{- end }} + <div class="about-section-contents"> + {{- with . }} + {{- include "description" . | indent 3 }} + {{- end }} + </div> </section> <section class="about-section" role="region" aria-labelledby="contact"> <h3 id="contact">Admin Contact</h3> - {{- if .instance.ContactAccount }} - <a href="{{- .instance.ContactAccount.URL -}}" class="account-card"> - <img class="avatar" src="{{- .instance.ContactAccount.Avatar -}}" alt=""/> - <h3> - {{- if .instance.ContactAccount.DisplayName -}} - {{- emojify .instance.ContactAccount.Emojis (escape .instance.ContactAccount.DisplayName) -}} - {{- else -}} - {{- .instance.ContactAccount.Username -}} - {{- end -}} - </h3> - <span>@{{- .instance.ContactAccount.Username -}}</span> - </a> - {{- else }} - <p>This instance has not yet set a contact account.</p> - {{- end }} - {{- if .instance.Email }} - <p>Email: <a href="mailto:{{- .instance.Email -}}">{{- .instance.Email -}}</a></p> - {{- else }} - <p>This instance has not yet set a contact email address.</p> - {{- end }} + <div class="about-section-contents"> + {{- if .instance.ContactAccount }} + <a href="{{- .instance.ContactAccount.URL -}}" class="account-card"> + <img class="avatar" src="{{- .instance.ContactAccount.Avatar -}}" alt=""/> + <h3> + {{- if .instance.ContactAccount.DisplayName -}} + {{- emojify .instance.ContactAccount.Emojis (escape .instance.ContactAccount.DisplayName) -}} + {{- else -}} + {{- .instance.ContactAccount.Username -}} + {{- end -}} + </h3> + <span>@{{- .instance.ContactAccount.Username -}}</span> + </a> + {{- else }} + <p>This instance has not yet set a contact account.</p> + {{- end }} + {{- if .instance.Email }} + <p>Email: <a href="mailto:{{- .instance.Email -}}">{{- .instance.Email -}}</a></p> + {{- else }} + <p>This instance has not yet set a contact email address.</p> + {{- end }} + </div> + </section> + <section class="about-section" role="region" aria-labelledby="features"> + <h3 id="features">Instance Features</h3> + <div class="about-section-contents"> + <ul> + <li>{{- template "registrationLimits" . -}}</li> + <li>{{- template "customCSSLimits" . -}}</li> + <li>{{- template "statusLimits" . -}}</li> + <li>{{- template "pollLimits" . -}}</li> + </ul> + </div> </section> <section class="about-section" role="region" aria-labelledby="languages"> <h3 id="languages">Languages</h3> - {{- if .languages }} - <p>This instance prefers the following languages:</p> - <ol> - {{- range .languages }} - <li>{{- . -}}</li> + <div class="about-section-contents"> + {{- if .languages }} + <p>This instance prefers the following languages:</p> + <ol> + {{- range .languages }} + <li>{{- . -}}</li> + {{- end }} + </ol> + {{- else }} + <p>This instance does not have any preferred languages.</p> {{- end }} - </ol> - {{- else }} - <p>This instance does not have any preferred languages.</p> - {{- end }} + </div> </section> <section class="about-section" role="region" aria-labelledby="rules"> <h3 id="rules">Instance Rules</h3> - <p>This instance has the following rules:</p> - {{- if .instance.Rules }} - <ol> - {{- range .instance.Rules }} - <li>{{- .Text -}}</li> + <div class="about-section-contents"> + <p>This instance has the following rules:</p> + {{- if .instance.Rules }} + <ol> + {{- range .instance.Rules }} + <li>{{- .Text -}}</li> + {{- end }} + </ol> + {{- else }} + <p>This instance has not yet set any rules.</p> {{- end }} - </ol> - {{- else }} - <p>This instance has not yet set any rules.</p> - {{- end }} + </div> </section> - <section class="about-section" role="region" aria-labelledby="features"> - <h3 id="features">Instance Features</h3> - <ul> - <li>{{- template "registrationLimits" . -}}</li> - <li>{{- template "customCSSLimits" . -}}</li> - <li>{{- template "statusLimits" . -}}</li> - <li>{{- template "pollLimits" . -}}</li> - </ul> + <section class="about-section" role="region" aria-labelledby="terms"> + <h3 id="terms">Terms and Conditions</h3> + <div class="about-section-contents"> + {{- with . }} + {{- include "termsAndConditions" . | indent 3 }} + {{- end }} + </div> </section> <section class="about-section" role="region" aria-labelledby="moderated-servers"> <h3 id="moderated-servers">Moderated servers</h3> - <p> - ActivityPub instances federate with other instances by exchanging data with them over the network. - Exchanged data includes things like accounts, statuses, likes, boosts, and media attachments. - This exchange of data can prevented for instances on specific domains via a domain block created - by an instance admin. When an instance is domain blocked by another instance: - </p> - <ul> - <li>Any existing data from the blocked instance is deleted from the storage of the instance doing the blocking.</li> - <li>Interaction between the two instances is cut off in both directions; neither instance can interact with the other.</li> - <li>No new data from the blocked instance will be created on the instance that blocks it.</li> - </ul> - <p> - {{- if .blocklistExposed }} - <a href="/about/suspended">View the list of domains blocked by this instance</a> - {{- else }} - This instance does not publically share their list of blocked domains. - {{- end }} - </p> + <div class="about-section-contents"> + <p> + ActivityPub instances federate with other instances by exchanging data with them over the network. + Exchanged data includes things like accounts, statuses, likes, boosts, and media attachments. + This exchange of data can prevented for instances on specific domains via a domain block created + by an instance admin. When an instance is domain blocked by another instance: + </p> + <ul> + <li>Any existing data from the blocked instance is deleted from the storage of the instance doing the blocking.</li> + <li>Interaction between the two instances is cut off in both directions; neither instance can interact with the other.</li> + <li>No new data from the blocked instance will be created on the instance that blocks it.</li> + </ul> + <p> + {{- if .blocklistExposed }} + <a href="/about/suspended">View the list of domains blocked by this instance</a> + {{- else }} + This instance does not publically share their list of blocked domains. + {{- end }} + </p> + </div> </section> </main> {{- end }}
\ No newline at end of file diff --git a/web/template/index.tmpl b/web/template/index.tmpl index f27cf8570..7e7b7118e 100644 --- a/web/template/index.tmpl +++ b/web/template/index.tmpl @@ -21,7 +21,7 @@ {{- if .instance.ShortDescription }} {{ .instance.ShortDescription | noescape }} {{- else }} -<p>No short description has yet been set for this instance.<p> +<p>No short description has yet been set for this instance.</p> {{- end }} {{- end -}} @@ -29,8 +29,10 @@ <main class="about"> <section class="about-section" role="region" aria-labelledby="about"> <h3 id="about">About this instance</h3> - {{- include "shortDescription" . | indent 2 }} - <a href="/about">See more details</a> + <div class="about-section-contents"> + {{- include "shortDescription" . | indent 3 }} + <a href="/about">See more details</a> + </div> </section> {{- include "index_apps.tmpl" . | indent 1 }} </main> diff --git a/web/template/index_apps.tmpl b/web/template/index_apps.tmpl index 05a4a9517..bb835c4da 100644 --- a/web/template/index_apps.tmpl +++ b/web/template/index_apps.tmpl @@ -20,96 +20,98 @@ {{- with . }} <section role="region" class="about-section apps" aria-labelledby="apps"> <h3 id="apps">Client applications</h3> - <p> - GoToSocial does not provide its own webclient, but implements the Mastodon client API. - You can use this server through a variety of other clients: - </p> - <ul class="applist nodot" role="group"> - <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" + <div class="about-section-contents"> + <p> + GoToSocial does not provide its own webclient, but implements the Mastodon client API. + You can use this server through a variety of other clients: + </p> + <ul class="applist nodot" role="group"> + <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" + > + 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" > - 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" - > - <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> - </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" - > - Get Tusky - </a> - </div> - <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" - /> - </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://fedi.software/@Feditext" - rel="nofollow noreferrer noopener" - target="_blank" - > - Get Feditext - </a> - </div> - <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" - /> - </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" - > - Get Mastodon apps - </a> - </div> - <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" - /> - </li> - </ul> + <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> + </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" + > + Get Tusky + </a> + </div> + <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" + /> + </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://fedi.software/@Feditext" + rel="nofollow noreferrer noopener" + target="_blank" + > + Get Feditext + </a> + </div> + <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" + /> + </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" + > + Get Mastodon apps + </a> + </div> + <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" + /> + </li> + </ul> + </div> </section> {{- end }}
\ No newline at end of file |