mirror of
https://github.com/immich-app/static-pages.git
synced 2026-09-30 13:23:05 +08:00
@@ -71,7 +71,7 @@
|
||||
</section>
|
||||
|
||||
{#if isLoading}
|
||||
<Card variant="subtle" color="secondary">
|
||||
<Card color="secondary">
|
||||
<CardBody>
|
||||
<section class="flex gap-2">
|
||||
<Text>Waiting for payment verification...</Text>
|
||||
|
||||
@@ -41,7 +41,7 @@
|
||||
</div>
|
||||
|
||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-2 l gap-4">
|
||||
<Card color="secondary" variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>Android</CardTitle>
|
||||
</CardHeader>
|
||||
@@ -66,7 +66,7 @@
|
||||
</CardBody>
|
||||
</Card>
|
||||
|
||||
<Card color="secondary" variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>iOS</CardTitle>
|
||||
</CardHeader>
|
||||
@@ -86,7 +86,7 @@
|
||||
</div>
|
||||
|
||||
<section class="grid auto-rows-fr grid-cols-1 md:grid-cols-2 lg:grid-cols-3 gap-4">
|
||||
<Card color="secondary" variant="subtle" class="h-full">
|
||||
<Card color="secondary" class="h-full">
|
||||
<CardHeader>
|
||||
<CardTitle>Docker Compose</CardTitle>
|
||||
<CardDescription>Run Immich on <Link href="https://www.docker.com/">Docker</Link></CardDescription>
|
||||
@@ -99,7 +99,7 @@
|
||||
</CardFooter>
|
||||
</Card>
|
||||
|
||||
<Card color="secondary" variant="subtle" class="h-full">
|
||||
<Card color="secondary" class="h-full">
|
||||
<CardHeader>
|
||||
<CardTitle>Portainer</CardTitle>
|
||||
<CardDescription>Run Immich on <Link href="https://www.portainer.io/">Portainer</Link></CardDescription>
|
||||
@@ -112,7 +112,7 @@
|
||||
</CardFooter>
|
||||
</Card>
|
||||
|
||||
<Card color="secondary" variant="subtle" class="h-full">
|
||||
<Card color="secondary" class="h-full">
|
||||
<CardHeader>
|
||||
<CardTitle>Unraid</CardTitle>
|
||||
<CardDescription>Run Immich on <Link href="https://unraid.net/">Unraid</Link></CardDescription>
|
||||
@@ -125,7 +125,7 @@
|
||||
</CardFooter>
|
||||
</Card>
|
||||
|
||||
<Card color="secondary" variant="subtle" class="h-full">
|
||||
<Card color="secondary" class="h-full">
|
||||
<CardHeader>
|
||||
<CardTitle>TrueNAS SCALE</CardTitle>
|
||||
<CardDescription
|
||||
|
||||
@@ -113,7 +113,7 @@
|
||||
<CodePreview code={spec}>
|
||||
<div class="flex flex-col lg:flex-row-reverse gap-2">
|
||||
<div>
|
||||
<Card variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>Settings</CardTitle>
|
||||
</CardHeader>
|
||||
@@ -144,7 +144,7 @@
|
||||
|
||||
<form class="grow">
|
||||
<Stack>
|
||||
<Card variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>Options</CardTitle>
|
||||
</CardHeader>
|
||||
@@ -158,7 +158,7 @@
|
||||
</Card>
|
||||
|
||||
{#if settings.customFolders}
|
||||
<Card variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>Custom Folders</CardTitle>
|
||||
</CardHeader>
|
||||
@@ -186,7 +186,7 @@
|
||||
</CardBody>
|
||||
</Card>
|
||||
{:else}
|
||||
<Card variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>Folders</CardTitle>
|
||||
</CardHeader>
|
||||
@@ -201,7 +201,7 @@
|
||||
{/if}
|
||||
|
||||
{#if settings.externalPostgres}
|
||||
<Card variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>External Postgres</CardTitle>
|
||||
</CardHeader>
|
||||
@@ -212,7 +212,7 @@
|
||||
</CardBody>
|
||||
</Card>
|
||||
{:else}
|
||||
<Card variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>Postgres</CardTitle>
|
||||
</CardHeader>
|
||||
@@ -244,7 +244,7 @@
|
||||
{/if}
|
||||
|
||||
{#if settings.externalRedis}
|
||||
<Card variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>External Redis</CardTitle>
|
||||
</CardHeader>
|
||||
|
||||
@@ -7,7 +7,6 @@
|
||||
Card,
|
||||
CardBody,
|
||||
CardDescription,
|
||||
CardFooter,
|
||||
CardHeader,
|
||||
CardTitle,
|
||||
Heading,
|
||||
@@ -58,33 +57,26 @@
|
||||
<Text>My Immich allows public links to link you to specific areas of your personal Immich instance.</Text>
|
||||
|
||||
<form onsubmit={handleSubmit}>
|
||||
<Card color="secondary" variant="subtle">
|
||||
<Card color="secondary">
|
||||
<CardHeader>
|
||||
<CardTitle>Instance URL</CardTitle>
|
||||
<CardDescription>This URL is only stored in your browser</CardDescription>
|
||||
</CardHeader>
|
||||
<CardBody>
|
||||
<section>
|
||||
<Stack gap={4}>
|
||||
<Input
|
||||
type="text"
|
||||
placeholder="https://demo.immich.app/"
|
||||
bind:value={instanceUrl}
|
||||
oninput={handleChange}
|
||||
/>
|
||||
</Stack>
|
||||
</section>
|
||||
<Stack gap={4}>
|
||||
<Input type="text" placeholder="https://demo.immich.app/" bind:value={instanceUrl} oninput={handleChange} />
|
||||
<div class="flex justify-end">
|
||||
<Button type="submit" class="w-full sm:w-auto" disabled={saved}>
|
||||
{#if saved}
|
||||
<Icon icon={mdiCheckCircleOutline} />
|
||||
Saved!
|
||||
{:else}
|
||||
{targetUrl ? 'Save & Redirect' : 'Save'}
|
||||
{/if}
|
||||
</Button>
|
||||
</div>
|
||||
</Stack>
|
||||
</CardBody>
|
||||
<CardFooter class="justify-end">
|
||||
<Button type="submit" class="w-full sm:w-auto" disabled={saved}>
|
||||
{#if saved}
|
||||
<Icon icon={mdiCheckCircleOutline} />
|
||||
Saved!
|
||||
{:else}
|
||||
{targetUrl ? 'Save & Redirect' : 'Save'}
|
||||
{/if}
|
||||
</Button>
|
||||
</CardFooter>
|
||||
</Card>
|
||||
</form>
|
||||
</Stack>
|
||||
|
||||
Generated
+4
-4
@@ -11,7 +11,7 @@
|
||||
"@mdi/js": "^7.4.47"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@immich/ui": "^0.9.0",
|
||||
"@immich/ui": "^0.10.0",
|
||||
"@sveltejs/adapter-static": "^3.0.6",
|
||||
"@sveltejs/kit": "^2.12.1",
|
||||
"@sveltejs/vite-plugin-svelte": "^5.0.2",
|
||||
@@ -696,9 +696,9 @@
|
||||
}
|
||||
},
|
||||
"node_modules/@immich/ui": {
|
||||
"version": "0.9.0",
|
||||
"resolved": "https://registry.npmjs.org/@immich/ui/-/ui-0.9.0.tgz",
|
||||
"integrity": "sha512-AmFyvBAzr59yJcaaxrBTSzRRw6MdpV2Tl/HsT5ff5Ntkcn4pDGgfjVGU8wLlS7PGBF395XudxvVmn51RIyubOA==",
|
||||
"version": "0.10.0",
|
||||
"resolved": "https://registry.npmjs.org/@immich/ui/-/ui-0.10.0.tgz",
|
||||
"integrity": "sha512-tdI6oHGgNzc8SnjT/qca8SLjJI62bo04RoGps8/+Bbyc4f3I05ja5Zj6fHR6q+OvFjqPO4MM86kRKfIfHjb/Fg==",
|
||||
"dev": true,
|
||||
"license": "GNU Affero General Public License version 3",
|
||||
"dependencies": {
|
||||
|
||||
+1
-1
@@ -15,7 +15,7 @@
|
||||
"format:fix": "prettier --write ."
|
||||
},
|
||||
"devDependencies": {
|
||||
"@immich/ui": "^0.9.0",
|
||||
"@immich/ui": "^0.10.0",
|
||||
"@sveltejs/adapter-static": "^3.0.6",
|
||||
"@sveltejs/kit": "^2.12.1",
|
||||
"@sveltejs/vite-plugin-svelte": "^5.0.2",
|
||||
|
||||
@@ -1,5 +1,5 @@
|
||||
<script lang="ts">
|
||||
import { Button, Card, CardBody, CardHeader, Heading, HStack, Icon } from '@immich/ui';
|
||||
import { Button, Card, Heading, HStack, Icon } from '@immich/ui';
|
||||
import { mdiPencilOutline, mdiXml } from '@mdi/js';
|
||||
import type { Snippet } from 'svelte';
|
||||
import { HighlightSvelte, LineNumbers } from 'svelte-highlight';
|
||||
@@ -23,33 +23,31 @@
|
||||
{@html atomOneDark}
|
||||
</svelte:head>
|
||||
|
||||
<Card color="primary">
|
||||
<CardHeader>
|
||||
<div class="flex justify-between">
|
||||
<Heading size="medium">docker-compose.yaml</Heading>
|
||||
<HStack gap={1} class="lg:border rounded-xl p-1">
|
||||
<Button
|
||||
disabled={viewMode === 'children'}
|
||||
onclick={handleToggle}
|
||||
size="small"
|
||||
class={viewMode === 'children' ? 'hidden md:flex' : ''}
|
||||
>
|
||||
<Icon icon={mdiPencilOutline} size="1.5em" />
|
||||
<span>Configure</span>
|
||||
</Button>
|
||||
<Button
|
||||
disabled={viewMode === 'code'}
|
||||
onclick={handleToggle}
|
||||
size="small"
|
||||
class={viewMode === 'code' ? 'hidden md:flex' : ''}
|
||||
>
|
||||
<Icon icon={mdiXml} size="1.5em" />
|
||||
<span>View</span>
|
||||
</Button>
|
||||
</HStack>
|
||||
</div>
|
||||
</CardHeader>
|
||||
<CardBody class={viewMode === 'code' ? 'p-0 pt-4' : ''}>
|
||||
<Card>
|
||||
<div class="flex justify-between items-center p-4">
|
||||
<Heading size="medium">docker-compose.yaml</Heading>
|
||||
<HStack gap={1} class="lg:border rounded-xl p-1">
|
||||
<Button
|
||||
disabled={viewMode === 'children'}
|
||||
onclick={handleToggle}
|
||||
size="small"
|
||||
class={viewMode === 'children' ? 'hidden md:flex' : ''}
|
||||
>
|
||||
<Icon icon={mdiPencilOutline} size="1.5em" />
|
||||
<span>Configure</span>
|
||||
</Button>
|
||||
<Button
|
||||
disabled={viewMode === 'code'}
|
||||
onclick={handleToggle}
|
||||
size="small"
|
||||
class={viewMode === 'code' ? 'hidden md:flex' : ''}
|
||||
>
|
||||
<Icon icon={mdiXml} size="1.5em" />
|
||||
<span>View</span>
|
||||
</Button>
|
||||
</HStack>
|
||||
</div>
|
||||
<div class={viewMode === 'children' ? 'px-4 pb-4' : ''}>
|
||||
{#if viewMode === 'children'}
|
||||
{@render children()}
|
||||
{:else}
|
||||
@@ -57,5 +55,5 @@
|
||||
<LineNumbers {highlighted} hideBorder wrapLines />
|
||||
</HighlightSvelte>
|
||||
{/if}
|
||||
</CardBody>
|
||||
</div>
|
||||
</Card>
|
||||
|
||||
@@ -26,7 +26,7 @@
|
||||
};
|
||||
</script>
|
||||
|
||||
<Card variant="subtle" {color}>
|
||||
<Card {color}>
|
||||
<CardHeader>
|
||||
<CardTitle size="tiny">{type} Product Key</CardTitle>
|
||||
</CardHeader>
|
||||
|
||||
Reference in New Issue
Block a user