84 lines
1.8 KiB
Svelte
84 lines
1.8 KiB
Svelte
<script lang="ts">
|
|
import locale from "$lib/i18n/locale";
|
|
|
|
import { contacts } from "$lib/env";
|
|
import { t } from "$lib/i18n/translations";
|
|
|
|
import AboutSupport from "$components/about/AboutSupport.svelte";
|
|
|
|
let buttonContainerWidth: number;
|
|
</script>
|
|
|
|
<div id="support-page">
|
|
<div
|
|
id="support-buttons"
|
|
bind:offsetWidth={buttonContainerWidth}
|
|
|
|
class="two"
|
|
class:one={buttonContainerWidth < 500}
|
|
>
|
|
<AboutSupport
|
|
platform="github"
|
|
externalLink={contacts.github}
|
|
/>
|
|
|
|
{#if $locale === "ru"}
|
|
<AboutSupport
|
|
platform="telegram"
|
|
externalLink={contacts.telegram_ru}
|
|
/>
|
|
{:else}
|
|
<AboutSupport
|
|
platform="discord"
|
|
externalLink={contacts.discord}
|
|
/>
|
|
<AboutSupport
|
|
platform="twitter"
|
|
externalLink={contacts.twitter}
|
|
/>
|
|
<AboutSupport
|
|
platform="bluesky"
|
|
externalLink={contacts.bluesky}
|
|
/>
|
|
{/if}
|
|
</div>
|
|
|
|
<div class="subtext support-note">
|
|
{$t("about.support.description.issue")}
|
|
|
|
{#if $locale !== "ru"}
|
|
{$t("about.support.description.help")}
|
|
{/if}
|
|
|
|
{$t("about.support.description.best-effort")}
|
|
</div>
|
|
</div>
|
|
|
|
<style>
|
|
#support-page {
|
|
display: flex;
|
|
flex-direction: column;
|
|
gap: 18px;
|
|
}
|
|
|
|
#support-buttons {
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr;
|
|
overflow-x: scroll;
|
|
gap: var(--padding);
|
|
}
|
|
|
|
#support-buttons.two {
|
|
grid-template-columns: 1fr 1fr;
|
|
}
|
|
|
|
#support-buttons.one {
|
|
grid-template-columns: 1fr;
|
|
}
|
|
|
|
.support-note {
|
|
text-align: left;
|
|
padding: 0;
|
|
}
|
|
</style>
|