LukeParke/website
1
0
Fork 0
mirror of https://github.com/LukeHagar/website.git synced 2025-12-09 12:57:48 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix all text scale

Browse Source
This commit is contained in:
Jesse Winton
2024-09-05 16:21:28 -04:00
parent 686a0d5254
commit 6eb2ce7848
106 changed files with 458 additions and 521 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
src/lib/animations/OpenSource.svelte
View File

@@ -176,7 +176,7 @@
}}
>
<div class="sticky-wrapper">
<h3 class="web-display !text-primary">Powered by Open Source</h3>
<h3 class="text-display font-aeonik-pro text-primary">Powered by Open Source</h3>
<div class="cards-wrapper">
<a
@@ -193,7 +193,7 @@
aria-label="Discord"
/>
</div>
<div class="web-title mt-auto">17k+ Discord Members</div>
<div class="text-title font-aeonik-pro mt-auto">17k+ Discord Members</div>
</a>
<a
@@ -208,7 +208,7 @@
aria-label="GitHub"
/>
</div>
<div class="web-title mt-auto">
<div class="text-title font-aeonik-pro mt-auto">
{GITHUB_STARS}+ GitHub Stars
</div>
</a>
@@ -225,7 +225,7 @@
aria-label="Twitter"
/>
</div>
<div class="web-title mt-auto">128k+ Twitter Followers</div>
<div class="text-title font-aeonik-pro mt-auto">128k+ Twitter Followers</div>
</a>
<a
@@ -240,7 +240,7 @@
aria-label="YouTube"
/>
</div>
<div class="web-title mt-auto">7k+ Youtube Subscribers</div>
<div class="text-title font-aeonik-pro mt-auto">7k+ Youtube Subscribers</div>
</a>
<a
@@ -255,7 +255,7 @@
aria-label="GitHub"
/>
</div>
<div class="web-title mt-auto">21k+ Code Commits</div>
<div class="text-title font-aeonik-pro mt-auto">21k+ Code Commits</div>
</a>
</div>
</div>

8
src/lib/animations/Products/Products.svelte
View File

@@ -243,7 +243,7 @@
>
<h2
class="web-display web-u-color-text-primary"
class="text-display font-aeonik-pro text-primary"
transition:fly={{ y: 16, delay: 250 }}
>
Your backend, minus the hassle
@@ -285,11 +285,13 @@
width="32"
height="32"
/>
<span class="web-label">{copy.title}</span>
<span class="text-label">{copy.title}</span>
</h3>
{#if isActive}
<div transition:slide>
<h4 class="web-title">{copy.subtitle}</h4>
<h4 class="text-title font-aeonik-pro">
{copy.subtitle}
</h4>
<p>
{copy.description}
</p>

8
src/lib/animations/Products/ProductsMobile.svelte
View File

@@ -7,7 +7,9 @@
<div class="wrapper">
<span class="web-badges web-eyebrow !text-white">Products_</span>
<h2 class="web-display web-u-color-text-primary mt-4">Your backend, minus the hassle</h2>
<h2 class="text-display font-aeonik-pro text-primary mt-4">
Your backend, minus the hassle
</h2>
<p class="text-description mt-4">
Build secure and scalable applications with less code. Add authentication, databases,
@@ -23,10 +25,10 @@
<div class="info">
<h3>
<img src={info.icon.active} alt="" />
<span class="web-label web-u-color-text-primary">{info.title}</span>
<span class="text-label text-primary">{info.title}</span>
</h3>
<h4 class="web-title">{info.subtitle}</h4>
<h4 class="text-title font-aeonik-pro">{info.subtitle}</h4>
<p>
{info.description}
</p>

4
src/lib/components/Accordion/Item.svelte
View File

@@ -7,9 +7,7 @@
<details class="collapsible-wrapper group" {open}>
<summary class="collapsible-button flex items-center justify-between cursor-pointer">
<span class="text">{title}</span>
<div
class="icon web-u-color-text-primary group-[&[open]]:rotate-180 transition-transform"
>
<div class="icon text-primary group-[&[open]]:rotate-180 transition-transform">
<span class="icon-cheveron-down" aria-hidden="true" />
</div>
</summary>

2
src/lib/components/AnnouncementBanner.svelte
View File

@@ -9,7 +9,7 @@
</script>
<div class="web-top-banner">
<div class="web-top-banner-content web-u-color-text-primary">
<div class="web-top-banner-content text-primary">
<slot />
{#if browser}
<button

4
src/lib/components/Article.svelte
View File

@@ -23,7 +23,7 @@
/>
</div>
<div class="web-grid-articles-item-content">
<h4 class="web-label web-u-color-text-primary">
<h4 class="text-label text-primary">
{title}
</h4>
<div class="web-author">
@@ -37,7 +37,7 @@
alt={author}
/>
<div class="web-author-info">
<h4 class="web-sub-body-400 web-u-color-text-primary">{author}</h4>
<h4 class="web-sub-body-400 text-primary">{author}</h4>
<ul class="web-metadata web-caption-400 web-is-not-mobile">
<li>
{formatDate(date)}

2
src/lib/components/BlogCta.svelte
View File

@@ -6,7 +6,7 @@
<div class="call-to-action">
<div class="details">
<h2 class="web-label">{heading}</h2>
<h2 class="text-label">{heading}</h2>
<a href={url} class="web-button">{label}</a>
</div>
</div>

10
src/lib/components/Feedback.svelte
View File

@@ -53,7 +53,7 @@
style="flex-wrap: wrap-reverse;"
>
<div class="flex items-center gap-4">
<h5 class="web-main-body-600 web-u-color-text-primary">Was this page helpful?</h5>
<h5 class="web-main-body-600 text-primary">Was this page helpful?</h5>
<div class="flex gap-2">
<button
class="web-radio-button"
@@ -106,7 +106,7 @@
>
<div class="flex flex-col gap-2">
<label for="message">
<span class="web-u-color-text-primary">
<span class="text-primary">
What did you {feedbackType === 'negative' ? 'dislike' : 'like'}? (optional)
</span>
</label>
@@ -117,7 +117,7 @@
bind:value={comment}
/>
<label for="message" class="mt-2">
<span class="web-u-color-text-primary">Email</span>
<span class="text-primary">Email</span>
</label>
<input
class="web-input-text"
@@ -129,12 +129,12 @@
/>
</div>
{#if submitted}
<p class="web-u-color-text-primary mt-4">
<p class="text-primary mt-4">
Your message has been sent successfully. We appreciate your feedback.
</p>
{/if}
{#if error}
<p class="web-u-color-text-primary mt-4">
<p class="text-primary mt-4">
There was an error submitting your feedback. Please try again later.
</p>
{/if}

2
src/lib/components/InitBanner.svelte
View File

@@ -29,7 +29,7 @@
</script>
<div class="banner" class:hidden={$page.url.pathname.includes('init')}>
<div class="content web-u-color-text-primary">
<div class="content text-primary">
<div class="headings">
<span style:font-weight="500"
><span

2
src/lib/components/MetricCard.svelte
View File

@@ -4,7 +4,7 @@
</script>
<div class="web-card is-normal has-border-gradient">
<div class="web-title web-u-color-text-primary">{metric}</div>
<div class="text-title font-aeonik-pro text-primary">{metric}</div>
<div class="text-description">{description}</div>
</div>

2
src/lib/components/Newsletter.svelte
View File

@@ -90,7 +90,7 @@
class:max-w-[380px]={!submitted}
>
<section class="web-gap-5 flex flex-col">
<h1 class="web-title web-u-color-text-primary">
<h1 class="text-title font-aeonik-pro text-primary">
Subscribe to our newsletter
</h1>
<p class="text-description web-u-padding-block-end-40">

10
src/lib/components/PreFooter.svelte
View File

@@ -6,7 +6,7 @@
<div class="web-u-row-gap-80 relative grid md:grid-cols-2 gap-8">
<section class="web-hero flex items-center justify-center gap-y-8">
<h2 class="web-display web-u-color-text-primary max-w-[500px] text-center">
<h2 class="text-display font-aeonik-pro text-primary max-w-[500px] text-center">
Start building today
</h2>
<a href={PUBLIC_APPWRITE_DASHBOARD} class="web-button is-transparent web-self-center">
@@ -18,7 +18,7 @@
>
<header class="web-strip-plans-header">
<div class="web-strip-plans-header-wrapper web-u-row-gap-24">
<h3 class="web-title web-u-color-text-primary">Our plans</h3>
<h3 class="text-title font-aeonik-pro text-primary">Our plans</h3>
</div>
</header>
@@ -27,7 +27,7 @@
<div class="web-strip-plans-item-wrapper">
<div class="web-strip-plans-plan">
<h4 class="title text-description">Free</h4>
<div class="web-title web-u-color-text-primary">$0</div>
<div class="text-title font-aeonik-pro text-primary">$0</div>
<div class="info web-caption-500" />
</div>
<p class="web-strip-plans-info web-caption-500">
@@ -45,7 +45,7 @@
<div class="web-strip-plans-item-wrapper">
<div class="web-strip-plans-plan">
<h4 class="title text-description">Pro</h4>
<div class="web-title web-u-color-text-primary">$15</div>
<div class="text-title font-aeonik-pro text-primary">$15</div>
<div class="info web-caption-500">per member/month</div>
</div>
<p class="web-strip-plans-info web-caption-500">
@@ -66,7 +66,7 @@
<div class="web-strip-plans-item-wrapper">
<div class="web-strip-plans-plan">
<h4 class="title text-description">Scale</h4>
<div class="web-title web-u-color-text-primary">$599</div>
<div class="text-title font-aeonik-pro text-primary">$599</div>
<div class="info web-caption-500">per org/month</div>
</div>
<p class="web-strip-plans-info web-caption-500">

14
src/lib/components/ProductsGrid.svelte
View File

@@ -1,8 +1,6 @@
<div class="web-big-padding-section-level-2">
<div class="container">
<h3 class="web-label web-u-color-text-primary text-center">
Keep exploring similar integrations
</h3>
<h3 class="text-label text-primary text-center">Keep exploring similar integrations</h3>
<ul class="l-grid-1 mt-8">
<li>
<a
@@ -18,7 +16,7 @@
width="32"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">Auth</h4>
<h4 class="web-main-body-400 text-primary">Auth</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div>
<p class="web-sub-body-400 ml-1">
@@ -40,7 +38,7 @@
width="32"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">Functions</h4>
<h4 class="web-main-body-400 text-primary">Functions</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div>
<p class="web-sub-body-400 ml-1">
@@ -62,7 +60,7 @@
width="32"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">Databases</h4>
<h4 class="web-main-body-400 text-primary">Databases</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div>
<p class="web-sub-body-400 ml-1">
@@ -84,7 +82,7 @@
width="32"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">Messaging</h4>
<h4 class="web-main-body-400 text-primary">Messaging</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div>
<p class="web-sub-body-400 ml-1">
@@ -106,7 +104,7 @@
width="32"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">Realtime</h4>
<h4 class="web-main-body-400 text-primary">Realtime</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div>
<p class="web-sub-body-400 ml-1">

4
src/lib/components/Search.svelte
View File

@@ -203,7 +203,7 @@
<span class="web-u-color-text-secondary">{hit.h1}</span>
{#if relevantSubtitle}
<span class="web-u-color-text-secondary"> / </span>
<span class="web-u-color-text-primary">
<span class="text-primary">
{relevantSubtitle}
</span>
{/if}
@@ -243,7 +243,7 @@
<span class="web-u-color-text-secondary">{hit.h1}</span>
{#if hit.h2}
<span class="web-u-color-text-secondary"> / </span>
<span class="web-u-color-text-primary">{hit.h2}</span>
<span class="text-primary">{hit.h2}</span>
{/if}
</div>
</a>

6
src/lib/components/ui/Hero.svelte
View File

@@ -20,8 +20,8 @@
const styles = cva('text-white', {
variants: {
size: {
title: ['text-headline', 'flex-[1.3]'],
display: ['text-display', 'w-full']
title: ['text-headline', 'font-aeonik-pro', 'flex-[1.3]'],
display: ['text-display', 'font-aeonik-pro', 'w-full']
}
},
defaultVariants: {
@@ -37,7 +37,7 @@
</script>
<section class={classNames(hero({ layout }), classes)} {...props}>
<h1 class={classNames(styles({ size }), 'font-aeonik-pro')}>
<h1 class={classNames(styles({ size }))}>
<slot name="title" />
</h1>
{#if $$slots.description}

4
src/lib/layouts/DocsArticle.svelte
View File

@@ -49,12 +49,12 @@
aria-label="previous page"
>
<span
class="icon-cheveron-left web-u-font-size-24 web-u-color-text-primary web-is-not-mobile"
class="icon-cheveron-left web-u-font-size-24 text-primary web-is-not-mobile"
aria-hidden="true"
/>
</a>
{/if}
<h1 class="web-title">{title}</h1>
<h1 class="text-title font-aeonik-pro">{title}</h1>
</div>
</div>
<div class="web-article-header-end" />

4
src/lib/layouts/DocsTutorial.svelte
View File

@@ -36,12 +36,12 @@
aria-label="previous page"
>
<span
class="icon-cheveron-left web-u-font-size-24 web-u-color-text-primary web-is-not-mobile"
class="icon-cheveron-left web-u-font-size-24 text-primary web-is-not-mobile"
aria-hidden="true"
/>
</a>
{/if}
<h1 class="web-title">{title}</h1>
<h1 class="text-title font-aeonik-pro">{title}</h1>
</div>
</div>
<div class="web-article-header-end" />

2
src/lib/utils/markdown.ts
View File

@@ -19,7 +19,7 @@ function transform_tokens(tokens: ReturnType<typeof md.parse>): ReturnType<typeo
}
switch (token.type) {
case 'paragraph_open':
token.attrPush(['class', 'web-paragraph']);
token.attrPush(['class', 'text-paragraph']);
break;
case 'link_open': {
const href = token.attrGet('href');

6
src/markdoc/layouts/Author.svelte
View File

@@ -107,9 +107,9 @@
<FloatingHead --position="relative" src={avatar} alt={name} size={112} />
{/if}
<div>
<h1 class="web-title web-u-color-text-primary">{name}</h1>
<h1 class="text-title font-aeonik-pro text-primary">{name}</h1>
{#if role}
<div class="web-label mt-2">{role}</div>
<div class="text-label mt-2">{role}</div>
{/if}
</div>
{#if bio}
@@ -166,7 +166,7 @@
<div class="py-10">
<div class="web-big-padding-section-level-2">
<div class="container">
<h2 class="web-title web-u-color-text-primary">Articles</h2>
<h2 class="text-title font-aeonik-pro text-primary">Articles</h2>
<!-- <div class="web-is-only-mobile mt-8">
<label class="blockweb-select is-colored" for="articles">

4
src/markdoc/layouts/Category.svelte
View File

@@ -46,7 +46,9 @@
</a>
<div class="web-category-header mt-6">
<div class="web-category-header-content">
<h1 class="web-display web-u-color-text-primary">{name}</h1>
<h1 class="text-display font-aeonik-pro text-primary">
{name}
</h1>
<p class="web-category-header-description text-description">
{description}
</p>

10
src/markdoc/layouts/Integration.svelte
View File

@@ -98,7 +98,7 @@
height="40"
/>
<h1
class="web-title web-u-color-text-primary justif"
class="text-title font-aeonik-pro text-primary justif"
style="max-width: 28.15rem;"
>
{title}
@@ -118,7 +118,7 @@
>
<div class="flex justify-between gap-2">
<dt>Vendor</dt>
<dd class="web-u-color-text-primary">{product.vendor}</dd>
<dd class="text-primary">{product.vendor}</dd>
</div>
<div class="web-u-sep-block-end"></div>
{#if isPartner}
@@ -130,7 +130,7 @@
<div class="web-u-sep-block-end"></div>
<div class="flex justify-between gap-2">
<dt>Category</dt>
<dd class="web-u-color-text-primary">{category}</dd>
<dd class="text-primary">{category}</dd>
</div>
</dl>
</div>
@@ -156,7 +156,9 @@
<section
class="web-hero web-u-max-width-580 flex items-center justify-center gap-y-4"
>
<h2 class="web-display text-center web-u-color-text-primary max-w-[600px]">
<h2
class="text-display font-aeonik-pro text-center text-primary max-w-[600px]"
>
Become a Technology Partner
</h2>
<p class="web-main-body-500">

4
src/markdoc/layouts/Policy.svelte
View File

@@ -70,10 +70,10 @@
<div class="container">
<div class="web-grid-120-1fr-auto">
<header class="web-grid-120-1fr-auto-header">
<h1 class="web-title web-u-color-text-primary">{title}</h1>
<h1 class="text-title font-aeonik-pro text-primary">{title}</h1>
</header>
<button
class="toc-btn web-u-padding-20 web-u-margin-inline-20-negative web-u-color-text-primary web-is-only-mobile web-u-sep-block
class="toc-btn web-u-padding-20 web-u-margin-inline-20-negative text-primary web-is-only-mobile web-u-sep-block
web-u-filter-blur-8 sticky mt-6 flex
w-full items-center justify-between"
style:--inset-block-start="4.5rem"

10
src/markdoc/layouts/Post.svelte
View File

@@ -118,7 +118,9 @@
<li>{timeToRead} min</li>
{/if}
</ul>
<h1 class="web-title web-u-color-text-primary">{title}</h1>
<h1 class="text-title font-aeonik-pro text-primary">
{title}
</h1>
{#if description}
<p class="text-description mt-2">
{description}
@@ -138,9 +140,7 @@
/>
{/if}
<div class="flex flex-col">
<h4
class="web-sub-body-400 web-u-color-text-primary"
>
<h4 class="web-sub-body-400 text-primary">
{authorData.name}
</h4>
<p class="web-caption-400">{authorData.role}</p>
@@ -239,7 +239,7 @@
<div class="web-u-sep-block-start py-10">
<div class="web-big-padding-section-level-2">
<div class="container">
<h3 class="web-label web-u-color-text-primary">Read next</h3>
<h3 class="text-label text-primary">Read next</h3>
<section class="mt-8">
<ul class="web-grid-articles">
{#each posts.filter((p) => p.title !== title).slice(0, 3) as post}

10
src/markdoc/nodes/Heading.svelte
View File

@@ -11,7 +11,7 @@
const tag = `h${level + 1}`;
const ctx = hasContext('headings') ? getContext<LayoutContext>('headings') : undefined;
const classList: Record<typeof level, string> = {
1: 'web-label',
1: 'text-label',
2: 'text-description',
3: 'web-main-body-500',
4: 'web-sub-body-500'
@@ -49,7 +49,7 @@
});
const inPolicy = isInPolicy();
$: headingClass = inPolicy && level === 1 ? 'web-title' : classList[level];
$: headingClass = inPolicy && level === 1 ? 'text-title font-aeonik-pro' : classList[level];
</script>
{#if id}
@@ -59,7 +59,7 @@
bind:this={element}
class:web-snap-location={id && !inReferences}
class:web-snap-location-references={id && inReferences}
class="{headingClass} web-u-color-text-primary"
class="{headingClass} text-primary"
>
<a href={`#${id}`} class=""><slot /></a>
</svelte:element>
@@ -67,7 +67,7 @@
<svelte:element
this={tag}
bind:this={element}
class="{headingClass} web-u-color-text-primary"
class="{headingClass} text-primary"
class:in-policy={inPolicy}
>
<slot />
@@ -75,7 +75,7 @@
{/if}
<style>
.web-title {
.text-title font-aeonik-pro {
margin-block-end: 1rem;
margin-block-start: 2rem;
}

4
src/markdoc/nodes/Item.svelte
View File

@@ -9,9 +9,9 @@
$: classes = (() => {
if (inDocs) return '';
if (inChangelog) return 'web-paragraph-lg';
if (inChangelog) return 'text-paragraph-lg';
if (inPolicy) return '';
return 'web-paragraph-lg';
return 'text-paragraph-lg';
})();
</script>

6
src/markdoc/nodes/Link.svelte
View File

@@ -13,13 +13,13 @@
const inChangelog = isInChangelog();
$: classes = (() => {
if (inDocs) return 'web-paragraph-md';
if (inChangelog) return 'web-paragraph-lg in-changelog';
if (inDocs) return 'text-paragraph-md';
if (inChangelog) return 'text-paragraph-lg in-changelog';
return '';
})();
</script>
<a class="web-link is-inline {classes}" {href} {title} {target} {rel}><slot /></a>
<a class="web-link underline {classes}" {href} {title} {target} {rel}><slot /></a>
<style lang="scss">
.in-changelog:last-child {

25
src/markdoc/nodes/Paragraph.svelte
View File

@@ -15,11 +15,11 @@
export { className as class };
$: classes = (() => {
if (inDocs) return 'web-paragraph-md';
if (inPolicy) return 'web-paragraph-md in-policy';
if (inTable) return 'web-paragraph-md';
if (inChangelog) return 'web-paragraph-lg in-changelog';
return 'web-paragraph-lg';
if (inDocs) return 'text-paragraph-md';
if (inPolicy) return 'text-paragraph-md mb-4';
if (inTable) return 'text-paragraph-md';
if (inChangelog) return 'text-paragraph-lg mb-4 font-normal';
return 'text-paragraph-lg mb-8';
})();
</script>
@@ -28,18 +28,3 @@
{:else}
<p class="{classes} {className}"><slot /></p>
{/if}
<style lang="scss">
p.web-paragraph-lg {
margin-block-end: 2rem;
}
.in-policy {
margin-block-end: 1rem;
}
.in-changelog {
margin-block-end: 1rem !important;
font-weight: 400;
}
</style>

2
src/markdoc/tags/Cards_Image_Item.svelte
View File

@@ -13,7 +13,7 @@
<a {href} class="web-card is-normal" style:margin-block-end="0">
<img src={dark} alt="" class="web-u-only-dark" width="32" height="32" />
<img src={light} alt="" class="web-u-only-light" width="32" height="32" />
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">
<h4 class="web-sub-body-500 text-primary mt-2">
{title}
</h4>
<p class="web-sub-body-400 mt-1">

2
src/markdoc/tags/Cards_Item.svelte
View File

@@ -14,7 +14,7 @@
{#if icon}
<span class="{icon} web-u-font-size-24" aria-hidden="true" />
{/if}
<h4 class="web-sub-body-500 web-u-color-text-primary">
<h4 class="web-sub-body-500 text-primary">
{title}
</h4>
</header>

2
src/markdoc/tags/Count_Title.svelte
View File

@@ -4,6 +4,6 @@
const el = title ? 'h3' : 'span';
</script>
<svelte:element this={el} class="web-sub-body-500 web-u-color-text-primary">
<svelte:element this={el} class="web-sub-body-500 text-primary">
{title}
</svelte:element>

2
src/markdoc/tags/Info.svelte
View File

@@ -4,6 +4,6 @@
<div class="web-inline-info">
<span class="icon-info" aria-hidden="true" />
<h5 class="web-sub-body-500 web-u-color-text-primary">{title}</h5>
<h5 class="web-sub-body-500 text-primary">{title}</h5>
<slot />
</div>

2
src/routes/+error.svelte
View File

@@ -16,7 +16,7 @@
<div class="container">
<div class="web-hero" style="--hero-gap:1.25rem;">
<span class="web-badges web-eyebrow !text-white">{$page.status}</span>
<h1 class="web-headline web-u-color-text-primary">
<h1 class="text-headline font-aeonik-pro text-primary">
{$page.error?.message ?? 'An error has occured'}
</h1>
{#if $page.status === 404}

24
src/routes/+page.svelte
View File

@@ -168,7 +168,7 @@
<div class="my-[7.5rem]">
<div class="container">
<h2
class="web-title web-u-color-text-primary text-center web-u-max-width-600 mx-auto"
class="text-title font-aeonik-pro text-primary text-center web-u-max-width-600 mx-auto"
>
Trusted by developers from the world's leading organizations
</h2>
@@ -291,7 +291,7 @@
<div class="container">
<section class="web-hero is-align-start">
<Badge>PRIVACY & SECURITY_</Badge>
<h2 class="web-display text-primary max-w-[700px]">
<h2 class="text-display font-aeonik-pro text-primary max-w-[700px]">
Self-host your data or take it to the Cloud
</h2>
<p class="text-secondary mt-5 max-w-[700px] text-xl font-medium">
@@ -324,7 +324,9 @@
<div class="my-[7.5rem]">
<div class="container">
<div class="web-hero">
<div class="web-display text-primary">Loved by developers like you</div>
<div class="text-display font-aeonik-pro text-primary">
Loved by developers like you
</div>
</div>
<ul class="web-multi-columns-1 mt-20">
<li>
@@ -366,7 +368,7 @@
href="https://twitter.com/appwrite"
target="_blank"
rel="noopener noreferrer"
class="web-link is-inline">@appwrite</a
class="web-link underline">@appwrite</a
> handle my authentication process while I focus on the business logic.
</DeveloperCard>
</li>
@@ -406,7 +408,7 @@
href="https://twitter.com/appwrite"
target="_blank"
rel="noopener noreferrer"
class="web-link is-inline">@appwrite</a
class="web-link underline">@appwrite</a
>. With its robust feature set and open-source nature, it's the
perfect choice for developers who want to build secure and scalable
applications.
@@ -438,7 +440,7 @@
<div class="container relative">
<section class="web-hero is-align-start">
<span class="web-badges web-eyebrow !text-white">SDKs_</span>
<h2 class="web-display web-u-color-text-primary max-w-[600px]">
<h2 class="text-display font-aeonik-pro text-primary max-w-[600px]">
Code the way you want
</h2>
<p class="text-secondary mt-5 max-w-[600px] text-xl font-medium">
@@ -470,7 +472,7 @@
<div class="grid md:grid-cols-2">
<section class="web-hero is-align-start">
<span class="web-badges web-eyebrow !text-white">Scale_</span>
<h2 class="web-display web-u-color-text-primary max-w-[600px]">
<h2 class="text-display font-aeonik-pro text-primary max-w-[600px]">
We scale for you
</h2>
</section>
@@ -478,19 +480,19 @@
class="web-big-list-info web-u-inline-width-100-percent-mobile-break1 web-u-margin-block-start-48 ml-auto"
>
<li class="web-big-list-info-item">
<div class="web-headline web-u-color-text-primary">90K</div>
<div class="text-headline font-aeonik-pro text-primary">90K</div>
<div class="text">Projects</div>
</li>
<li class="web-big-list-info-item">
<div class="web-headline web-u-color-text-primary">+1B</div>
<div class="text-headline font-aeonik-pro text-primary">+1B</div>
<div class="text">Requests served</div>
</li>
<li class="web-big-list-info-item">
<div class="web-headline web-u-color-text-primary">20K</div>
<div class="text-headline font-aeonik-pro text-primary">20K</div>
<div class="text">Organizations</div>
</li>
<li class="web-big-list-info-item">
<div class="web-headline web-u-color-text-primary">99.99%</div>
<div class="text-headline font-aeonik-pro text-primary">99.99%</div>
<div class="text">Guaranteed uptime</div>
</li>
</ul>

30
src/routes/assets/+page.svelte
View File

@@ -63,9 +63,9 @@
<div class="container">
<div class="web-grid-120-1fr-auto">
<header class="web-grid-120-1fr-auto-header">
<h1 class="web-display web-u-color-text-primary">Brand assets</h1>
<h1 class="text-display font-aeonik-pro text-primary">Brand assets</h1>
<button
class="web-u-padding-block-20 web-u-color-text-primary web-is-only-mobile
class="web-u-padding-block-20 text-primary web-is-only-mobile
web-u-margin-inline-32-negative web-u-sep-block
mt-6 flex w-full w-full"
>
@@ -94,7 +94,7 @@
<section id={getSectionId(Section.NAMING)}>
<div class="web-flex flex-col gap-2">
<h2
class="web-title web-u-color-text-primary"
class="text-title font-aeonik-pro text-primary"
use:visible={{ top: 48 }}
on:visible={handleVisibility(Section.NAMING)}
>
@@ -111,7 +111,7 @@
<section id={getSectionId(Section.LOGOTYPE)}>
<div class="web-flex flex-col gap-2">
<h2
class="web-title web-u-color-text-primary"
class="text-title font-aeonik-pro text-primary"
use:visible={{ top: 48 }}
on:visible={handleVisibility(Section.LOGOTYPE)}
>
@@ -195,9 +195,7 @@
</div>
<section>
<div class="web-flex flex-col gap-2">
<h3 class="web-label web-u-color-text-primary">
Co-branding logotypes
</h3>
<h3 class="text-label text-primary">Co-branding logotypes</h3>
<p>
Spacing is determined by the Appwrite mark. Unless otherwise
noted by partner brands, each logo is optically equal as a
@@ -219,7 +217,7 @@
<section id={getSectionId(Section.LOGOMARK)}>
<div class="web-flex flex-col gap-2">
<h3
class="web-title web-u-color-text-primary"
class="text-title font-aeonik-pro text-primary"
use:visible={{ top: 48 }}
on:visible={handleVisibility(Section.LOGOMARK)}
>
@@ -304,9 +302,7 @@
</div>
<section id="">
<div class="web-flex flex-col gap-2">
<h3 class="web-label web-u-color-text-primary">
Co-branding lockups
</h3>
<h3 class="text-label text-primary">Co-branding lockups</h3>
<p>
Spacing is determined by the Appwrite mark. Unless otherwise
noted by partner brands, each logo is optically equal as a
@@ -327,7 +323,7 @@
<section id={getSectionId(Section.COLORS)}>
<h2
class="web-title web-u-color-text-primary"
class="text-title font-aeonik-pro text-primary"
use:visible={{ top: 48 }}
on:visible={handleVisibility(Section.COLORS)}
>
@@ -339,7 +335,7 @@
web-u-min-block-size-160 flex-1 flex-col justify-center
gap-2 px-6"
>
<h3 class="web-label">Light Grey</h3>
<h3 class="text-label">Light Grey</h3>
<p class="web-caption-400">#EDEDF0</p>
<div class="buttons | light">
<Copy toCopy="#EDEDF0" />
@@ -350,7 +346,7 @@
web-u-text-color-neutral-50 web-u-bg-color-neutral-900 flex-1 flex-col justify-center
gap-2 px-6"
>
<h3 class="web-label">Dark Grey</h3>
<h3 class="text-label">Dark Grey</h3>
<p class="web-caption-400">#19191D</p>
<div class="buttons">
<Copy toCopy="#19191D" />
@@ -361,7 +357,7 @@
web-u-min-block-size-160 flex-1 flex-col justify-center
gap-2 px-6"
>
<h3 class="web-label">Appwrite Pink</h3>
<h3 class="text-label">Appwrite Pink</h3>
<p class="web-caption-400">#FD366E</p>
<div class="buttons">
<Copy toCopy="#FD366E" />
@@ -373,7 +369,7 @@
<section id={getSectionId(Section.VISUALS)}>
<div class="web-flex flex-col gap-2">
<h2
class="web-title web-u-color-text-primary"
class="text-title font-aeonik-pro text-primary"
use:visible={{ top: 48 }}
on:visible={handleVisibility(Section.VISUALS)}
>
@@ -579,7 +575,7 @@
<section id={getSectionId(Section.CONTACT)}>
<div class="web-flex flex-col gap-2">
<h2
class="web-title web-u-color-text-primary"
class="text-title font-aeonik-pro text-primary"
use:visible={{ top: 48 }}
on:visible={handleVisibility(Section.CONTACT)}
>

6
src/routes/blog/[[page]]/+page.svelte
View File

@@ -119,7 +119,7 @@
<div class="web-big-padding-section-level-2 relative">
<div class="container">
<h1 class="web-display web-u-color-text-primary">Blog</h1>
<h1 class="text-display font-aeonik-pro text-primary">Blog</h1>
{#if featured}
{@const author = data.authors.find(
(author) => author.slug === featured.author
@@ -139,7 +139,7 @@
<li>{featured.timeToRead} min</li>
</ul>
<a href={featured.href}>
<h2 class="web-title web-u-color-text-primary">
<h2 class="text-title font-aeonik-pro text-primary">
{featured.title}
</h2>
</a>
@@ -184,7 +184,7 @@
<div class="web-container">
<h2
id="title"
class="web-title web-u-color-text-primary"
class="text-title font-aeonik-pro text-primary"
bind:this={articlesHeader}
>
Articles

2
src/routes/changelog/ChangelogEntry.svelte
View File

@@ -14,7 +14,7 @@
{/if}
<div class="padded">
<h2 class="web-title web-u-color-text-primary">
<h2 class="text-title font-aeonik-pro text-primary">
<a href={entry.href}>
{entry.title}
</a>

2
src/routes/changelog/[[page]]/+page.svelte
View File

@@ -48,7 +48,7 @@
<div class="pt-10">
<div class="web-big-padding-section-level-2">
<div class="container wrapper">
<h1 class="web-display web-u-color-text-primary">Changelog</h1>
<h1 class="text-display font-aeonik-pro text-primary">Changelog</h1>
<ul>
{#each data.entries as entry}
<li>

4
src/routes/changelog/entry/[entry]/+page.svelte
View File

@@ -85,7 +85,9 @@
<time datetime={data.date}>{formatDate(data.date)}</time>
</li>
</ul>
<h1 class="web-title web-u-color-text-primary">{data.title}</h1>
<h1 class="text-title font-aeonik-pro text-primary">
{data.title}
</h1>
<div class="share-post-section mt-4 flex items-center gap-4">
<span class="web-eyebrow pr-2" style:color="#adadb0"> SHARE </span>

62
src/routes/community/+page.svelte
View File

@@ -159,7 +159,7 @@
<div class="web-big-padding-section-level-2">
<section class="container web-u-padding-block-end-0 relative">
<div class="web-hero is-align-start web-u-max-width-580">
<h1 class="web-display web-u-color-text-primary">
<h1 class="text-display font-aeonik-pro text-primary">
Built by a community of 800+ contributors
</h1>
<div>
@@ -230,7 +230,7 @@
<div class="web-big-padding-section-level-2">
<div class="container relative">
<div class="web-hero is-mobile-center web-u-max-width-900 gap-5">
<h1 class="web-headline web-u-color-text-primary">
<h1 class="text-headline font-aeonik-pro text-primary">
The power of open source benefits us all
</h1>
<div>
@@ -258,7 +258,7 @@
<div class="web-big-padding-section-level-2">
<div class="container">
<div class="web-hero is-align-start">
<h2 class="web-display web-u-color-text-primary">Get involved</h2>
<h2 class="text-display font-aeonik-pro text-primary">Get involved</h2>
<div>
<p class="text-description">
With every contribution, Appwrite gets better for all of us. Start
@@ -276,9 +276,7 @@
flex gap-24"
>
<div>
<h3 class="web-label web-u-color-text-primary">
Check our Open Issues
</h3>
<h3 class="text-label text-primary">Check our Open Issues</h3>
<p class="web-main-body-500 mt-1">
Anyone can join and help Appwrite become better.
</p>
@@ -297,12 +295,10 @@
<thead class="web-table-line-head">
<tr class="web-table-line-row">
<th
class="web-table-line-cell web-u-color-text-primary whitespace-nowrap"
class="web-table-line-cell text-primary whitespace-nowrap"
>Issue #</th
>
<th class="web-table-line-cell web-u-color-text-primary"
>Title</th
>
<th class="web-table-line-cell text-primary">Title</th>
</tr>
</thead>
<tbody class="web-table-line-body">
@@ -344,7 +340,7 @@
</div>
<div class="web-big-padding-section-level-2">
<section class="container">
<h4 class="web-label web-u-color-text-primary">Other ways to help</h4>
<h4 class="text-label text-primary">Other ways to help</h4>
<ul
class="mt-5 grid gap-5 md:grid-cols-4 md:gap-8"
style="--grid-item-size:15rem"
@@ -353,9 +349,7 @@
<div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
>
<div class="web-sub-body-500 web-u-color-text-primary">
Create content
</div>
<div class="web-sub-body-500 text-primary">Create content</div>
<div class="web-sub-body-400">
Help others discover Appwrite with videos and blogs.
</div>
@@ -365,9 +359,7 @@
<div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
>
<div class="web-sub-body-500 web-u-color-text-primary">
Present at meetups
</div>
<div class="web-sub-body-500 text-primary">Present at meetups</div>
<div class="web-sub-body-400">
Share your experience and represent Appwrite in public.
</div>
@@ -377,9 +369,7 @@
<div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
>
<div class="web-sub-body-500 web-u-color-text-primary">
Report bugs
</div>
<div class="web-sub-body-500 text-primary">Report bugs</div>
<div class="web-sub-body-400">
Find bugs and submit PRs to fix them.
</div>
@@ -389,9 +379,7 @@
<div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
>
<div class="web-sub-body-500 web-u-color-text-primary">
Submit new ideas
</div>
<div class="web-sub-body-500 text-primary">Submit new ideas</div>
<div class="web-sub-body-400">
Suggest features, integrations, or SDKs for our roadmap.
</div>
@@ -401,7 +389,7 @@
<div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
>
<div class="web-sub-body-500 web-u-color-text-primary">
<div class="web-sub-body-500 text-primary">
Improve documentation
</div>
<div class="web-sub-body-400">
@@ -413,9 +401,7 @@
<div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
>
<div class="web-sub-body-500 web-u-color-text-primary">
Helping others
</div>
<div class="web-sub-body-500 text-primary">Helping others</div>
<div class="web-sub-body-400">
Support developers with their projects and contributions.
</div>
@@ -428,7 +414,7 @@
<section class="container web-u-sep-block-start web-u-padding-block-start-64">
<Carousel size="big">
<svelte:fragment slot="header">
<h4 class="web-label web-u-color-text-primary">Upcoming Events</h4>
<h4 class="text-label text-primary">Upcoming Events</h4>
</svelte:fragment>
{#each events as event}
<li>
@@ -452,7 +438,7 @@
<div class="web-big-padding-section-level-2">
<div class="container">
<div class="web-hero is-center">
<h2 class="web-display web-u-color-text-primary">
<h2 class="text-display font-aeonik-pro text-primary">
Inspire and get inspired
</h2>
<p class="text-description web-u-margin-block-start-0">
@@ -483,7 +469,7 @@
<div class="container">
<div class="web-grid-15-25-desktop web-u-row-gap-48 web-u-column-gap-96">
<div class="web-hero is-align-start web-u-max-width-380">
<div class="web-display web-u-color-text-primary">
<div class="text-display font-aeonik-pro text-primary">
Visit the community
</div>
<p class="text-description">
@@ -506,7 +492,9 @@
aria-label="Discord"
/>
</div>
<div class="web-title mt-auto">17K+ members</div>
<div class="text-title font-aeonik-pro mt-auto">
17K+ members
</div>
</a>
</li>
<li>
@@ -524,7 +512,9 @@
aria-label="X"
/>
</div>
<div class="web-title mt-auto">128K+ followers</div>
<div class="text-title font-aeonik-pro mt-auto">
128K+ followers
</div>
</a>
</li>
<li>
@@ -542,7 +532,7 @@
aria-label="GitHub"
/>
</div>
<div class="web-title mt-auto">
<div class="text-title font-aeonik-pro mt-auto">
{GITHUB_STARS}+ stargazers
</div>
</a>
@@ -562,7 +552,9 @@
aria-label="Youtube"
/>
</div>
<div class="web-title mt-auto">4K+ subscribers</div>
<div class="text-title font-aeonik-pro mt-auto">
4K+ subscribers
</div>
</a>
</li>
</ul>
@@ -580,7 +572,7 @@
class:web-u-max-width-380={!submitted}
>
<section class="flex flex-col gap-5">
<h1 class="web-title web-u-color-text-primary">
<h1 class="text-title font-aeonik-pro text-primary">
Appwrite insights
</h1>
<p class="text-description web-u-padding-block-end-40">

2
src/routes/community/EventCard.svelte
View File

@@ -50,7 +50,7 @@
<span class="">{location}</span>
</li>
</ul>
<svelte:element this={headingTag} class="web-sub-body-500 web-u-color-text-primary mt-1">
<svelte:element this={headingTag} class="web-sub-body-500 text-primary mt-1">
{title}
</svelte:element>
<p class="web-sub-body-500">

2
src/routes/community/ProjectCard.svelte
View File

@@ -27,7 +27,7 @@
rel="noopener noreferrer"
>
<div class="p-3">
<h3 class="web-main-body-500 web-u-color-text-primary">{title}</h3>
<h3 class="web-main-body-500 text-primary">{title}</h3>
<p class="line-clamp-2">
{description}
</p>

54
src/routes/company/+page.svelte
View File

@@ -38,7 +38,7 @@
class="web-hero"
style="--hero-max-inline-size:62.125rem; --hero-gap:1.125rem;"
>
<h1 class="web-headline web-u-color-text-primary">
<h1 class="text-headline font-aeonik-pro text-primary">
Unleashing creativity and innovation in every creator
</h1>
<div>
@@ -61,7 +61,7 @@
style="--grid-1-1-gap:2rem; --grid-1-1-gap-desktop:6.25rem;"
>
<div class="flex flex-col gap-8">
<h2 class="web-display web-u-color-text-primary">
<h2 class="text-display font-aeonik-pro text-primary">
Designed for and by developers
</h2>
<a
@@ -100,7 +100,7 @@
<div class="web-big-padding-section-level-2">
<div class="container">
<div class="web-hero is-center">
<h2 class="web-display web-u-color-text-primary">Our Story</h2>
<h2 class="text-display font-aeonik-pro text-primary">Our Story</h2>
<p class="text-description">
What once started as a passion project is now a beloved and awarded product that helps developers world wide to achieve more/unleash creativity and innovation.
</p>
@@ -115,7 +115,7 @@
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span>
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
A passion project called Appwrite
</h3>
<p class="web-main-body-400">
@@ -137,7 +137,7 @@
</div>
<div>
<div class="web-card is-white web-u-max-width-350">
<h6 class="web-label">0.1 - 0.4 released</h6>
<h6 class="text-label">0.1 - 0.4 released</h6>
<p class="web-sub-body-400 mt-3">Early stages of authentication, avatars, database, teams, and storage features</p>
</div>
</div>
@@ -148,7 +148,7 @@
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span>
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
Building the team
</h3>
<p class="aw -main-body-400">
@@ -162,7 +162,7 @@
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div>
<div class="web-card is-white web-u-max-width-168">
<h6 class="web-title">5k</h6>
<h6 class="text-title font-aeonik-pro">5k</h6>
<p class="web-sub-body-400 web-u-margin-block-start-6">GitHub Stars</p>
</div>
</div>
@@ -176,7 +176,7 @@
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span>
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
Community validation
</h3>
<p class="aw -main-body-400">
@@ -218,7 +218,7 @@
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span>
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
Continuous improvement
</h3>
<p class="aw -main-body-400">
@@ -247,7 +247,7 @@
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span>
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
Taking it to the Cloud
</h3>
<p class="aw -main-body-400">
@@ -278,7 +278,7 @@
<div class="web-big-padding-section-level-2">
<div class="container">
<div class="web-hero web-u-max-width-800">
<h4 class="web-display web-u-color-text-primary">
<h4 class="text-display font-aeonik-pro text-primary">
Backed by top investors
</h4>
<p class="text-description web-u-max-width-480 mx-auto">
@@ -371,12 +371,12 @@
</div>
<div class="web-big-padding-section-level-2">
<div class="container">
<h5 class="web-title web-u-color-text-primary text-center">Angel Investors</h5>
<h5 class="text-title font-aeonik-pro text-primary text-center">
Angel Investors
</h5>
<ul class="web-grid-2c-4c mt-12">
<li class="flex flex-col">
<h6 class="web-main-body-500 web-u-color-text-primary">
Aaron Applebaum
</h6>
<h6 class="web-main-body-500 text-primary">Aaron Applebaum</h6>
<p class="web-main-body-500">Partner</p>
<p class="web-main-body-500">MizMaa</p>
<ul class="mt-auto flex gap-2 pt-4">
@@ -405,9 +405,7 @@
</ul>
</li>
<li class="flex flex-col">
<h6 class="web-main-body-500 web-u-color-text-primary">
Ariel Maislos
</h6>
<h6 class="web-main-body-500 text-primary">Ariel Maislos</h6>
<p class="web-main-body-500">Angel Investor</p>
<p class="web-main-body-500">Former Apple IL CEO</p>
<ul class="mt-auto flex gap-2 pt-4">
@@ -436,14 +434,12 @@
</ul>
</li>
<li class="flex flex-col">
<h6 class="web-main-body-500 web-u-color-text-primary">Gilad Engel</h6>
<h6 class="web-main-body-500 text-primary">Gilad Engel</h6>
<p class="web-main-body-500">Angel Investor</p>
<ul class="mt-auto flex gap-2 pt-4" />
</li>
<li class="flex flex-col">
<h6 class="web-main-body-500 web-u-color-text-primary">
Krishna Visvanathan
</h6>
<h6 class="web-main-body-500 text-primary">Krishna Visvanathan</h6>
<p class="web-main-body-500">Co-founder & Partner</p>
<p class="web-main-body-500">Crane Venture Partners</p>
<ul class="mt-auto flex gap-2 pt-4">
@@ -461,7 +457,7 @@
</ul>
</li>
<li class="flex flex-col">
<h6 class="web-main-body-500 web-u-color-text-primary">Ameet Patel</h6>
<h6 class="web-main-body-500 text-primary">Ameet Patel</h6>
<p class="web-main-body-500">Angel Investor</p>
<ul class="mt-auto flex gap-2 pt-4">
<li>
@@ -478,7 +474,7 @@
</ul>
</li>
<li class="flex flex-col">
<h6 class="web-main-body-500 web-u-color-text-primary">Benno Jering</h6>
<h6 class="web-main-body-500 text-primary">Benno Jering</h6>
<p class="web-main-body-500">Partner</p>
<p class="web-main-body-500">Redline Capital</p>
<ul class="mt-auto flex gap-2 pt-4">
@@ -496,9 +492,7 @@
</ul>
</li>
<li class="flex flex-col">
<h6 class="web-main-body-500 web-u-color-text-primary">
James Lindenbaum
</h6>
<h6 class="web-main-body-500 text-primary">James Lindenbaum</h6>
<p class="web-main-body-500">Co-founder</p>
<p class="web-main-body-500">Heroku</p>
<ul class="mt-auto flex gap-2 pt-4">
@@ -516,7 +510,7 @@
</ul>
</li>
<li class="flex flex-col">
<h6 class="web-main-body-500 web-u-color-text-primary">Uri Boness</h6>
<h6 class="web-main-body-500 text-primary">Uri Boness</h6>
<p class="web-main-body-500">Co-Founder</p>
<p class="web-main-body-500">Elastic</p>
<ul class="mt-auto flex gap-2 pt-4">
@@ -548,8 +542,8 @@
/>
<div class="container">
<div class="web-hero web-u-max-width-380">
<h3 class="web-display web-u-color-text-primary">Join the team</h3>
<p class="web-u-color-text-primary web-u-opacity-64">
<h3 class="text-display font-aeonik-pro text-primary">Join the team</h3>
<p class="text-primary web-u-opacity-64">
Find your next career at Appwrite and join a team of remote workers.
</p>
<a

6
src/routes/contact-us/+page.svelte
View File

@@ -74,7 +74,7 @@
>
{#if submitted}
<section class="flex flex-col gap-5">
<h1 class="web-display web-u-color-text-primary">
<h1 class="text-display font-aeonik-pro text-primary">
Thank you for your message
</h1>
<p class="text-description web-u-padding-block-end-32">
@@ -91,7 +91,7 @@
</section>
{:else}
<section class="flex flex-col gap-5">
<h1 class="web-display web-u-color-text-primary">
<h1 class="text-display font-aeonik-pro text-primary">
Contact Us
</h1>
<p class="text-description web-u-padding-block-end-40">
@@ -103,7 +103,7 @@
<section
class="web-u-padding-block-start-40 web-u-sep-block-start flex flex-col gap-3"
>
<h2 class="web-label web-u-color-text-primary">Follow us</h2>
<h2 class="text-label text-primary">Follow us</h2>
<ul class="flex gap-2">
{#each socials as social}
<li>

2
src/routes/docs/+error.svelte
View File

@@ -11,7 +11,7 @@
<div class="container">
<div class="web-hero" style="--hero-gap:1.25rem;">
<span class="web-badges web-eyebrow !text-white">{$page.status}</span>
<h1 class="web-headline web-u-color-text-primary">
<h1 class="text-headline font-aeonik-pro text-primary">
{$page.error?.message ?? 'An error has occured'}
</h1>
{#if $page.status === 404}

52
src/routes/docs/+page.svelte
View File

@@ -77,7 +77,7 @@
</div>
<section class="web-hero is-align-start e-hero-docs relative">
<h1 class="web-display web-u-color-text-primary max-w-[600px]">
<h1 class="text-display font-aeonik-pro text-primary max-w-[600px]">
Learn how to build like a team of hundreds<span class="web-u-color-text-accent"
>_
</span>
@@ -88,7 +88,7 @@
</p>
</section>
<section class="web-hero is-align-start tech-hero">
<h2 class="web-title web-u-color-text-primary max-w-[600px]">
<h2 class="text-title font-aeonik-pro text-primary max-w-[600px]">
Get started with your technologies
</h2>
<p class="text-description max-w-[600px]">
@@ -120,7 +120,7 @@
<div class="bg-overlay" />
</section>
<section>
<h2 class="web-title web-u-color-text-primary max-w-[600px]">Show me some code</h2>
<h2 class="text-title font-aeonik-pro text-primary max-w-[600px]">Show me some code</h2>
<p class="text-description mt-4 max-w-[600px]">
If you learn best from code examples, follow one of our tutorials.
</p>
@@ -133,7 +133,9 @@
</Carousel>
</section>
<section class="web-hero is-align-start is-no-max-width">
<h2 class="web-title web-u-color-text-primary max-w-[600px]">Explore capabilities</h2>
<h2 class="text-title font-aeonik-pro text-primary max-w-[600px]">
Explore capabilities
</h2>
<p class="text-description max-w-[600px]">
All the core functionalities you need with a scalable and flexible API. Explore
Appwrite's product offerings.
@@ -156,7 +158,7 @@
width="48"
height="48"
/>
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">Auth</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Auth</h4>
<p class="web-sub-body-400 mt-1">
Sign in users with multiple OAuth providers.
</p>
@@ -178,9 +180,7 @@
width="48"
height="48"
/>
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">
Databases
</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Databases</h4>
<p class="web-sub-body-400 mt-1">
Store your application and user data.
</p>
@@ -202,9 +202,7 @@
width="48"
height="48"
/>
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">
Functions
</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Functions</h4>
<p class="web-sub-body-400 mt-1">
Extend and customize your server's functionality.
</p>
@@ -226,9 +224,7 @@
width="48"
height="48"
/>
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">
Messaging
</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Messaging</h4>
<p class="web-sub-body-400 mt-1">
Send and schedule email, SMS, and push notifications.
</p>
@@ -250,7 +246,7 @@
width="48"
height="48"
/>
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">Storage</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Storage</h4>
<p class="web-sub-body-400 mt-1">
Store images, videos, documents, and files.
</p>
@@ -272,7 +268,7 @@
width="48"
height="48"
/>
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">Realtime</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Realtime</h4>
<p class="web-sub-body-400 mt-1">
Respond to server events in realtime.
</p>
@@ -282,7 +278,7 @@
</div>
</section>
<section class="web-hero is-align-start is-no-max-width">
<h2 class="web-title web-u-color-text-primary max-w-[600px]">
<h2 class="text-title font-aeonik-pro text-primary max-w-[600px]">
Explore ways to integrate
</h2>
<p class="text-description max-w-[600px]">
@@ -293,7 +289,7 @@
<ul class="web-grid-row-2">
<li>
<a href="/docs/sdks" class="web-card is-normal">
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">SDKs</h4>
<h4 class="web-sub-body-500 text-primary mt-2">SDKs</h4>
<p class="web-sub-body-400 mt-1">
Light-weight SDKs for your favorite platforms.
</p>
@@ -301,7 +297,7 @@
</li>
<li>
<a href="/docs/apis/rest" class="web-card is-normal">
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">REST API</h4>
<h4 class="web-sub-body-500 text-primary mt-2">REST API</h4>
<p class="web-sub-body-400 mt-1">
Integrate with HTTP requests without the needing an SDK.
</p>
@@ -309,7 +305,7 @@
</li>
<li>
<a href="/docs/apis/graphql" class="web-card is-normal">
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">GraphQL</h4>
<h4 class="web-sub-body-500 text-primary mt-2">GraphQL</h4>
<p class="web-sub-body-400 mt-1">
Leverage GraphQL through our SDKs or integrate directly with REST
endpoints.
@@ -318,7 +314,7 @@
</li>
<li>
<a href="/docs/apis/realtime" class="web-card is-normal">
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">Realtime</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Realtime</h4>
<p class="web-sub-body-400 mt-1">
Respond to auth, databases, storage, and function events in
realtime.
@@ -329,7 +325,9 @@
</div>
</section>
<section class="web-hero is-align-start is-no-max-width">
<h2 class="web-title web-u-color-text-primary max-w-[600px]">Migrate to Appwrite</h2>
<h2 class="text-title font-aeonik-pro text-primary max-w-[600px]">
Migrate to Appwrite
</h2>
<p class="text-description max-w-[600px]">
Own your data with automatic data migrations.
</p>
@@ -337,9 +335,7 @@
<ul class="web-grid-row-4">
<li>
<a href="/docs/advanced/migrations/self-hosted" class="web-card is-normal">
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">
Self-hosted
</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Self-hosted</h4>
<p class="web-sub-body-400 mt-1">
Move data from self-hosted to Appwrite Cloud.
</p>
@@ -347,7 +343,7 @@
</li>
<li>
<a href="/docs/advanced/migrations/firebase" class="web-card is-normal">
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">Firebase</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Firebase</h4>
<p class="web-sub-body-400 mt-1">
Migrate users and data from Firebase to Appwrite.
</p>
@@ -355,7 +351,7 @@
</li>
<li>
<a href="/docs/advanced/migrations/supabase" class="web-card is-normal">
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">Supabase</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Supabase</h4>
<p class="web-sub-body-400 mt-1">
Migrate users and data from Supabase to Appwrite.
</p>
@@ -363,7 +359,7 @@
</li>
<li>
<a href="/docs/advanced/migrations/nhost" class="web-card is-normal">
<h4 class="web-sub-body-500 web-u-color-text-primary mt-2">Nhost</h4>
<h4 class="web-sub-body-500 text-primary mt-2">Nhost</h4>
<p class="web-sub-body-400 mt-1">
Migrate users and data from NHost to Appwrite.
</p>

2
src/routes/docs/CodeCard.svelte
View File

@@ -21,7 +21,7 @@
</div>
<article class="web-grid-articles-item-content">
<header class="web-articles-item-header">
<h3 class="web-sub-body-500 web-u-color-text-primary">{title}</h3>
<h3 class="web-sub-body-500 text-primary">{title}</h3>
</header>
<p
class="web-articles-item-paragraph web-sub-body-500 mt-1 line-clamp-2"

4
src/routes/docs/quick-starts/+page.svelte
View File

@@ -199,7 +199,7 @@
<header class="web-article-header">
<div class="web-article-header-start flex flex-col web-u-cross-start">
<div class="relative flex items-center">
<h1 class="web-title">Quick start</h1>
<h1 class="text-title font-aeonik-pro">Quick start</h1>
</div>
</div>
<div class="web-article-header-end" />
@@ -220,7 +220,7 @@
class="{quickStart.icon} web-u-font-size-24"
aria-hidden="true"
/>
<h4 class="web-sub-body-500 web-u-color-text-primary">
<h4 class="web-sub-body-500 text-primary">
{quickStart.title}
</h4>
</header>

10
src/routes/docs/references/[version]/[platform]/[service]/(components)/RateLimits.svelte
View File

@@ -51,7 +51,7 @@
using SSR with <code>setSession</code>, these rate limits will still apply.
<a
href="/docs/products/auth/server-side-rendering#rate-limits"
class="u-link web-u-color-text-primary"
class="u-link text-primary"
>
Learn more about SSR rate limits.
</a>
@@ -65,13 +65,13 @@
<thead class="web-table-header">
<tr class="web-table-row">
<th class="web-table-head-col">
<div class="web-eyebrow web-u-color-text-primary">Time frame</div>
<div class="web-eyebrow text-primary">Time frame</div>
</th>
<th class="web-table-head-col">
<div class="web-eyebrow web-u-color-text-primary">Attempts</div>
<div class="web-eyebrow text-primary">Attempts</div>
</th>
<th class="web-table-head-col">
<div class="web-eyebrow web-u-color-text-primary">Key</div>
<div class="web-eyebrow text-primary">Key</div>
</th>
</tr>
</thead>
@@ -98,7 +98,7 @@
</div>
</div>
<div class="">
<a href="/docs/advanced/platform/rate-limits" class="u-link web-u-color-text-primary">
<a href="/docs/advanced/platform/rate-limits" class="u-link text-primary">
<span>Learn more about rate limits</span>
<span class="web-icon-arrow-right" aria-hidden="true"></span>
</a>

2
src/routes/docs/references/[version]/[platform]/[service]/(components)/Request.svelte
View File

@@ -12,7 +12,7 @@
<li class:pt-4={!first}>
<article>
<header class="flex items-baseline gap-2">
<span class="web-code web-u-color-text-primary">
<span class="web-code text-primary">
{parameter.name}
</span>
<span class="web-caption-400">{parameter.type}</span>

2
src/routes/docs/references/[version]/[platform]/[service]/(components)/Response.svelte
View File

@@ -12,7 +12,7 @@
<li>
<article>
<header class="flex items-baseline gap-2">
<span class="web-eyebrow web-u-color-text-primary">
<span class="web-eyebrow text-primary">
{response.code}
</span>
<span class="web-caption-400">application/json</span>

6
src/routes/docs/references/[version]/[platform]/[service]/+page.svelte
View File

@@ -106,11 +106,11 @@
<article class="web-article contents">
<header class="web-article-header">
<div class="web-article-header-start">
<h1 class="web-title">{serviceName}</h1>
<h1 class="text-title font-aeonik-pro">{serviceName}</h1>
<div class="web-inline-code">{platformType}</div>
</div>
<div class="web-article-header-end">
<div class="gap-6 flex flex-col md:flex-row web-u-color-text-primary">
<div class="gap-6 flex flex-col md:flex-row text-primary">
<div class="flex items-center gap-2">
<label class="text-xs web-is-not-mobile" for="platform">Platform</label>
<Select
@@ -176,7 +176,7 @@
<div class="web-article-content-grid-6-4-column-2 flex flex-col gap-8">
<div class="web-inline-info">
<span class="icon-info" aria-hidden="true" />
<h5 class="web-sub-body-500 web-u-color-text-primary">
<h5 class="web-sub-body-500 text-primary">
No endpoint found for this version and platform
</h5>
Please switch to a newer version or different platform.

6
src/routes/docs/tutorials/+page.svelte
View File

@@ -61,7 +61,7 @@
<header class="web-article-header">
<div class="web-article-header-start flex flex-col web-u-cross-start">
<div class="relative flex items-center">
<h1 class="web-title">Tutorials</h1>
<h1 class="text-title font-aeonik-pro">Tutorials</h1>
</div>
</div>
<div class="web-article-header-end" />
@@ -85,7 +85,7 @@
class="{getIcon(tutorial)} web-u-font-size-24"
aria-hidden="true"
/>
<h3 class="web-sub-body-500 web-u-color-text-primary">
<h3 class="web-sub-body-500 text-primary">
{tutorial.framework}
</h3>
<span class="badge web-caption-400">Coming Soon</span>
@@ -98,7 +98,7 @@
class="{getIcon(tutorial)} web-u-font-size-24"
aria-hidden="true"
/>
<h3 class="web-sub-body-500 web-u-color-text-primary">
<h3 class="web-sub-body-500 text-primary">
{tutorial.framework}
</h3>
</header>

16
src/routes/heroes/+page.svelte
View File

@@ -140,7 +140,7 @@
<div class="web-big-padding-section-level-2">
<section class="container hero web-u-padding-block-end-0">
<div>
<h1 class="web-display web-u-color-text-primary">Appwrite Heroes</h1>
<h1 class="text-display font-aeonik-pro text-primary">Appwrite Heroes</h1>
<p class="web-main-body-500 mt-5">
If you love building, writing, speaking, and helping other developers
build with Appwrite, help us support you by joining the Appwrite Heroes
@@ -165,7 +165,9 @@
<div class="web-big-padding-section-level-2">
<section class="container">
<div class="web-hero web-u-max-width-800 about">
<h2 class="web-title web-u-color-text-primary">About Appwrite Heroes</h2>
<h2 class="text-title font-aeonik-pro text-primary">
About Appwrite Heroes
</h2>
<div>
<p class="web-sub-body-500">
The Appwrite Heroes program is an exclusive group of developers who
@@ -194,7 +196,9 @@
<div class="web-big-padding-section-level-2">
<div class="container">
<div class="web-hero">
<div class="web-display web-u-clr-primary">Meet our Heroes</div>
<div class="text-display font-aeonik-pro web-u-clr-primary">
Meet our Heroes
</div>
</div>
<ul class="web-multi-columns-1 mt-20">
{#each heroCards as heroCardProps}
@@ -228,7 +232,7 @@
<div class="web-big-padding-section-level-2">
<div class="container">
<section class="web-hero is-align-start">
<h2 class="web-display web-u-color-text-primary max-w-[700px]">
<h2 class="text-display font-aeonik-pro text-primary max-w-[700px]">
How Appwrite Heroes can benefit you
</h2>
</section>
@@ -324,8 +328,8 @@
<div class="web-big-padding-section-level-2 relative">
<div class="container">
<div class="web-hero web-u-max-width-800">
<h5 class="web-display web-u-color-text-primary">Become a Hero</h5>
<p class="text-description web-u-color-text-primary" style="opacity:0.64">
<h5 class="text-display font-aeonik-pro text-primary">Become a Hero</h5>
<p class="text-description text-primary" style="opacity:0.64">
Have you been actively providing value for the Appwrite community? Apply
now to join our hero program! Applications are open every three months.
</p>

8
src/routes/init-0/(components)/CountdownCard.svelte
View File

@@ -7,15 +7,15 @@
const { days, hours, minutes, seconds } = createCountdown(date);
</script>
<div class="web-card is-normal web-u-color-text-primary">
<div class="web-card is-normal text-primary">
<img src="/images/icons/gradients/lock.svg" alt="Lock" />
{#if $days > 1}
<p class="web-title">
<p class="text-title font-aeonik-pro">
{$days}
{$days > 1 ? 'days' : 'day'}<span class="web-u-color-text-accent">_</span>
</p>
{:else}
<div class="web-title">
<div class="text-title font-aeonik-pro">
<Counter value={$hours} />:<Counter value={$minutes} />:<Counter
value={$seconds}
/><span class="web-u-color-text-accent">_</span>
@@ -35,7 +35,7 @@
align-items: center;
}
.web-title {
.text-title font-aeonik-pro {
margin-block-start: 0.75rem;
}

8
src/routes/init-0/(components)/DayCard.svelte
View File

@@ -21,21 +21,21 @@
{#if hasReleased}
<div class="day">
<div class="circle" aria-hidden />
<span class="web-eyebrow web-u-color-text-primary"
<span class="web-eyebrow text-primary"
>Day {number}<span class="web-u-color-text-accent">_</span></span
>
<h2 class="web-label web-u-color-text-primary">{day.title}</h2>
<h2 class="text-label text-primary">{day.title}</h2>
<div class="slot-wrapper">
<slot />
</div>
</div>
{:else}
<div class="release">
<span class="web-eyebrow web-u-color-text-primary"
<span class="web-eyebrow text-primary"
>Day {number}<span class="web-u-color-text-accent">_</span></span
>
<div class="bottom">
<div class="countdown web-title">
<div class="countdown text-title font-aeonik-pro">
{#if $hours > 24}
{$days} {$days > 1 ? 'days' : 'day'}
{:else}

8
src/routes/init-0/(components)/Ticket.svelte
View File

@@ -189,9 +189,9 @@
{/if}
<div class="ticket" data-variant={variant} use:mouse style={styles}>
<img src={bg} alt="" class="bg" />
<p class="web-title web-u-color-text-primary">{name?.trim() || '-'}</p>
<p class="text-title font-aeonik-pro text-primary">{name?.trim() || '-'}</p>
{#if gh_user}
<p class="web-label">@{gh_user}</p>
<p class="text-label">@{gh_user}</p>
{/if}
<div class="bottom-left">
<img src={Logo} alt="init_" />
@@ -413,13 +413,13 @@
z-index: -1;
}
.web-title {
.text-title font-aeonik-pro {
font-size: adjusted(2.5);
line-height: #{math.div(44, 40)}em;
overflow-wrap: break-word;
}
.web-label {
.text-label {
font-size: adjusted(1.5);
line-height: #{math.div(28, 24)}em;
margin-block-start: adjusted(0.25);

2
src/routes/init-0/(days)/Day.svelte
View File

@@ -16,7 +16,7 @@
$: hasReleased = now >= release;
</script>
<h2 class="web-eyebrow web-u-color-text-primary">
<h2 class="web-eyebrow text-primary">
<div class="web-dot" />
{#if day !== undefined}
{day}<span class="web-u-color-text-accent">_</span>

16
src/routes/init-0/(days)/Day1.svelte
View File

@@ -20,7 +20,7 @@
style:padding="0"
>
<div style:padding="2rem" style:padding-block-end="0">
<h3 class="web-label web-u-color-text-primary">Messaging</h3>
<h3 class="text-label text-primary">Messaging</h3>
<p style:margin-block-start="0.625rem">
Introducing multimedia messaging service to communicate to your users across
platforms.
@@ -48,7 +48,7 @@
class="web-card is-normal has-border-gradient u-overflow-hidden"
style="padding: 1.25rem; --p-aspect-ratio: 0;"
>
<h3 class="web-label web-u-color-text-primary" style="max-width: 18.75rem">
<h3 class="text-label text-primary" style="max-width: 18.75rem">
How tools like Twilio can simplify messaging for developers
</h3>
<div class="web-card-link u-flex u-cross-center">
@@ -66,7 +66,7 @@
class="web-card is-normal has-border-gradient u-overflow-hidden"
style="padding: 20px"
>
<h3 class="web-label web-u-color-text-primary" style="max-width: 300px">
<h3 class="text-label text-primary" style="max-width: 300px">
Best practices for sending push notifications
</h3>
<div class="web-card-link u-flex u-cross-center">
@@ -84,9 +84,7 @@
style="padding: 0.5rem; display: flex; justify-content: space-between; "
>
<div style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary" style="max-width: 300px">
Product tour
</h3>
<h3 class="text-label text-primary" style="max-width: 300px">Product tour</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Watch</span>
<span class="web-icon-arrow-right" />
@@ -106,7 +104,7 @@
class="web-card is-normal has-border-gradient"
style="padding: 1.25rem"
>
<h3 class="web-label web-u-color-text-primary">Documentation</h3>
<h3 class="text-label text-primary">Documentation</h3>
<span class="web-card-link u-flex u-cross-center">
<span class="text">Learn more</span>
<span class="web-icon-arrow-right" />
@@ -117,7 +115,7 @@
class="web-card is-normal has-border-gradient"
style="padding: 1.25rem"
>
<h3 class="web-label web-u-color-text-primary">Win swag</h3>
<h3 class="text-label text-primary">Win swag</h3>
<span class="web-card-link u-flex u-cross-center">
<span class="text">Enter giveaway</span>
<span class="web-icon-arrow-right" />
@@ -131,7 +129,7 @@
style="padding: 0.5rem; display: flex; justify-content: space-between; "
>
<div style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary">Event: Welcome to Init</h3>
<h3 class="text-label text-primary">Event: Welcome to Init</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Join</span>
<span class="web-icon-arrow-right" />

14
src/routes/init-0/(days)/Day2.svelte
View File

@@ -19,7 +19,7 @@
style:padding="0"
>
<div style:padding="2rem" style:padding-block-end="0">
<h3 class="web-label web-u-color-text-primary">Server-side rendering</h3>
<h3 class="text-label text-primary">Server-side rendering</h3>
<p style:margin-block-start="0.625rem">
We introduce improved support for server-side rendering in Appwrite
Authentication.
@@ -47,9 +47,7 @@
class="web-card is-normal has-border-gradient u-overflow-hidden"
style="padding: 1.25rem; --p-aspect-ratio: 0;"
>
<h3 class="web-label web-u-color-text-primary" style="max-width: 18.75rem">
CSR vs SSR
</h3>
<h3 class="text-label text-primary" style="max-width: 18.75rem">CSR vs SSR</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Article</span>
<span class="web-icon-arrow-right" />
@@ -66,7 +64,7 @@
style="padding: 0.5rem; display: flex; justify-content: space-between; "
>
<div style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary">Event: Speed</h3>
<h3 class="text-label text-primary">Event: Speed</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Join</span>
<span class="web-icon-arrow-right" />
@@ -85,9 +83,7 @@
style="padding: 0.5rem; display: flex; justify-content: space-between; "
>
<div style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary" style="max-width: 300px">
Product tour
</h3>
<h3 class="text-label text-primary" style="max-width: 300px">Product tour</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Watch</span>
<span class="web-icon-arrow-right" />
@@ -106,7 +102,7 @@
class="web-card is-normal has-border-gradient"
style="padding: 1.25rem"
>
<h3 class="web-label web-u-color-text-primary">Documentation</h3>
<h3 class="text-label text-primary">Documentation</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Learn more</span>
<span class="web-icon-arrow-right" />

14
src/routes/init-0/(days)/Day3.svelte
View File

@@ -19,7 +19,7 @@
style:padding="0"
>
<div style:padding="2rem" style:padding-block-end="0">
<h3 class="web-label web-u-color-text-primary">Enum SDK support</h3>
<h3 class="text-label text-primary">Enum SDK support</h3>
<p style:margin-block-start="0.625rem">
A new feature that enhances the experience across all Appwrite client and
server-side SDKs.
@@ -38,7 +38,7 @@
style:padding="0"
>
<div style:padding="2rem" style:padding-block-end="0">
<h3 class="web-label web-u-color-text-primary">Two-factor authentication</h3>
<h3 class="text-label text-primary">Two-factor authentication</h3>
<p style:margin-block-start="0.625rem">
Add an additional layer of protection to your end users accounts with 2FA.
</p>
@@ -58,7 +58,7 @@
style="padding: 0.5rem; display: flex; justify-content: space-between; "
>
<div style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary">Event: Safety</h3>
<h3 class="text-label text-primary">Event: Safety</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Join</span>
<span class="web-icon-arrow-right" />
@@ -77,9 +77,7 @@
style="padding: 0.5rem; display: flex; justify-content: space-between; "
>
<div style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary" style="max-width: 300px">
Release video
</h3>
<h3 class="text-label text-primary" style="max-width: 300px">Release video</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Watch</span>
<span class="web-icon-arrow-right" />
@@ -99,7 +97,7 @@
class="web-card is-normal has-border-gradient"
style="padding: 1.25rem"
>
<h3 class="web-label web-u-color-text-primary">Enum Documentation</h3>
<h3 class="text-label text-primary">Enum Documentation</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Learn more</span>
<span class="web-icon-arrow-right" />
@@ -110,7 +108,7 @@
class="web-card is-normal has-border-gradient"
style="padding: 1.25rem"
>
<h3 class="web-label web-u-color-text-primary">2FA Documentation</h3>
<h3 class="text-label text-primary">2FA Documentation</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Learn more</span>
<span class="web-icon-arrow-right" />

14
src/routes/init-0/(days)/Day4.svelte
View File

@@ -21,7 +21,7 @@
style:padding="0"
>
<div style:padding="2rem" style:padding-block-end="0">
<h3 class="web-label web-u-color-text-primary">Database operators</h3>
<h3 class="text-label text-primary">Database operators</h3>
<p style:margin-block-start="0.625rem">
Announcing a new set of query methods, array contains, string contains, and OR
operators.
@@ -52,9 +52,7 @@
style="padding: 0.5rem; display: flex; justify-content: space-between; "
>
<div style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary" style="max-width: 300px">
Event: Logic
</h3>
<h3 class="text-label text-primary" style="max-width: 300px">Event: Logic</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Join</span>
<span class="web-icon-arrow-right" />
@@ -72,7 +70,7 @@
class="web-card is-normal has-border-gradient u-overflow-hidden"
style="padding: 20px"
>
<h3 class="web-label web-u-color-text-primary" style="max-width: 11.25rem">
<h3 class="text-label text-primary" style="max-width: 11.25rem">
Understanding Data Queries
</h3>
<div class="web-card-link u-flex u-cross-center">
@@ -90,9 +88,7 @@
style="padding: 0.5rem; display: flex; justify-content: space-between; "
>
<div style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary" style="max-width: 300px">
Product tour
</h3>
<h3 class="text-label text-primary" style="max-width: 300px">Product tour</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Watch</span>
<span class="web-icon-arrow-right" />
@@ -111,7 +107,7 @@
class="web-card is-normal has-border-gradient"
style="padding: 1.25rem"
>
<h3 class="web-label web-u-color-text-primary">Documentation</h3>
<h3 class="text-label text-primary">Documentation</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Learn more</span>
<span class="web-icon-arrow-right" />

8
src/routes/init-0/(days)/Day5.svelte
View File

@@ -15,7 +15,7 @@
style:padding="0"
>
<div style:padding="2rem" style:padding-block-end="0">
<h3 class="web-label web-u-color-text-primary">Updated runtimes</h3>
<h3 class="text-label text-primary">Updated runtimes</h3>
<p style:margin-block-start="0.625rem">
The latest versions of Bun, Dart, Deno, PHP, Ruby, Kotlin, Java, Swift, and Node
were added to our Cloud runtime ecosystem.
@@ -33,7 +33,7 @@
class="web-card is-normal has-border-gradient"
style="padding: 1.25rem"
>
<h3 class="web-label web-u-color-text-primary">Documentation</h3>
<h3 class="text-label text-primary">Documentation</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Learn more</span>
<span class="web-icon-arrow-right" />
@@ -47,9 +47,7 @@
style="padding: 0.5rem; display: flex; justify-content: space-between; "
>
<div style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary" style="max-width: 300px">
Closing party
</h3>
<h3 class="text-label text-primary" style="max-width: 300px">Closing party</h3>
<div class="web-card-link u-flex u-cross-center">
<span class="text">Watch</span>
<span class="web-icon-arrow-right" />

12
src/routes/init-0/+page.svelte
View File

@@ -171,7 +171,7 @@
transition:fade={{ delay: 0, duration: 600 }}
>
<h3
class="web-title web-u-color-text-primary"
class="text-title font-aeonik-pro text-primary"
id="kickoff"
style:scroll-margin-top="5rem"
>
@@ -197,7 +197,7 @@
{:else if i === 4}
<Day5 {date} release={day.release} />
{:else}
<h2 class="web-eyebrow web-u-color-text-primary">
<h2 class="web-eyebrow text-primary">
<div class="web-dot" />
{date}
<span class="web-u-color-text-accent">_</span>
@@ -212,7 +212,7 @@
<div class="container">
<Carousel size="big">
<svelte:fragment slot="header">
<h2 class="web-label web-u-color-text-primary">Upcoming Events</h2>
<h2 class="text-label text-primary">Upcoming Events</h2>
</svelte:fragment>
{#each events as event}
<li>
@@ -235,9 +235,7 @@
<div class="tickets-preview">
<div class="container">
<div>
<h2 class="web-label web-u-color-text-primary">
Init 1.0 ran from February 26 to March 1
</h2>
<h2 class="text-label text-primary">Init 1.0 ran from February 26 to March 1</h2>
</div>
<div class="web-card is-normal has-border-gradient">
@@ -274,7 +272,7 @@
<div class="pre-footer">
<div class="container">
<div class="text">
<h2 class="web-label web-u-color-text-primary">Start building with Appwrite</h2>
<h2 class="text-label text-primary">Start building with Appwrite</h2>
<p class="web-main-body-500">
Appwrite's open-source platform lets you add Auth, DBs, Functions and Storage to
your product and build any application at any scale, own your data, and use your

6
src/routes/init-0/tickets/+page.svelte
View File

@@ -33,10 +33,10 @@
<Main>
<div class="hero">
<div class="desktop-left">
<h1 class="web-display">
<h1 class="text-display font-aeonik-pro">
<span style:font-weight="500">
<span class="web-u-color-text-primary">init</span><span
class="web-u-color-text-accent">_</span
<span class="text-primary">init</span><span class="web-u-color-text-accent"
>_</span
>
</span>
launched on February 26th, 2024

10
src/routes/init-0/tickets/[id]/+page.svelte
View File

@@ -41,15 +41,15 @@
<div class="hero">
<div class="desktop-left">
<div class="header">
<h1 class="web-display">
Join <span class="web-u-color-text-primary" style:font-weight="500">
<h1 class="text-display font-aeonik-pro">
Join <span class="text-primary" style:font-weight="500">
init<span class="web-u-color-text-accent">_</span>
</span><br />26 Feb - 1 March
</h1>
</div>
<div class="info">
<p class="web-label u-margin-block-start-16">
<p class="text-label u-margin-block-start-16">
Register today and claim your Init ticket.
</p>
<div class="u-flex u-cross-center u-gap-16 u-margin-block-start-32">
@@ -57,9 +57,7 @@
<span class="text">Get my Init ticket</span>
</a>
<button class="web-button is-secondary" on:click={copy}>
<span
class="web-icon-{$copied ? 'check' : 'copy'} web-u-color-text-primary"
/>
<span class="web-icon-{$copied ? 'check' : 'copy'} text-primary" />
<span class="text">Copy ticket URL</span>
</button>

19
src/routes/init-0/tickets/customize/+page.svelte
View File

@@ -83,7 +83,10 @@
<span>Back</span>
</button>
<h1 class="web-title web-u-color-text-primary" style:margin-block-start="1.5rem">
<h1
class="text-title font-aeonik-pro text-primary"
style:margin-block-start="1.5rem"
>
Customize ticket<span class="web-u-color-text-accent">_</span>
</h1>
@@ -94,13 +97,13 @@
{:else}
<div class="desktop-left">
<div class="header">
<h1 class="web-title web-u-color-text-primary">
<h1 class="text-title font-aeonik-pro text-primary">
Thank you for registering for
<span style:font-weight="500">
init<span class="web-u-color-text-accent">_</span>
</span>
</h1>
<p class="web-label u-margin-block-start-16">
<p class="text-label u-margin-block-start-16">
You have received ticket #{id?.toString().padStart(6, '0')}
</p>
</div>
@@ -115,11 +118,7 @@
<div class="u-flex u-cross-center u-gap-16 u-margin-block-start-16">
<button class="web-button is-full-width is-secondary" on:click={copy}>
<div
class="web-icon-{$copied
? 'check'
: 'copy'} web-u-color-text-primary"
/>
<div class="web-icon-{$copied ? 'check' : 'copy'} text-primary" />
<span class="text">Copy ticket URL</span>
</button>
<a
@@ -127,7 +126,7 @@
href="https://twitter.com/intent/tweet?text={twitterText}"
target="_blank"
>
<div class="web-icon-x web-u-color-text-primary" />
<div class="web-icon-x text-primary" />
<span class="text">Share your ticket</span>
</a>
</div>
@@ -158,7 +157,7 @@
<div class="drawer" data-state={drawerOpen ? 'open' : 'closed'}>
<button on:click={() => (drawerOpen = !drawerOpen)}>
<div class="inner">
<span class="web-label web-u-color-text-primary">Ticket Editor</span>
<span class="text-label text-primary">Ticket Editor</span>
<span class="web-icon-chevron-down" />
</div>
</button>

16
src/routes/init-0/tickets/customize/form.svelte
View File

@@ -76,7 +76,7 @@
<hr />
{#if ticket.gh_user}
<div class="u-flex u-cross-center u-gap-8 web-u-color-text-primary">
<div class="u-flex u-cross-center u-gap-8 text-primary">
<img src="/images/icons/colored/check.svg" alt="" />
<span class="web-sub-body-500">GitHub account connected</span>
</div>
@@ -100,12 +100,12 @@
}}
disabled={!browser}
>
<div class="web-icon-github web-u-color-text-primary" />
<div class="web-icon-github text-primary" />
<span class="text">(DEBUG) Log-out of GitHub</span>
</button>
{/if}
{:else}
<h2 class="web-sub-body-500 web-u-color-text-primary">Integrate your GitHub account</h2>
<h2 class="web-sub-body-500 text-primary">Integrate your GitHub account</h2>
<p class="web-sub-body-500" style:margin-block-start="0.25rem">
Sign in with your GitHub account and see the magic happen in your ticket.
</p>
@@ -113,7 +113,7 @@
class="web-button is-full-width is-secondary u-margin-block-start-24"
on:click={loginGithub}
>
<div class="web-icon-github web-u-color-text-primary" />
<div class="web-icon-github text-primary" />
<span class="text">Log in to GitHub account</span>
</button>
{/if}
@@ -121,7 +121,7 @@
<hr />
{#if ticket.aw_email}
<div class="u-flex u-cross-center u-gap-8 web-u-color-text-primary">
<div class="u-flex u-cross-center u-gap-8 text-primary">
<img src="/images/icons/colored/check.svg" alt="" />
<span class="web-sub-body-500">Appwrite account connected</span>
</div>
@@ -130,7 +130,7 @@
Your ticket has been upgraded.
</p>
{:else}
<h2 class="web-sub-body-500 web-u-color-text-primary">Integrate your Appwrite account</h2>
<h2 class="web-sub-body-500 text-primary">Integrate your Appwrite account</h2>
<p class="web-sub-body-500" style:margin-block-start="0.25rem">
Sign in with your Appwrite account and see the magic happen in your ticket.
</p>
@@ -138,13 +138,13 @@
href="{PUBLIC_APPWRITE_DASHBOARD}/login?forceRedirect={$page.url.origin}/init-0/tickets"
class="web-button is-full-width is-secondary u-margin-block-start-24"
>
<div class="web-icon-appwrite web-u-color-text-primary" />
<div class="web-icon-appwrite text-primary" />
<span class="text">Log in to Appwrite account</span>
</a>
{/if}
<hr />
<h2 class="web-sub-body-500 web-u-color-text-primary">Add your tribe</h2>
<h2 class="web-sub-body-500 text-primary">Add your tribe</h2>
<p class="web-sub-body-500" style:margin-block-start="0.25rem">
Customize your Init ticket with your technology.
</p>

2
src/routes/init/(components)/CallToAction.svelte
View File

@@ -10,7 +10,7 @@
<div class="call-to-action">
<div class="container">
<div class="text">
<h2 class="web-title web-u-color-text-primary">{title}</h2>
<h2 class="text-title font-aeonik-pro text-primary">{title}</h2>
<p class="web-main-body-500">
{description}
</p>

8
src/routes/init/(components)/CountdownCard.svelte
View File

@@ -7,15 +7,15 @@
const { days, hours, minutes, seconds } = createCountdown(date);
</script>
<div class="web-card is-normal web-u-color-text-primary">
<div class="web-card is-normal text-primary">
<img src="/images/icons/gradients/lock.svg" alt="Lock" />
{#if $hours > 24}
<p class="web-title">
<p class="text-title font-aeonik-pro">
{$days}
{$days > 1 ? 'days' : 'day'}
</p>
{:else}
<div class="web-title" style="--height:3rem;--line-height:3rem;">
<div class="text-title font-aeonik-pro" style="--height:3rem;--line-height:3rem;">
<Counter value={$hours} />:<Counter value={$minutes} />:<Counter value={$seconds} />
</div>
{/if}
@@ -34,7 +34,7 @@
background-color: hsl(var(--web-color-subtle));
}
.web-title {
.text-title font-aeonik-pro {
margin-block-start: 0.75rem;
}

8
src/routes/init/(components)/DayCard.svelte
View File

@@ -25,14 +25,14 @@
{#if hasReleased}
<div style:z-index="10" style="margin-top: auto; margin-bottom: 0;">
<span
class="web-u-color-text-primary web-u-uppercase"
class="text-primary web-u-uppercase"
style:opacity="0.6"
style:margin-bottom="-8px"
style:display="block"
>
{day.subtitle}
</span>
<h2 class="web-label web-u-color-text-primary">
<h2 class="text-label text-primary">
{day.title}<span class="web-u-color-text-accent">_</span>
</h2>
</div>
@@ -43,14 +43,14 @@
{:else}
<div style:z-index="10" style="margin-top: auto; margin-bottom: 0;">
<span
class="web-u-color-text-primary web-eyebrow web-u-uppercase"
class="text-primary web-eyebrow web-u-uppercase"
style:margin-bottom="-8px"
style:display="block"
>
{day.subtitle} <span class="web-u-color-text-accent">_</span>
</span>
<h2
class="web-title web-u-color-text-primary"
class="text-title font-aeonik-pro text-primary"
style="--height:3rem;--line-height:3rem;"
>
{#if $hours > 24}

2
src/routes/init/(components)/EventCard.svelte
View File

@@ -49,7 +49,7 @@
</li>
{/if}
</ul>
<svelte:element this={headingTag} class="web-sub-body-500 web-u-color-text-primary mt-1">
<svelte:element this={headingTag} class="web-sub-body-500 text-primary mt-1">
{title}
</svelte:element>
<p class="web-sub-body-500">

2
src/routes/init/(components)/EventCarousel.svelte
View File

@@ -75,7 +75,7 @@
<div class="container">
<Carousel size="medium">
<svelte:fragment slot="header">
<h4 class="web-label web-u-color-text-primary">Upcoming Events</h4>
<h4 class="text-label text-primary">Upcoming Events</h4>
</svelte:fragment>
{#each events as event}
<li>

2
src/routes/init/(components)/Giveaway.svelte
View File

@@ -6,7 +6,7 @@
<div class="wrapper">
<div class="container">
<div class="details">
<h3 class="web-label">Get a ticket and enter our special Init giveaway</h3>
<h3 class="text-label">Get a ticket and enter our special Init giveaway</h3>
<p class="web-u-color-text-secondary">
Create, customize, and share your Init ticket to enter our general giveaway.
</p>

2
src/routes/init/(components)/shared/Announcement.svelte
View File

@@ -12,7 +12,7 @@
<a href={url} class="web-card is-normal has-border-gradient" style:padding="0">
<div style:padding="1.25rem" style:padding-block-end="0" style:max-width="32rem">
<h3 class="web-label web-u-color-text-primary">{title}</h3>
<h3 class="text-label text-primary">{title}</h3>
<p style:margin-block-start="0.625rem">
{description}
</p>

5
src/routes/init/(components)/shared/Article.svelte
View File

@@ -16,10 +16,7 @@
<a href={url} class="web-card is-normal has-border-gradient overflow-hidden" style:padding="0">
<div style:padding="1.25rem">
<h3
class="web-label web-u-color-text-primary"
style="max-width: 18.75rem;text-wrap:pretty;"
>
<h3 class="text-label text-primary" style="max-width: 18.75rem;text-wrap:pretty;">
{title}
</h3>
<div class="web-card-link flex items-center" style:margin-top="8px">

2
src/routes/init/(components)/shared/BigVideo.svelte
View File

@@ -18,7 +18,7 @@
<div class="web-card is-normal has-border-gradient overflow-hidden" style="padding: 0.5rem;">
<Video {thumbnail} {src}>
<div class="details">
<h3 class="web-label web-u-color-text-primary">
<h3 class="text-label text-primary">
{title}
</h3>
<div class="web-card-link flex items-center">

4
src/routes/init/(components)/shared/Media.svelte
View File

@@ -17,7 +17,7 @@
style="padding: 0.5rem;"
>
<div class="details" style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary">
<h3 class="text-label text-primary">
{title}
</h3>
<div class="web-card-link flex items-center" style:margin-top="8px">
@@ -32,7 +32,7 @@
{:else}
<div class="web-card is-normal has-border-gradient overflow-hidden" style="padding: 0.5rem;">
<div class="details" style="padding: 0.75rem;">
<h3 class="web-label web-u-color-text-primary">
<h3 class="text-label text-primary">
{title}
</h3>
<div class="web-card-link flex items-center">

8
src/routes/init/(components)/ticket/Ticket.svelte
View File

@@ -131,11 +131,11 @@
<div class="wrapper">
<div class="ticket" use:onMouse style={styles}>
<div class="lockup">
<p class="web-title web-u-color-text-primary">
<p class="text-title font-aeonik-pro text-primary">
{name?.trim() || '-'}
</p>
<p class="web-label">{title}</p>
<p class="text-label">{title}</p>
<div class="logo" style:width="75%">
{#if disableEffects}
@@ -363,7 +363,7 @@
border-radius: pxToRem(16);
overflow: hidden;
.web-label {
.text-label {
position: absolute;
font-size: clamp(12px, 1vw, 16px);
}
@@ -385,7 +385,7 @@
}
}
}
.web-title {
.text-title font-aeonik-pro {
font-size: clamp(20px, 1vw, 24px);
line-height: 1;
}

8
src/routes/init/(components)/ticket/TicketActions.svelte
View File

@@ -51,7 +51,7 @@
<div class="flex gap-4">
{#if ticket.gh_user}
<div class="flex items-center gap-2">
<div class="web-u-color-text-primary flex items-center gap-2">
<div class="text-primary flex items-center gap-2">
<span class="web-sub-body-500">Connected to GitHub</span>
</div>
@@ -62,7 +62,7 @@
</div>
{:else}
<button class="web-button is-secondary" on:click={loginGithub}>
<div class="web-icon-github web-u-color-text-primary" />
<div class="web-icon-github text-primary" />
<span class="text">Log in to GitHub</span>
</button>
{/if}
@@ -89,7 +89,7 @@
<div class="action-buttons flex gap-2">
<button class="web-button is-secondary" on:click={copy}>
<div class="web-icon-{$copied ? 'check' : 'copy'} web-u-color-text-primary" />
<div class="web-icon-{$copied ? 'check' : 'copy'} text-primary" />
<span class="text">Copy URL</span>
</button>
<a
@@ -97,7 +97,7 @@
href="https://twitter.com/intent/tweet?text={twitterText}"
target="_blank"
>
<div class="web-icon-x web-u-color-text-primary" />
<div class="web-icon-x text-primary" />
<span class="text">Share</span>
</a>
</div>

2
src/routes/init/(days)/Day.svelte
View File

@@ -16,7 +16,7 @@
$: hasReleased = now >= release;
</script>
<h2 class="web-eyebrow web-u-color-text-primary">
<h2 class="web-eyebrow text-primary">
<div class="web-dot" />
{#if day !== undefined}
{day}<span class="web-u-color-text-accent">_</span>

2
src/routes/init/+page.svelte
View File

@@ -107,7 +107,7 @@
{:else if i === 4}
<Day4 release={day.release} />
{:else}
<h2 class="web-eyebrow web-u-color-text-primary">
<h2 class="web-eyebrow text-primary">
<div class="web-dot" />
{date}
<span class="web-u-color-text-accent">_</span>

10
src/routes/init/tickets/+page.svelte
View File

@@ -69,13 +69,11 @@
<div class="signup">
<div class="info">
<hgroup>
<h1 class="web-display">
<h1 class="text-display font-aeonik-pro">
<span style:font-weight="500">init</span>
launches on August 19th
</h1>
<p class="web-label web-u-color-text-primary">
Register today and claim your Init ticket
</p>
<p class="text-label text-primary">Register today and claim your Init ticket</p>
</hgroup>
<div class="buttons">
<button class="web-button" on:click={loginGithub}>
@@ -84,10 +82,10 @@
</button>
</div>
<p class="privacy">
By registering, you agree to our <a href="/terms" class="web-link is-inline"
By registering, you agree to our <a href="/terms" class="web-link underline"
>Terms and Conditions</a
>
and <a href="/privacy" class="web-link is-inline">Privacy Policy</a>
and <a href="/privacy" class="web-link underline">Privacy Policy</a>
</p>
</div>
<div class="shadow"></div>

13
src/routes/init/tickets/[id]/+page.svelte
View File

@@ -40,23 +40,20 @@
<div class="hero">
<div class="desktop-left">
<div class="header">
<h1 class="web-display">
Join <span class="web-u-color-text-primary" style:font-weight="500">
init
</span><br />August 19th-23rd
<h1 class="text-display font-aeonik-pro">
Join <span class="text-primary" style:font-weight="500"> init </span><br
/>August 19th-23rd
</h1>
</div>
<div class="info">
<p class="web-label mt-4">Register today and claim your ticket.</p>
<p class="text-label mt-4">Register today and claim your ticket.</p>
<div class="mt-8 flex items-center gap-4">
<a class="web-button" href="/init/tickets">
<span class="text">Get my ticket</span>
</a>
<button class="web-button is-secondary" on:click={copy}>
<span
class="web-icon-{$copied ? 'check' : 'copy'} web-u-color-text-primary"
/>
<span class="web-icon-{$copied ? 'check' : 'copy'} text-primary" />
<span class="text">Copy ticket URL</span>
</button>

12
src/routes/init/tickets/customize/+page.svelte
View File

@@ -71,15 +71,13 @@
<div class="hero">
<div class="desktop-left">
<div class="header">
<h1 class="web-display">
Ready, set, <span class="web-u-color-text-primary" style:font-weight="500">
init
</span>
<h1 class="text-display font-aeonik-pro">
Ready, set, <span class="text-primary" style:font-weight="500"> init </span>
</h1>
</div>
<div class="info">
<p class="web-label mt-4">
<p class="text-label mt-4">
Join us during the week of August 19–23 to celebrate everything new with
Appwrite.
</p>
@@ -134,12 +132,12 @@
}
}
.web-display {
.text-display font-aeonik-pro {
margin-bottom: -48px;
}
@media screen and (min-width: 768px) {
.web-display {
.text-display font-aeonik-pro {
margin-bottom: 0;
}
}

24
src/routes/integrations/+page.svelte
View File

@@ -106,10 +106,10 @@
<div
class="l-integrations-hero web-u-max-width-680 flex flex-col justify-center gap-5"
>
<div class="web-eyebrow web-u-color-text-primary">
<div class="web-eyebrow text-primary">
INTEGRATIONS<span class="web-u-color-text-accent">_</span>
</div>
<h1 class="web-headline web-u-color-text-primary">
<h1 class="text-headline font-aeonik-pro text-primary">
Discover infinite possibilities
</h1>
<p class="text-description">
@@ -226,9 +226,7 @@
{#if hasQuery}
<section class="l-max-size-list-cards-section flex flex-col gap-8">
<header class="flex flex-col gap-1">
<h2 class="web-label web-u-color-text-primary">
Search results
</h2>
<h2 class="text-label text-primary">Search results</h2>
<p class="text-description">
{result.length > 0 ? result.length : 'No'} results found
for "{$query}"
@@ -261,9 +259,7 @@
<div
class="flex items-center justify-between gap-2"
>
<h4
class="web-u-color-text-primary mt-3"
>
<h4 class="text-primary mt-3">
{item.title}
</h4>
</div>
@@ -279,7 +275,7 @@
{:else}
<section class="flex flex-col gap-8">
<header class="flex flex-col gap-1">
<h2 class="web-label web-u-color-text-primary">Featured</h2>
<h2 class="text-label text-primary">Featured</h2>
<p class="text-description">Top recommended integrations</p>
</header>
@@ -343,7 +339,7 @@
}}
>
<header class="flex flex-col gap-1">
<h2 class="web-label web-u-color-text-primary">
<h2 class="text-label text-primary">
{category}
</h2>
<p class="text-description">
@@ -378,9 +374,7 @@
></span>
</div>
<h4
class="web-u-color-text-primary mt-3"
>
<h4 class="text-primary mt-3">
{integration.title}
</h4>
<p
@@ -425,7 +419,9 @@
<section
class="web-hero web-u-max-width-580 flex items-center justify-center gap-4"
>
<h2 class="web-display text-center web-u-color-text-primary max-w-[600px]">
<h2
class="text-display font-aeonik-pro text-center text-primary max-w-[600px]"
>
Become a Technology Partner
</h2>
<p class="web-main-body-500">

8
src/routes/integrations/technology-partner/+page.svelte
View File

@@ -91,7 +91,7 @@
>
{#if submitted}
<section class="flex flex-col gap-5">
<h1 class="web-display web-u-color-text-primary">
<h1 class="text-display font-aeonik-pro text-primary">
Thank you for applying
</h1>
<p class="text-description web-u-padding-block-end-32">
@@ -108,7 +108,7 @@
</section>
{:else}
<section class="flex flex-col gap-5">
<h4 class="web-display web-u-color-text-primary">
<h4 class="text-display font-aeonik-pro text-primary">
Become a Technology Partner
</h4>
<p class="text-description">
@@ -121,9 +121,7 @@
<section
class="web-u-sep-block-start mt-10 flex flex-col gap-3 pt-10"
>
<h2 class="web-label web-u-color-text-primary">
Follow us
</h2>
<h2 class="text-label text-primary">Follow us</h2>
<ul class="flex gap-2">
{#each socials as social}
<li>

6
src/routes/oss-program/+page.svelte
View File

@@ -84,7 +84,7 @@
>
{#if submitted}
<section class="flex flex-col gap-5">
<h1 class="web-display web-u-color-text-primary">
<h1 class="text-display font-aeonik-pro text-primary">
Thank you for your application
</h1>
<p class="text-description web-u-padding-block-end-32">
@@ -100,7 +100,7 @@
</section>
{:else}
<section class="flex flex-col gap-5">
<h1 class="web-display web-u-color-text-primary">
<h1 class="text-display font-aeonik-pro text-primary">
OSS program
</h1>
<p class="text-description web-u-padding-block-end-40">
@@ -113,7 +113,7 @@
<section
class="web-u-padding-block-start-40 web-u-sep-block-start flex flex-col gap-3"
>
<h2 class="web-label web-u-color-text-primary">Follow us</h2>
<h2 class="text-label text-primary">Follow us</h2>
<ul class="flex gap-2">
{#each socials as social}
<li>

29
src/routes/pricing/+page.svelte
View File

@@ -50,7 +50,7 @@
<section class="container">
<div class="web-hero">
<h1
class="web-display web-u-max-width-700 web-u-opacity-90 web-u-mobile-align-text-center self-center"
class="text-display font-aeonik-pro web-u-max-width-700 web-u-opacity-90 web-u-mobile-align-text-center self-center"
style="background: linear-gradient(90deg, #F47298 0%, #E4E1E5 61.98%, #E4E4E7 100%);
-webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; padding-block-end:2px;"
>
@@ -70,8 +70,10 @@
>
<div class="web-pricing-cards-item">
<header class="web-pricing-cards-header">
<h2 id="starter" class="web-label">Free</h2>
<div class="web-title web-u-color-text-primary mt-2">
<h2 id="starter" class="text-label">Free</h2>
<div
class="text-title font-aeonik-pro text-primary mt-2"
>
$0
</div>
<div class="mt-1">&nbsp;</div>
@@ -116,8 +118,10 @@
>
<div class="web-pricing-cards-item">
<header class="web-pricing-cards-header">
<h2 id="pro" class="web-label">Pro</h2>
<div class="web-title web-u-color-text-primary mt-2">
<h2 id="pro" class="text-label">Pro</h2>
<div
class="text-title font-aeonik-pro text-primary mt-2"
>
$15
</div>
<div class="mt-1">per member/month</div>
@@ -164,8 +168,10 @@
>
<div class="web-pricing-cards-item">
<header class="web-pricing-cards-header">
<h2 id="scale" class="web-label">Scale</h2>
<div class="web-title web-u-color-text-primary mt-2">
<h2 id="scale" class="text-label">Scale</h2>
<div
class="text-title font-aeonik-pro text-primary mt-2"
>
$599
</div>
<div class="mt-1">per organization/month</div>
@@ -207,10 +213,7 @@
style="background:rgba(35, 35, 37, 0.90);"
>
<header class="flex gap-3">
<h3
id="enterprises"
class="web-main-body-500 web-u-color-text-primary"
>
<h3 id="enterprises" class="web-main-body-500 text-primary">
Enterprises
</h3>
<div class="web-inline-tag is-pink">Coming Soon</div>
@@ -232,7 +235,7 @@
<header class="flex gap-3">
<h3
id="open-source-teams"
class="web-main-body-500 web-u-color-text-primary"
class="web-main-body-500 text-primary"
>
Open-source teams
</h3>
@@ -260,7 +263,7 @@
<div class="container relative" style:z-index="10">
<section class="web-grid-4-6">
<header>
<div class="web-display web-u-color-text-primary">FAQ</div>
<div class="text-display font-aeonik-pro text-primary">FAQ</div>
</header>
<Faq />
</section>

12
src/routes/pricing/compare-plans.svelte
View File

@@ -368,7 +368,7 @@
shouldShowTable = !e.detail;
}}
>
<h3 class="web-title web-u-color-text-primary">Compare plans</h3>
<h3 class="text-title font-aeonik-pro text-primary">Compare plans</h3>
<p class="web-main-body-500 mt-4">
Discover our plans and find the one that fits your project’s needs.
</p>
@@ -398,7 +398,7 @@
style:transition="inset-block-start 0.3s ease"
>
<div
class="text-description web-u-color-text-primary self-center"
class="text-description text-primary self-center"
style:opacity={browser ? 1 : 0}
style:position={browser ? 'relative' : undefined}
>
@@ -424,7 +424,7 @@
</div>
<div class="web-mini-card">
<div class="flex flex-wrap items-center justify-between gap-4">
<h4 class="web-label web-u-color-text-primary">Free</h4>
<h4 class="text-label text-primary">Free</h4>
<a
href="https://cloud.appwrite.io/register"
class="web-button is-secondary"
@@ -435,7 +435,7 @@
</div>
<div class="web-mini-card">
<div class="flex flex-wrap items-center justify-between gap-4">
<h4 class="web-label web-u-color-text-primary">Pro</h4>
<h4 class="text-label text-primary">Pro</h4>
<a
class="web-button"
href="https://cloud.appwrite.io/console?type=createPro"
@@ -449,7 +449,7 @@
</div>
<div class="web-mini-card">
<div class="flex flex-wrap items-center justify-between gap-4">
<h4 class="web-label web-u-color-text-primary">Scale</h4>
<h4 class="text-label text-primary">Scale</h4>
<button class="web-button is-secondary" disabled>
<span class="web-sub-body-500">Coming soon</span>
</button>
@@ -477,7 +477,7 @@
}}
>
<caption
class="web-compare-table-caption text-description web-u-color-text-primary text-left"
class="web-compare-table-caption text-description text-primary text-left"
use:melt={$heading({ level: 3 })}
style:position={browser ? 'unset' : undefined}
>

24
src/routes/pricing/faq.svelte
View File

@@ -9,7 +9,7 @@
}[] = [
{
question: 'Can I self-host Appwrite for free?',
answer: 'Yes! Appwrite Self Hosted will always be Open Source and free for you to use, without any limits. You can find the latest version of Appwrite in our <a rel="noopener noreferrer" class="web-link is-inline" href="https://github.com/appwrite/appwrite">GitHub repository</a>, and you can follow <a class="web-link is-inline" href="/docs/advanced/self-hosting/">Self Hosting docs</a> to learn how to install Appwrite on your server.'
answer: 'Yes! Appwrite Self Hosted will always be Open Source and free for you to use, without any limits. You can find the latest version of Appwrite in our <a rel="noopener noreferrer" class="web-link underline" href="https://github.com/appwrite/appwrite">GitHub repository</a>, and you can follow <a class="web-link underline" href="/docs/advanced/self-hosting/">Self Hosting docs</a> to learn how to install Appwrite on your server.'
},
// {
// question: 'Does Appwrite have a trial period?',
@@ -17,27 +17,27 @@
// },
{
question: 'What payment methods does Appwrite support?',
answer: 'Appwrite currently supports <a class="web-link is-inline" href="/docs/advanced/platform/billing#payment-methods">credit and debit card payments</a>. We are actively working on adding support for more methods. Please <a class="web-link is-inline" href="/contact-us">contact us</a> in case this is an issue for you.'
answer: 'Appwrite currently supports <a class="web-link underline" href="/docs/advanced/platform/billing#payment-methods">credit and debit card payments</a>. We are actively working on adding support for more methods. Please <a class="web-link underline" href="/contact-us">contact us</a> in case this is an issue for you.'
},
{
question: 'What happens if I reach a resource limit in my Pro plan?',
answer: 'Your project will continue to run, and additional charges will apply. You can find the costs for additional resources in the <a class="web-link is-inline" href="/pricing">pricing plans comparison</a>. We will also send you email reminders when you hit 75% and 100% of your resource limits. To avoid unexpected payments, you can set up a <a class="web-link is-inline" href="/docs/advanced/platform/pro#budget-cap">budget cap</a> on your organization. <a class="web-link is-inline" href="/docs/advanced/platform/pro#reaching-resource-limits">Learn more in our docs</a>.'
answer: 'Your project will continue to run, and additional charges will apply. You can find the costs for additional resources in the <a class="web-link underline" href="/pricing">pricing plans comparison</a>. We will also send you email reminders when you hit 75% and 100% of your resource limits. To avoid unexpected payments, you can set up a <a class="web-link underline" href="/docs/advanced/platform/pro#budget-cap">budget cap</a> on your organization. <a class="web-link underline" href="/docs/advanced/platform/pro#reaching-resource-limits">Learn more in our docs</a>.'
},
{
question: 'What happens if I reach a resource limit in my Free plan?',
answer: 'Your project will freeze, and Appwrite Console will continue running in read-only mode. You need to upgrade to Pro, remove resources that exceed their limit, or wait for the next billing cycle, which resets usage limits. <a class="web-link is-inline" href="/docs/advanced/platform/pro#reaching-resource-limits">Learn more in our docs</a>.'
answer: 'Your project will freeze, and Appwrite Console will continue running in read-only mode. You need to upgrade to Pro, remove resources that exceed their limit, or wait for the next billing cycle, which resets usage limits. <a class="web-link underline" href="/docs/advanced/platform/pro#reaching-resource-limits">Learn more in our docs</a>.'
},
{
question: 'Why does Appwrite ask for payment verification for up to $150?',
answer: 'The Reserve Bank of India (RBI) mandates additional security measures for recurring payments on Indian cards. Appwrite is obligated to ask for verification before billing your card. Appwrite asks for verification for up to $150 in case you use add-ons, but will not charge more than the actual amount used or your budget cap. If you need higher limits, <a class="web-link is-inline" href="mailto:billing@appwrite.io">contact us</a>.'
answer: 'The Reserve Bank of India (RBI) mandates additional security measures for recurring payments on Indian cards. Appwrite is obligated to ask for verification before billing your card. Appwrite asks for verification for up to $150 in case you use add-ons, but will not charge more than the actual amount used or your budget cap. If you need higher limits, <a class="web-link underline" href="mailto:billing@appwrite.io">contact us</a>.'
},
{
question: 'How can I join the OSS program?',
answer: `The OSS program is exclusively for active open-source maintainers using Appwrite Cloud. You can find more information on how to join the program in our <a class="web-link is-inline" href="/blog/post/announcing-the-appwrite-oss-program">announcement blog</a>.`
answer: `The OSS program is exclusively for active open-source maintainers using Appwrite Cloud. You can find more information on how to join the program in our <a class="web-link underline" href="/blog/post/announcing-the-appwrite-oss-program">announcement blog</a>.`
},
{
question: 'How can I join the Startups program?',
answer: `Are you a founder looking to build with Appwrite? Learn more about our Startups program on our Startups <a class="web-link is-inline" href="/startups">landing page.</a>.`
answer: `Are you a founder looking to build with Appwrite? Learn more about our Startups program on our Startups <a class="web-link underline" href="/startups">landing page.</a>.`
},
{
question: 'I have a Free plan account. How do I upgrade to a paid plan?',
@@ -59,7 +59,7 @@
{
question:
'I work with sensitive data and need to sign a BAA. Does Appwrite provide this?',
answer: 'Yes, you can sign a BAA with Appwrite. Learn more about our security and compliance in our <a class="web-link is-inline" href="/docs/advanced/security">documentation</a>.'
answer: 'Yes, you can sign a BAA with Appwrite. Learn more about our security and compliance in our <a class="web-link underline" href="/docs/advanced/security">documentation</a>.'
}
];
@@ -88,11 +88,11 @@
class="flex w-full items-center justify-between gap-2.5 py-6 text-left"
use:melt={$trigger(`${index}`)}
>
<span class="web-label web-u-color-text-primary">
<span class="text-label text-primary">
{faqItem.question}
</span>
<div
class="icon web-u-color-text-primary self-start transition-transform"
class="icon text-primary self-start transition-transform"
class:rotate-180={$isSelected(`${index}`)}
>
<span class="icon-cheveron-down" aria-hidden="true" />
@@ -116,10 +116,10 @@
{:else}
<details class="collapsible-wrapper" open={index === 0}>
<summary class="collapsible-button">
<span class="web-label web-u-color-text-primary">
<span class="text-label text-primary">
{faqItem.question}
</span>
<div class="icon web-u-color-text-primary">
<div class="icon text-primary">
<span class="icon-cheveron-down" aria-hidden="true" />
</div>
</summary>

2
src/routes/products/messaging/(components)/Accordion/AccordionItem.svelte
View File

@@ -14,7 +14,7 @@
<div use:melt={$item(index.toString())}>
<button use:melt={$trigger(index.toString())}>
<slot name="trigger" />
<div class="web-icon-chevron-down web-u-color-text-primary" />
<div class="web-icon-chevron-down text-primary" />
</button>
{#if $isSelected(index.toString())}
<div use:melt={$content(index.toString())} transition:slide={{ duration: 250 }}>

8
src/routes/products/messaging/(components)/Draft.svelte
View File

@@ -50,10 +50,10 @@
</ul>
</div>
<div class="content">
<h4 class="web-label web-u-color-text-primary">Message</h4>
<h4 class="text-label text-primary">Message</h4>
<hr />
<label class="web-u-color-text-primary" for="title">Title</label>
<label class="text-primary" for="title">Title</label>
<input
class="web-input-text"
style="max-width: 80%"
@@ -63,7 +63,7 @@
bind:value={title}
maxlength="48"
/>
<label class="web-u-color-text-primary" for="message">Message</label>
<label class="text-primary" for="message">Message</label>
<textarea
class="web-input-text"
style="max-width: 80%"
@@ -92,7 +92,7 @@
</div>
</div>
<div class="text">
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
Draft and preview your message before delivering it
</h3>
<p class="text-description mt-6">

4
src/routes/products/messaging/(components)/Schedule.svelte
View File

@@ -26,7 +26,7 @@
<div class="web-icon-chevron-left" />
</button>
<div class="flex items-center gap-4">
<div class="web-label web-u-color-text-primary" use:melt={$heading}>
<div class="text-label text-primary" use:melt={$heading}>
{$headingValue}
</div>
<button
@@ -79,7 +79,7 @@
</div>
</div>
<h3 class="web-title web-u-color-text-primary">Schedule your messages</h3>
<h3 class="text-title font-aeonik-pro text-primary">Schedule your messages</h3>
<p class="text-description">Send messages immediately or schedule them for future delivery.</p>
</Step>

4
src/routes/products/messaging/(components)/Send.svelte
View File

@@ -11,7 +11,9 @@
<div class="android">
<img src={AndroidSvg} alt="" class="android" />
<h3 class="web-title web-u-color-text-primary">Communicate across multiple channels</h3>
<h3 class="text-title font-aeonik-pro text-primary">
Communicate across multiple channels
</h3>
<p class="text-description">
Pick one or more channels for you to deliver your message to your user.
</p>

2
src/routes/products/messaging/(components)/Step.svelte
View File

@@ -5,7 +5,7 @@
<div class="step" data-hideline={hideLine}>
<div class="web-dot" />
<h2 class="web-eyebrow web-u-color-text-primary step-title">{title}</h2>
<h2 class="web-eyebrow text-primary step-title">{title}</h2>
<div class="step-content mt-8">
<slot />
</div>

8
src/routes/products/messaging/(components)/Target.svelte
View File

@@ -235,7 +235,7 @@
/>
<foreignObject x={textPos[0]} y={textPos[1]} width="360" height="64">
<span class="web-eyebrow web-u-color-text-primary" data-active={$selected[i]}>
<span class="web-eyebrow text-primary" data-active={$selected[i]}>
{device.value}
</span>
</foreignObject>
@@ -281,7 +281,7 @@
</svg>
<div class="users-modal">
<h3 class="web-label web-u-color-text-primary">Select subscribers</h3>
<h3 class="text-label text-primary">Select subscribers</h3>
<Accordion>
<ul class="accordion-items">
{#each users as user, i}
@@ -320,7 +320,7 @@
return next;
}}
/>
<span class="web-sub-body-500 web-u-color-text-primary">
<span class="web-sub-body-500 text-primary">
{user.name}
</span>
<span class="web-caption-400">
@@ -368,7 +368,7 @@
</div>
<div class="target-text mt-4 flex flex-col items-center gap-6">
<h3 class="web-title web-u-color-text-primary text-center">
<h3 class="text-title font-aeonik-pro text-primary text-center">
Target and group your subscribers
</h3>
<p class="text-description text-center" style:max-inline-size="580px">

34
src/routes/products/messaging/+page.svelte
View File

@@ -255,12 +255,12 @@ messaging.create_email(
<div>
<div class="product">
<img src="/images/icons/illustrated/dark/messaging.png" alt="" />
<span class="web-eyebrow web-u-color-text-primary">
<span class="web-eyebrow text-primary">
Messaging<span class="web-u-color-text-accent">_</span>
</span>
<span class="web-hero-banner-button web-eyebrow">BETA</span>
</div>
<h1 class="web-display web-u-color-text-primary">
<h1 class="text-display font-aeonik-pro text-primary">
Open source messaging service for developers
</h1>
<p class="text-description mt-5">
@@ -293,7 +293,7 @@ messaging.create_email(
<div class="container">
<section class="web-hero is-align-start">
<span class="web-badges web-eyebrow !text-white">capabilities_</span>
<h2 class="web-display web-u-color-text-primary max-w-[700px]">
<h2 class="text-display font-aeonik-pro text-primary max-w-[700px]">
All of your messages in one place
</h2>
</section>
@@ -477,13 +477,13 @@ messaging.create_email(
<div class="container">
<div class="web-hero is-align-start">
<span class="web-badges web-eyebrow !text-white">SDKs_</span>
<h2 class="web-display web-u-color-text-primary max-w-[700px]">
<h2 class="text-display font-aeonik-pro text-primary max-w-[700px]">
Start today with your preferred technologies
</h2>
</div>
<div class="code-snippets divide-border-primary mt-64 grid grid-cols-2 gap-16">
<div class="flex min-w-0 flex-col gap-2">
<h3 class="web-label web-u-color-text-primary">Subscribe to a topic</h3>
<h3 class="text-label text-primary">Subscribe to a topic</h3>
<p class="text-description">
Subscribe to receive all messages related to a topic.
</p>
@@ -497,7 +497,7 @@ messaging.create_email(
</div>
</div>
<div class="flex min-w-0 flex-col gap-2">
<h3 class="web-label web-u-color-text-primary">Send a message</h3>
<h3 class="text-label text-primary">Send a message</h3>
<p class="text-description">
Send a message to all targets on a topic.
</p>
@@ -516,9 +516,7 @@ messaging.create_email(
<section class="web-u-sep-block-start web-u-padding-block-start-80 py-10">
<div class="container">
<h4 class="web-label web-u-color-text-primary text-center">
Keep exploring our products
</h4>
<h4 class="text-label text-primary text-center">Keep exploring our products</h4>
<ul
class="mt-8 grid gap-8"
style="grid-template-columns: repeat(auto-fill, minmax(18rem, 1fr))"
@@ -539,7 +537,7 @@ messaging.create_email(
width="32"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">Auth</h4>
<h4 class="web-main-body-400 text-primary">Auth</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div>
<p class="web-sub-body-400">
@@ -564,9 +562,7 @@ messaging.create_email(
width="32"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">
Functions
</h4>
<h4 class="web-main-body-400 text-primary">Functions</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div>
<p class="web-sub-body-400">
@@ -592,9 +588,7 @@ messaging.create_email(
width="37"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">
Databases
</h4>
<h4 class="web-main-body-400 text-primary">Databases</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div>
<p class="web-sub-body-400">
@@ -619,9 +613,7 @@ messaging.create_email(
width="32"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">
Storage
</h4>
<h4 class="web-main-body-400 text-primary">Storage</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div>
<p class="web-sub-body-400">
@@ -646,9 +638,7 @@ messaging.create_email(
width="32"
height="32"
/>
<h4 class="web-main-body-400 web-u-color-text-primary">
Realtime
</h4>
<h4 class="web-main-body-400 text-primary">Realtime</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div>
<p class="web-sub-body-400">

36
src/routes/startups/+page.svelte
View File

@@ -174,7 +174,7 @@
class="web-hero"
style="--hero-max-inline-size:49.375rem; --hero-gap:1.125rem;"
>
<h1 class="web-headline web-u-color-text-primary">
<h1 class="text-headline font-aeonik-pro text-primary">
Build your startup with Appwrite
</h1>
<p
@@ -204,7 +204,7 @@
alt=""
/>
<div class="flex flex-col gap-2 text-center">
<h2 class="web-label web-u-color-text-primary">Complete backend</h2>
<h2 class="text-label text-primary">Complete backend</h2>
<p class="web-main-body-500">
Get access to Appwrite’s Scale plan and build your entire
backend with Appwrite.
@@ -219,7 +219,7 @@
alt=""
/>
<div class="flex flex-col gap-2 text-center">
<h2 class="web-label web-u-color-text-primary">Cloud credits</h2>
<h2 class="text-label text-primary">Cloud credits</h2>
<p class="web-main-body-500">
Get Appwrite Cloud Scale for 12 months and reduce risk at an
early stage.
@@ -234,7 +234,7 @@
alt=""
/>
<div class="flex flex-col gap-2 text-center">
<h2 class="web-label web-u-color-text-primary">Priority support</h2>
<h2 class="text-label text-primary">Priority support</h2>
<p class="web-main-body-500">
Get community support and priority email support from the
Appwrite team.
@@ -257,7 +257,7 @@
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;"
>
<div class="flex flex-col gap-4">
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
Ship faster
</h3>
<p class="web-main-body-500">
@@ -318,7 +318,7 @@
<img alt="" src={UsageGraphs} />
</div>
<div class="web-u-flex-basis-380 flex flex-col gap-4">
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
Scalable architecture
</h3>
<p class="web-main-body-500">
@@ -365,7 +365,7 @@
style="--grid-1-1-gap: 2.5rem; --grid-1-1-gap-desktop: 6.5rem;"
>
<div class="flex flex-col gap-4">
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
Built-in security and compliance
</h3>
<p class="web-main-body-500">
@@ -451,7 +451,7 @@
>
</div>
<div
class="web-user-box-content web-caption-400 web-u-color-text-primary"
class="web-user-box-content web-caption-400 text-primary"
>
Hello devs! I am getting a CORS
error when sending a request to the
@@ -482,7 +482,7 @@
>
</div>
<div
class="web-user-box-content web-caption-400 web-u-color-text-primary"
class="web-user-box-content web-caption-400 text-primary"
>
Hey Louis! Is this the message you
get
@@ -518,7 +518,7 @@
>
</div>
<div
class="web-user-box-content web-caption-400 web-u-color-text-primary"
class="web-user-box-content web-caption-400 text-primary"
>
Yes!
</div>
@@ -547,7 +547,7 @@
>
</div>
<div
class="web-user-box-content web-caption-400 web-u-color-text-primary"
class="web-user-box-content web-caption-400 text-primary"
>
You should be able to debug this
with a few steps. Just follow this
@@ -566,7 +566,7 @@
</div>
</div>
<div class="web-mx-auto-mobile ml-auto flex flex-col gap-4">
<h3 class="web-title web-u-color-text-primary">
<h3 class="text-title font-aeonik-pro text-primary">
Power of open source community
</h3>
<p class="web-main-body-500">
@@ -606,7 +606,9 @@
<div
class="web-big-padding-section-level-2 web-u-overflow-hidden e-mt-50-desktop e-mt-38-mobile"
>
<h4 class="web-title web-u-color-text-primary mx-auto max-w-[350px] text-center">
<h4
class="text-title font-aeonik-pro text-primary mx-auto max-w-[350px] text-center"
>
Focus on building your product
</h4>
<div class="scroll-carousel" use:infiniteScroll>
@@ -679,7 +681,7 @@
class:web-u-max-width-380={!submitted}
>
<section class="flex flex-col gap-5">
<h4 class="web-title web-u-color-text-primary">
<h4 class="text-title font-aeonik-pro text-primary">
Join the Appwrite Startups program
</h4>
<p class="text-description">
@@ -713,14 +715,14 @@
class="web-u-max-width-380 web-u-max-inline-size-none-mobile relative z-[1] mx-auto flex flex-col gap-2 text-center"
>
<h6
class="web-label e-mobile-fix-1 flex items-center justify-center gap-2"
class="text-label e-mobile-fix-1 flex items-center justify-center gap-2"
>
<img
class="shrink-0"
src="/images/icons/colored/check.svg"
alt=""
/>
<span class="web-u-color-text-primary"
<span class="text-primary"
>Thank you for your submission</span
>
</h6>
@@ -816,7 +818,7 @@
<div class="container relative" style:z-index="10">
<section class="web-grid-4-6">
<header>
<div class="web-display web-u-color-text-primary">FAQ</div>
<div class="text-display font-aeonik-pro text-primary">FAQ</div>
</header>
<Faq />
</section>

14
src/routes/startups/faq.svelte
View File

@@ -29,7 +29,7 @@
},
{
question: 'What are the limits of the Scale plan?',
answer: 'The Appwrite Scale plan has ample room for growth and can handle production applications of all sizes. We have set generous limits to ensure most applications can grow comfortably within those limits without incurring high bills. Please review our <a class="web-link is-inline" href="/pricing">pricing page</a> for a full overview of the Scale plan limits.'
answer: 'The Appwrite Scale plan has ample room for growth and can handle production applications of all sizes. We have set generous limits to ensure most applications can grow comfortably within those limits without incurring high bills. Please review our <a class="web-link underline" href="/pricing">pricing page</a> for a full overview of the Scale plan limits.'
},
{
question: 'What happens if we scale overnight?',
@@ -37,7 +37,7 @@
},
{
question: "What's included in the Appwrite for Startups program?",
answer: 'Startups joining the program get access to everything Appwrite Scale offers. This includes Cloud credits, unlimited team members, and premium email support. In addition, we provide you with special swag, and you get a program manager and a private Discord channel. Read more about it in our <a class="web-link is-inline" href="/blog/post/announcing-appwrite-startups-program">announcement</a>.'
answer: 'Startups joining the program get access to everything Appwrite Scale offers. This includes Cloud credits, unlimited team members, and premium email support. In addition, we provide you with special swag, and you get a program manager and a private Discord channel. Read more about it in our <a class="web-link underline" href="/blog/post/announcing-appwrite-startups-program">announcement</a>.'
},
{
question: 'What kind of support do we get?',
@@ -51,7 +51,7 @@
{
question:
'I am already using another backend as a service provider. How do I migrate to Appwrite?',
answer: 'We have a <a class="web-link is-inline" href="/docs/advanced/migrations">migration tool</a> to help you transition from other platforms. If you need additional assistance, we are here to help.'
answer: 'We have a <a class="web-link underline" href="/docs/advanced/migrations">migration tool</a> to help you transition from other platforms. If you need additional assistance, we are here to help.'
},
{
question: 'What happens after the 12 months run out?',
@@ -93,11 +93,11 @@
class="flex w-full items-center justify-between gap-2.5 py-6 text-left"
use:melt={$trigger(`${index}`)}
>
<span class="web-label web-u-color-text-primary">
<span class="text-label text-primary">
{faqItem.question}
</span>
<div
class="icon web-u-color-text-primary self-start transition-transform"
class="icon text-primary self-start transition-transform"
class:rotate-180={$isSelected(`${index}`)}
>
<span class="icon-cheveron-down" aria-hidden="true" />
@@ -121,10 +121,10 @@
{:else}
<details class="collapsible-wrapper" open={index === 0}>
<summary class="collapsible-button">
<span class="web-label web-u-color-text-primary">
<span class="text-label text-primary">
{faqItem.question}
</span>
<div class="icon web-u-color-text-primary">
<div class="icon text-primary">
<span class="icon-cheveron-down" aria-hidden="true" />
</div>
</summary>

2
src/routes/subscription/verify/+page.svelte
View File

@@ -33,7 +33,7 @@
<div class="container">
<div class="web-hero" style="--hero-gap:1.25rem;">
<span class="web-badges web-eyebrow !text-white">verification</span>
<h1 class="web-headline web-u-color-text-primary">
<h1 class="text-headline font-aeonik-pro text-primary">
{#if error}
Error
{:else}

Some files were not shown because too many files have changed in this diff Show More