mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
Show continue buttons
This commit is contained in:
ernstmul
+1
-1
@@ -23,7 +23,7 @@
|
||||
"@appwrite.io/pink-icons": "0.25.0",
|
||||
"@appwrite.io/pink-icons-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@5eac713f",
|
||||
"@appwrite.io/pink-legacy": "^1.0.0",
|
||||
"@appwrite.io/pink-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@aaddf2c",
|
||||
"@appwrite.io/pink-svelte": "https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@1a93110",
|
||||
"@popperjs/core": "^2.11.8",
|
||||
"@sentry/sveltekit": "^8.38.0",
|
||||
"@stripe/stripe-js": "^3.5.0",
|
||||
|
||||
Generated
+12
-12
@@ -21,8 +21,8 @@ importers:
|
||||
specifier: ^1.0.0
|
||||
version: 1.0.0
|
||||
'@appwrite.io/pink-svelte':
|
||||
specifier: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@aaddf2c
|
||||
version: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@aaddf2c(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)
|
||||
specifier: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@1a93110
|
||||
version: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@1a93110(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)
|
||||
'@popperjs/core':
|
||||
specifier: ^2.11.8
|
||||
version: 2.11.8
|
||||
@@ -215,14 +215,14 @@ packages:
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@eeed8db}
|
||||
version: 1.2.1
|
||||
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@5eac713f':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@5eac713f}
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@1a93110d12e6db2cd24e6c4800a06613645859b6':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@1a93110d12e6db2cd24e6c4800a06613645859b6}
|
||||
version: 1.0.0-next.7
|
||||
peerDependencies:
|
||||
svelte: ^4.0.0
|
||||
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@aaddf2cd3c8d192642abb60a2704c2067724977c':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@aaddf2cd3c8d192642abb60a2704c2067724977c}
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@5eac713f':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@5eac713f}
|
||||
version: 1.0.0-next.7
|
||||
peerDependencies:
|
||||
svelte: ^4.0.0
|
||||
@@ -236,8 +236,8 @@ packages:
|
||||
'@appwrite.io/pink-legacy@1.0.0':
|
||||
resolution: {integrity: sha512-EZk/wX8oDhIsCXf2A0oQjdNOaHvh5MnWbLQI4pAiGrdy5qQGPoU19AK6iVX6z3QoOq7geoEu0zVwAowBy5hZbQ==}
|
||||
|
||||
'@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@aaddf2c':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@aaddf2c}
|
||||
'@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@1a93110':
|
||||
resolution: {tarball: https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@1a93110}
|
||||
version: 1.0.0-next.85
|
||||
peerDependencies:
|
||||
react-dom: ^18.0.0
|
||||
@@ -4086,11 +4086,11 @@ snapshots:
|
||||
|
||||
'@appwrite.io/console@https://pkg.pr.new/appwrite/appwrite/@appwrite.io/console@eeed8db': {}
|
||||
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@5eac713f(svelte@4.2.19)':
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@1a93110d12e6db2cd24e6c4800a06613645859b6(svelte@4.2.19)':
|
||||
dependencies:
|
||||
svelte: 4.2.19
|
||||
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@aaddf2cd3c8d192642abb60a2704c2067724977c(svelte@4.2.19)':
|
||||
'@appwrite.io/pink-icons-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@5eac713f(svelte@4.2.19)':
|
||||
dependencies:
|
||||
svelte: 4.2.19
|
||||
|
||||
@@ -4103,9 +4103,9 @@ snapshots:
|
||||
'@appwrite.io/pink-icons': 1.0.0
|
||||
the-new-css-reset: 1.11.3
|
||||
|
||||
'@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@aaddf2c(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)':
|
||||
'@appwrite.io/pink-svelte@https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-svelte@1a93110(react-dom@18.3.1(react@18.3.1))(svelte@4.2.19)':
|
||||
dependencies:
|
||||
'@appwrite.io/pink-icons-svelte': https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@aaddf2cd3c8d192642abb60a2704c2067724977c(svelte@4.2.19)
|
||||
'@appwrite.io/pink-icons-svelte': https://pkg.pr.new/appwrite/pink/@appwrite.io/pink-icons-svelte@1a93110d12e6db2cd24e6c4800a06613645859b6(svelte@4.2.19)
|
||||
'@floating-ui/dom': 1.6.13
|
||||
'@melt-ui/pp': 0.3.2(@melt-ui/svelte@0.86.2(svelte@4.2.19))(svelte@4.2.19)
|
||||
'@melt-ui/svelte': 0.86.2(svelte@4.2.19)
|
||||
|
||||
@@ -8,7 +8,8 @@
|
||||
Typography,
|
||||
Badge,
|
||||
Spinner,
|
||||
ProgressCircle
|
||||
ProgressCircle,
|
||||
Button
|
||||
} from '@appwrite.io/pink-svelte';
|
||||
import { addPlatform, continuePlatform } from './platforms/+page.svelte';
|
||||
import { app } from '$lib/stores/app';
|
||||
@@ -97,27 +98,42 @@
|
||||
openPlatformWizard(0, platformMap.get('Web'));
|
||||
}}
|
||||
padding="s"
|
||||
><Layout.Stack gap="xl"
|
||||
><Layout.Stack
|
||||
gap={platformMap.has('Web') ? 'm' : 'xl'}
|
||||
height="100%"
|
||||
justifyContent="space-between"
|
||||
><div class="card-top-image web-image-light"></div>
|
||||
<div class="card-top-image web-image-dark"></div>
|
||||
{#if !platformMap.has('Web')}
|
||||
<Badge
|
||||
size="s"
|
||||
variant="secondary"
|
||||
content="In progress">
|
||||
<div slot="start">
|
||||
<ProgressCircle size="s" progress={33} />
|
||||
</div>
|
||||
</Badge>
|
||||
{#if platformMap.has('Web')}
|
||||
<Layout.Stack alignItems="flex-start">
|
||||
<Badge
|
||||
size="s"
|
||||
variant="secondary"
|
||||
content="In progress">
|
||||
<div
|
||||
slot="start"
|
||||
style:margin="-4px 4px 0 0">
|
||||
<ProgressCircle
|
||||
size="xs"
|
||||
showAnimation={false}
|
||||
backgroundStrokeColor="--progress-background-color"
|
||||
progress={33} />
|
||||
</div>
|
||||
</Badge>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
alignItems="center"
|
||||
justifyContent="space-between">
|
||||
<Typography.Title size="s">Web</Typography.Title>
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div>
|
||||
{#if platformMap.has('Web')}<Button.Button size="xs"
|
||||
>Continue</Button.Button
|
||||
>{:else}
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Layout.Stack></Card.Button>
|
||||
<Card.Button
|
||||
@@ -125,20 +141,45 @@
|
||||
openPlatformWizard(4, platformMap.get('React Native'));
|
||||
}}
|
||||
padding="s"
|
||||
><Layout.Stack gap="xl"
|
||||
><div class="card-top-image reactnative-image-light">
|
||||
><Layout.Stack
|
||||
gap={platformMap.has('React Native') ? 'm' : 'xl'}
|
||||
height="100%"
|
||||
justifyContent="space-between">
|
||||
<div class="card-top-image reactnative-image-light">
|
||||
</div>
|
||||
<div class="card-top-image reactnative-image-dark">
|
||||
</div>
|
||||
{#if platformMap.has('React Native')}
|
||||
<Layout.Stack alignItems="flex-start">
|
||||
<Badge
|
||||
size="s"
|
||||
variant="secondary"
|
||||
content="In progress">
|
||||
<div
|
||||
slot="start"
|
||||
style:margin="-4px 4px 0 0">
|
||||
<ProgressCircle
|
||||
size="xs"
|
||||
showAnimation={false}
|
||||
backgroundStrokeColor="--progress-background-color"
|
||||
progress={33} />
|
||||
</div>
|
||||
</Badge>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
alignItems="center"
|
||||
justifyContent="space-between">
|
||||
<Typography.Title size="s"
|
||||
>React Native</Typography.Title>
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div>
|
||||
{#if platformMap.has('React Native')}<Button.Button
|
||||
size="xs">Continue</Button.Button
|
||||
>{:else}
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div>
|
||||
{/if}
|
||||
</Layout.Stack>
|
||||
</Layout.Stack></Card.Button>
|
||||
</Layout.Stack>
|
||||
@@ -150,21 +191,46 @@
|
||||
openPlatformWizard(3, platformMap.get('Apple'));
|
||||
}}
|
||||
padding="s">
|
||||
<Layout.Stack gap="xxl">
|
||||
<Layout.Stack
|
||||
gap={platformMap.has('Apple') ? 's' : 'xxl'}
|
||||
height="100%"
|
||||
justifyContent="space-between">
|
||||
<img
|
||||
class="platform-image"
|
||||
src={$app.themeInUse === 'dark'
|
||||
? PlatformIosImgSourceDark
|
||||
: PlatformIosImgSource}
|
||||
alt="" />
|
||||
{#if platformMap.has('Apple')}
|
||||
<Layout.Stack alignItems="flex-start">
|
||||
<Badge
|
||||
size="s"
|
||||
variant="secondary"
|
||||
content="In progress">
|
||||
<div
|
||||
slot="start"
|
||||
style:margin="-4px 4px 0 0">
|
||||
<ProgressCircle
|
||||
size="xs"
|
||||
showAnimation={false}
|
||||
backgroundStrokeColor="--progress-background-color"
|
||||
progress={33} />
|
||||
</div>
|
||||
</Badge>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
alignItems="center"
|
||||
justifyContent="space-between">
|
||||
<Typography.Title size="s">Apple</Typography.Title>
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div></Layout.Stack>
|
||||
{#if platformMap.has('Apple')}<Button.Button
|
||||
size="xs">Continue</Button.Button
|
||||
>{:else}
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div>
|
||||
{/if}</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card.Button>
|
||||
<Card.Button
|
||||
@@ -172,22 +238,47 @@
|
||||
openPlatformWizard(2, platformMap.get('Android'));
|
||||
}}
|
||||
padding="s">
|
||||
<Layout.Stack gap="xxl">
|
||||
<Layout.Stack
|
||||
gap={platformMap.has('Android') ? 's' : 'xxl'}
|
||||
height="100%"
|
||||
justifyContent="space-between">
|
||||
<img
|
||||
class="platform-image"
|
||||
src={$app.themeInUse === 'dark'
|
||||
? PlatformAndroidImgSourceDark
|
||||
: PlatformAndroidImgSource}
|
||||
alt="" />
|
||||
{#if platformMap.has('Android')}
|
||||
<Layout.Stack alignItems="flex-start">
|
||||
<Badge
|
||||
size="s"
|
||||
variant="secondary"
|
||||
content="In progress">
|
||||
<div
|
||||
slot="start"
|
||||
style:margin="-4px 4px 0 0">
|
||||
<ProgressCircle
|
||||
size="xs"
|
||||
showAnimation={false}
|
||||
backgroundStrokeColor="--progress-background-color"
|
||||
progress={33} />
|
||||
</div>
|
||||
</Badge>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
alignItems="center"
|
||||
justifyContent="space-between">
|
||||
<Typography.Title size="s"
|
||||
>Android</Typography.Title>
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div></Layout.Stack>
|
||||
{#if platformMap.has('Android')}<Button.Button
|
||||
size="xs">Continue</Button.Button
|
||||
>{:else}
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div>
|
||||
{/if}</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card.Button>
|
||||
<Card.Button
|
||||
@@ -195,22 +286,47 @@
|
||||
openPlatformWizard(1, platformMap.get('Flutter'));
|
||||
}}
|
||||
padding="s">
|
||||
<Layout.Stack gap="xxl">
|
||||
<Layout.Stack
|
||||
gap={platformMap.has('Flutter') ? 's' : 'xxl'}
|
||||
height="100%"
|
||||
justifyContent="space-between">
|
||||
<img
|
||||
class="platform-image"
|
||||
src={$app.themeInUse === 'dark'
|
||||
? PlatformFlutterImgSourceDark
|
||||
: PlatformFlutterImgSource}
|
||||
alt="" />
|
||||
{#if platformMap.has('Flutter')}
|
||||
<Layout.Stack alignItems="flex-start">
|
||||
<Badge
|
||||
size="s"
|
||||
variant="secondary"
|
||||
content="In progress">
|
||||
<div
|
||||
slot="start"
|
||||
style:margin="-4px 4px 0 0">
|
||||
<ProgressCircle
|
||||
size="xs"
|
||||
showAnimation={false}
|
||||
backgroundStrokeColor="--progress-background-color"
|
||||
progress={33} />
|
||||
</div>
|
||||
</Badge>
|
||||
</Layout.Stack>
|
||||
{/if}
|
||||
<Layout.Stack
|
||||
direction="row"
|
||||
alignItems="center"
|
||||
justifyContent="space-between">
|
||||
<Typography.Title size="s"
|
||||
>Flutter</Typography.Title>
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div></Layout.Stack>
|
||||
{#if platformMap.has('Flutter')}<Button.Button
|
||||
size="xs">Continue</Button.Button
|
||||
>{:else}
|
||||
<div class="arrow-icon">
|
||||
<Icon icon={IconArrowRight} size="s" />
|
||||
</div>
|
||||
{/if}</Layout.Stack>
|
||||
</Layout.Stack>
|
||||
</Card.Button>
|
||||
</Layout.Stack>
|
||||
@@ -403,6 +519,7 @@
|
||||
@use '@appwrite.io/pink-legacy/src/abstract/variables/devices';
|
||||
|
||||
:global(.theme-light) {
|
||||
--progress-background-color: var(--neutral-200);
|
||||
.web-image-dark,
|
||||
.reactnative-image-dark {
|
||||
display: none;
|
||||
@@ -410,6 +527,7 @@
|
||||
}
|
||||
|
||||
:global(.theme-dark) {
|
||||
--progress-background-color: var(--neutral-600);
|
||||
.web-image-light,
|
||||
.reactnative-image-light {
|
||||
display: none;
|
||||
|
||||
Reference in New Issue
Block a user