mirror of
https://github.com/immich-app/immich
synced 2025-11-07 17:27:20 +00:00
6e62c09d84
* feat: expand/collapse sidebar * fix: general PR cleanup - add skip link unit test - remove unused tailwind styles - adjust asset grid spacing - fix event propogation * fix: cleaning up event listeners * fix: purchase modal and button on small screens * fix: explicit tailwind classes * fix: no animation on initial page load * fix: sidebar spacing and reactivity * chore: reverting changes to icons in nav and account info panel * fix: remove left margin from the asset grid after merging in new timeline * chore: extract search-bar changes for a separate PR * fix: add margin to memories
44 lines
1.7 KiB
Svelte
44 lines
1.7 KiB
Svelte
<script lang="ts">
|
|
import Button from '$lib/components/elements/buttons/button.svelte';
|
|
import Icon from '$lib/components/elements/icon.svelte';
|
|
import { ImmichProduct } from '$lib/constants';
|
|
import { getLicenseLink } from '$lib/utils/license-utils';
|
|
import { mdiCheckCircleOutline, mdiServer } from '@mdi/js';
|
|
import { t } from 'svelte-i18n';
|
|
</script>
|
|
|
|
<!-- SERVER Purchase Options -->
|
|
<div
|
|
class="border border-gray-300 dark:border-gray-800 w-[min(375px,100%)] p-8 rounded-3xl bg-gray-100 dark:bg-gray-900"
|
|
>
|
|
<div class="text-immich-primary dark:text-immich-dark-primary">
|
|
<Icon path={mdiServer} size="56" />
|
|
<p class="font-semibold text-lg mt-1">{$t('purchase_server_title')}</p>
|
|
</div>
|
|
|
|
<div class="mt-4 dark:text-immich-gray">
|
|
<p class="text-6xl font-bold">$100</p>
|
|
<p>{$t('purchase_per_server')}</p>
|
|
</div>
|
|
|
|
<div class="flex flex-col justify-between h-[200px] dark:text-immich-gray">
|
|
<div class="mt-6 flex flex-col gap-1">
|
|
<div class="grid grid-cols-[36px_auto]">
|
|
<Icon path={mdiCheckCircleOutline} size="24" class="text-green-500 self-center" />
|
|
<p class="self-center">{$t('purchase_server_description_1')}</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-[36px_auto]">
|
|
<Icon path={mdiCheckCircleOutline} size="24" class="text-green-500 self-center" />
|
|
<p class="self-center">{$t('purchase_lifetime_description')}</p>
|
|
</div>
|
|
|
|
<div class="grid grid-cols-[36px_auto]">
|
|
<Icon path={mdiCheckCircleOutline} size="24" class="text-green-500 self-center" />
|
|
<p class="self-center">{$t('purchase_server_description_2')}</p>
|
|
</div>
|
|
</div>
|
|
|
|
<Button href={getLicenseLink(ImmichProduct.Server)} fullwidth>{$t('purchase_button_select')}</Button>
|
|
</div>
|
|
</div>
|