Skip to content

Commit 5877267

Browse files
ernstmulernstmul
committed
Merge branch 'feat-pink-v2' into fix-feedback-changes
# Conflicts: # package.json # pnpm-lock.yaml
2 parents e1dfd36 + 759caca commit 5877267

File tree

166 files changed

+691
-789
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

166 files changed

+691
-789
lines changed

‎src/lib/components/filePicker.svelte

+4-9
Original file line numberDiff line numberDiff line change
@@ -20,11 +20,11 @@
2020
import FormList from '$lib/elements/forms/formList.svelte';
2121
import { writable } from 'svelte/store';
2222
import { onMount } from 'svelte';
23-
import Heading from './heading.svelte';
2423
import { clickOnEnter } from '$lib/helpers/a11y';
2524
import Empty from './empty.svelte';
2625
import { base } from '$app/paths';
2726
import { page } from '$app/stores';
27+
import { Typography } from '@appwrite.io/pink-svelte';
2828
2929
export let show: boolean;
3030
export let mimeTypeQuery: string = 'image/';
@@ -479,12 +479,9 @@
479479
--color-border="var(--color-neutral-15)">
480480
<div class="common-section">
481481
<div class="u-text-center common-section">
482-
<Heading
483-
size="7"
484-
tag="h2"
485-
trimmed={false}>
482+
<Typography.Title size="s">
486483
No files found within this bucket.
487-
</Heading>
484+
</Typography.Title>
488485
<p class="text u-line-height-1-5">
489486
Need a hand? Learn more in our <a
490487
class="link"
@@ -510,9 +507,7 @@
510507
--shadow-small="none"
511508
--color-border="var(--color-neutral-15)">
512509
<div class="u-text-center u-flex-vertical u-cross-center u-gap-24">
513-
<Heading size="7" tag="h2" trimmed={false}>
514-
No buckets found
515-
</Heading>
510+
<Typography.Title size="s">No buckets found</Typography.Title>
516511
<Button
517512
secondary
518513
external

‎src/lib/components/heading.svelte

-23
This file was deleted.

‎src/lib/components/index.ts

-1
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,6 @@ export { default as Tabs } from './tabs.svelte';
4646
export { default as Tab } from './tab.svelte';
4747
export { default as EventModal } from './eventModal.svelte';
4848
export { default as Status } from './status.svelte';
49-
export { default as Heading } from './heading.svelte';
5049
export { default as Output } from './output.svelte';
5150
export { default as Support } from './support.svelte';
5251
export { default as ViewSelector } from './viewSelector.svelte';

‎src/lib/components/searchQuery.svelte

-1
Original file line numberDiff line numberDiff line change
@@ -63,7 +63,6 @@
6363
{placeholder}
6464
{disabled}
6565
{required}
66-
type="search"
6766
bind:value={search}
6867
--color-bgcolor-neutral-default="var(--color-bgcolor-neutral-primary)">
6968
<svelte:fragment slot="start">

‎src/lib/elements/forms/inputSearch.svelte

-1
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,6 @@
4848
{required}
4949
{autofocus}
5050
{label}
51-
type="search"
5251
bind:value
5352
on:input={valueChange}>
5453
<svelte:fragment slot="start">

‎src/lib/layout/containerHeader.svelte

+3-5
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
<script lang="ts">
2-
import { Alert, DropList, Heading } from '$lib/components';
2+
import { Alert, DropList } from '$lib/components';
33
import { BillingPlan } from '$lib/constants';
44
import { Link, Pill } from '$lib/elements';
55
import {
@@ -17,11 +17,9 @@
1717
import { createEventDispatcher, onMount } from 'svelte';
1818
import { ContainerButton } from '.';
1919
import { goto } from '$app/navigation';
20-
import { Layout } from '@appwrite.io/pink-svelte';
20+
import { Layout, Typography } from '@appwrite.io/pink-svelte';
2121
2222
export let title: string;
23-
export let titleTag: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6' = 'h2';
24-
export let titleSize: '1' | '2' | '3' | '4' | '5' | '6' | '7' = '5';
2523
export let serviceId = title.toLocaleLowerCase() as PlanServices;
2624
export let total: number = null;
2725
export let alertType: 'info' | 'success' | 'warning' | 'error' | 'default' = 'warning';
@@ -117,7 +115,7 @@
117115

118116
<Layout.Stack direction="row" alignContent="center">
119117
<Layout.Stack direction="row">
120-
<Heading tag={titleTag} size={titleSize}>{title}</Heading>
118+
<Typography.Title size="m">{title}</Typography.Title>
121119
{#if isCloud && isLimited}
122120
<DropList bind:show={showDropdown} width="16">
123121
{#if hasProjectLimitation}

‎src/lib/layout/gridHeader.svelte

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
<script lang="ts">
2-
import { Heading, ViewSelector } from '$lib/components';
2+
import { ViewSelector } from '$lib/components';
3+
import { Typography } from '@appwrite.io/pink-svelte';
34
import type { View } from '$lib/helpers/load';
45
import type { Column } from '$lib/helpers/types';
56
import type { Writable } from 'svelte/store';
@@ -14,7 +15,7 @@
1415
</script>
1516

1617
<header class="grid-header">
17-
<Heading tag="h2" size="5">{title}</Heading>
18+
<Typography.Title size="m">{title}</Typography.Title>
1819
<div class="u-flex u-gap-16 u-contents-mobile">
1920
<ViewSelector
2021
{view}

‎src/lib/layout/logs.svelte

+4-4
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
11
<script lang="ts">
22
import { hoursToDays, timeFromNow, toLocaleDateTime } from '$lib/helpers/date';
33
import { log } from '$lib/stores/logs';
4-
import { Alert, Card, Code, Copy, Heading, Id, SvgIcon, Tab, Tabs } from '../components';
4+
import { Alert, Card, Code, Copy, Id, SvgIcon, Tab, Tabs } from '../components';
55
import { calculateTime } from '$lib/helpers/timeConversion';
66
import {
77
TableBody,
@@ -18,7 +18,7 @@
1818
import { organization } from '$lib/stores/organization';
1919
import { Button } from '$lib/elements/forms';
2020
import { BillingPlan } from '$lib/constants';
21-
import { Tooltip } from '@appwrite.io/pink-svelte';
21+
import { Tooltip, Typography } from '@appwrite.io/pink-svelte';
2222
2323
let selectedRequest = 'parameters';
2424
let selectedResponse = 'logs';
@@ -201,7 +201,7 @@
201201
<div class="code-panel-content grid-1-2">
202202
<div
203203
class="grid-1-2-col-1 u-flex u-flex-vertical u-gap-16 mobile-only-inline-20-padding">
204-
<Heading tag="h3" size="6">Request</Heading>
204+
<Typography.Title size="s">Request</Typography.Title>
205205
<div class="u-sep-block-end">
206206
<Tabs>
207207
<Tab
@@ -314,7 +314,7 @@
314314
<div class="u-sep-block-end is-only-mobile u-padding-block-start-16" />
315315
<div
316316
class="grid-1-2-col-2 u-flex u-flex-vertical u-gap-16 u-min-width-0 mobile-only-inline-20-padding mobile-only-block-start-20-padding">
317-
<Heading tag="h3" size="6">Response</Heading>
317+
<Typography.Title size="s">Request</Typography.Title>
318318
<div class="u-sep-block-end">
319319
<Tabs>
320320
<Tab

‎src/lib/layout/unauthenticated.svelte

+3-41
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
<script lang="ts">
22
import { base } from '$app/paths';
3-
import { Avatar, AvatarInitials, Card, Heading } from '$lib/components';
3+
import { Avatar, AvatarInitials, Card } from '$lib/components';
44
import AppwriteLogoDark from '$lib/images/appwrite-logo-dark.svg';
55
import AppwriteLogoLight from '$lib/images/appwrite-logo-light.svg';
66
import LoginDark from '$lib/images/login/login-dark-mode.png';
@@ -93,26 +93,7 @@
9393
alt="promo" />
9494

9595
<div class="u-text-center auth-container">
96-
<div class="is-only-mobile u-width-full-line">
97-
<Heading
98-
size="5"
99-
tag="h3"
100-
class="u-margin-block-start-16"
101-
trimmed={false}
102-
style="font-weight:normal">
103-
{generateTitle()}
104-
</Heading>
105-
</div>
106-
<div class="is-not-mobile u-width-full-line">
107-
<Heading
108-
size="4"
109-
tag="h3"
110-
class="u-margin-block-start-32"
111-
trimmed={false}
112-
style="font-weight:normal">
113-
{generateTitle()}
114-
</Heading>
115-
</div>
96+
<Typography.Title size="m">{generateTitle()}</Typography.Title>
11697
<p class="u-margin-block-start-16">
11798
{generateDesc()}
11899
</p>
@@ -122,26 +103,7 @@
122103
<section
123104
class="u-flex u-flex-vertical u-main-center u-cross-center u-height-100-percent u-width-full-line review-container">
124105
<div class="u-text-center">
125-
<div class="is-only-mobile u-width-full-line">
126-
<Heading
127-
size="5"
128-
tag="h3"
129-
class="u-margin-block-start-48"
130-
trimmed={false}
131-
style="font-weight:normal">
132-
{generateTitle()}
133-
</Heading>
134-
</div>
135-
<div class="is-not-mobile u-width-full-line">
136-
<Heading
137-
size="3"
138-
tag="h3"
139-
class="u-margin-block-start-32"
140-
trimmed={false}
141-
style="font-weight:normal">
142-
{generateTitle()}
143-
</Heading>
144-
</div>
106+
<Typography.Title size="m">{generateTitle()}</Typography.Title>
145107
</div>
146108

147109
<p class="body-text-1 u-margin-block-start-16 u-text-center">{generateDesc()}</p>

‎src/lib/layout/usageMultiple.svelte

+2-2
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
import { Container } from '$lib/layout';
33
import { BarChart, Legend, type LegendData } from '$lib/charts';
44
import { accumulateFromEndingTotal } from '$lib/layout/usage.svelte';
5-
import { Card, Heading, SecondaryTabs, SecondaryTabsItem } from '$lib/components';
5+
import { Card, SecondaryTabs, SecondaryTabsItem } from '$lib/components';
66
import { page } from '$app/stores';
77
import { type Models } from '@appwrite.io/console';
88
import { formatNumberWithCommas } from '$lib/helpers/numbers';
@@ -20,7 +20,7 @@
2020
<Container overlapCover={overlapContainerCover}>
2121
{#if showHeader}
2222
<div class="u-flex u-main-space-between common-section">
23-
<Heading tag="h2" size="5">{title}</Heading>
23+
<Typography.Title>{title}</Typography.Title>
2424

2525
{#if path}
2626
<SecondaryTabs>

‎src/lib/layout/wizardSecondaryContainer.svelte

+3-2
Original file line numberDiff line numberDiff line change
@@ -1,9 +1,9 @@
11
<script lang="ts">
22
import { trackEvent } from '$lib/actions/analytics';
3-
import { Heading } from '$lib/components';
43
import { Button } from '$lib/elements/forms';
54
import WizardExitModal from './wizardExitModal.svelte';
65
import { goto } from '$app/navigation';
6+
import { Typography } from '@appwrite.io/pink-svelte';
77
88
type $$Props =
99
| {
@@ -42,7 +42,8 @@
4242
<div class="wizard-secondary-container">
4343
<header class="wizard-secondary-header">
4444
<div class="u-flex u-main-space-between u-gap-32 u-cross-center">
45-
<Heading size={5} tag="h1"><slot name="title" /></Heading>
45+
<Typography.Title><slot name="title" /></Typography.Title>
46+
4647
<Button
4748
text
4849
icon

‎src/lib/layout/wizardStep.svelte

+2-5
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,6 @@
11
<script lang="ts">
2-
import { Heading } from '$lib/components';
32
import { wizard } from '$lib/stores/wizard';
4-
import { Layout } from '@appwrite.io/pink-svelte';
3+
import { Layout, Typography } from '@appwrite.io/pink-svelte';
54
import { onDestroy } from 'svelte';
65
76
/**
@@ -23,9 +22,7 @@
2322

2423
<Layout.Stack>
2524
<header class="form-header" class:hide-divider={!$$slots.subtitle}>
26-
<Heading tag="h1" size="6">
27-
<slot name="title" />
28-
</Heading>
25+
<Typography.Title><slot name="title" /></Typography.Title>
2926
{#if $$slots.subtitle}
3027
<p>
3128
<slot name="subtitle" />

‎src/lib/wizards/functions/cover.svelte

+7-7
Original file line numberDiff line numberDiff line change
@@ -28,7 +28,7 @@
2828

2929
<script lang="ts">
3030
import { base } from '$app/paths';
31-
import { AvatarGroup, Box, Heading } from '$lib/components';
31+
import { AvatarGroup, Box } from '$lib/components';
3232
import { app } from '$lib/stores/app';
3333
import { wizard } from '$lib/stores/wizard';
3434
import { repository, templateConfig, template as templateStore } from './store';
@@ -44,7 +44,7 @@
4444
import { isSelfHosted } from '$lib/system';
4545
import { consoleVariables } from '$routes/(console)/store';
4646
import { featuredTemplatesList, starterTemplate } from '$lib/stores/templates';
47-
import { Tooltip } from '@appwrite.io/pink-svelte';
47+
import { Tooltip, Typography } from '@appwrite.io/pink-svelte';
4848
import { IconDeno, IconDotnet } from '@appwrite.io/pink-icons-svelte';
4949
5050
const isVcsEnabled = $consoleVariables?._APP_VCS_ENABLED === true;
@@ -66,7 +66,7 @@
6666
<div class="git-container u-position-relative">
6767
<div class="grid-1-1 u-gap-24">
6868
<div class="card u-cross-child-start u-height-100-percent">
69-
<Heading size="6" tag="h6">Connect Git repository</Heading>
69+
<Typography.Title>Connect Git repository</Typography.Title>
7070
<p class="u-margin-block-start-8">
7171
Create and deploy a function with a connected git repository.
7272
</p>
@@ -87,9 +87,9 @@
8787
style="border-radius: var(--border-radius-medium)">
8888
<div
8989
class="u-flex-vertical u-height-100-percent u-main-center u-cross-center u-gap-16 u-padding-inline-24">
90-
<Heading size="7" tag="h6" trimmed={false}>
90+
<Typography.Title size="s">
9191
Connect your self-hosted instance to Git
92-
</Heading>
92+
</Typography.Title>
9393
<p>
9494
Configure your self-hosted instance to connect your function to
9595
a Git repository.
@@ -107,7 +107,7 @@
107107

108108
<div class="card u-height-100-percent">
109109
<section class="common-section">
110-
<Heading size="6" tag="h6">Quick start</Heading>
110+
<Typography.Title size="s">Quick start</Typography.Title>
111111
<p class="u-margin-block-start-8">Use a starter template.</p>
112112
<ul
113113
class="grid-box u-margin-block-start-16"
@@ -197,7 +197,7 @@
197197
</Button>
198198
<div class="u-sep-block-start common-section" />
199199
<section class="common-section">
200-
<Heading size="6" tag="h6">Templates</Heading>
200+
<Typography.Title size="s">Templates</Typography.Title>
201201
<p class="text u-margin-block-start-8">
202202
Find the right template for your use case.
203203
</p>

‎src/routes/(console)/+error.svelte

+6-4
Original file line numberDiff line numberDiff line change
@@ -1,15 +1,17 @@
11
<script>
22
import { base } from '$app/paths';
33
import { page } from '$app/stores';
4-
import { Heading } from '$lib/components';
54
import { Button } from '$lib/elements/forms';
65
import { Container } from '$lib/layout';
6+
import { Layout, Typography } from '@appwrite.io/pink-svelte';
77
</script>
88

99
<Container>
10-
<div class="u-flex-vertical u-gap-16">
11-
<Heading size="1" tag="h3">{$page.error.status || 'Invalid Argument'}</Heading>
12-
<Heading size="4" tag="h4" trimmed={false}>{$page.error.message}</Heading>
10+
<div>
11+
<Typography.Title size="xl">{$page.error.status || 'Invalid Argument'}</Typography.Title>
12+
<Typography.Title>{$page.error.message}</Typography.Title>
13+
</div>
14+
<div>
1315
<Button href={base}>Back to the console</Button>
1416
</div>
1517
</Container>

‎src/routes/(console)/account/organizations/+page.svelte

+2-3
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,6 @@
55
Empty,
66
AvatarGroup,
77
CardContainer,
8-
Heading,
98
PaginationWithLimit
109
} from '$lib/components';
1110
import { Button } from '$lib/elements/forms';
@@ -21,7 +20,7 @@
2120
import { toLocaleDate } from '$lib/helpers/date';
2221
import { BillingPlan } from '$lib/constants';
2322
import { goto } from '$app/navigation';
24-
import { Icon, Tooltip } from '@appwrite.io/pink-svelte';
23+
import { Icon, Tooltip, Typography } from '@appwrite.io/pink-svelte';
2524
import { IconPlus } from '@appwrite.io/pink-icons-svelte';
2625
2726
export let data: PageData;
@@ -47,7 +46,7 @@
4746

4847
<Container>
4948
<div class="u-flex u-gap-12 common-section u-main-space-between">
50-
<Heading tag="h2" size="5">Organizations</Heading>
49+
<Typography.Title>Organizations</Typography.Title>
5150

5251
<Button on:click={createOrg} event="create_organization">
5352
<Icon icon={IconPlus} slot="start" size="s" />

0 commit comments

Comments
 (0)