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

change all text to new tw

Browse Source
This commit is contained in:
Jesse Winton
2024-09-05 16:30:53 -04:00
parent 6eb2ce7848
commit ae31167db2
91 changed files with 409 additions and 374 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/UI/Tabs/List.svelte
View File

@@ -23,7 +23,7 @@
use:melt={$trigger(tab)} use:melt={$trigger(tab)}
> >
<slot {tab}> <slot {tab}>
<span class="web-main-body-500">{tab}</span> <span class="text-body font-medium">{tab}</span>
</slot> </slot>
</button> </button>
</li> </li>

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

@@ -238,7 +238,7 @@
> >
{#if scrollInfo.percentage > -0.1} {#if scrollInfo.percentage > -0.1}
<span <span
class="web-badges web-eyebrow !text-white" class="web-badges text-micro uppercase text-white"
transition:slide={{ axis: 'x' }}>Products_</span transition:slide={{ axis: 'x' }}>Products_</span
> >

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

@@ -5,7 +5,7 @@
<div class="outside"> <div class="outside">
<div class="wrapper"> <div class="wrapper">
<span class="web-badges web-eyebrow !text-white">Products_</span> <span class="web-badges text-micro uppercase text-white">Products_</span>
<h2 class="text-display font-aeonik-pro text-primary mt-4"> <h2 class="text-display font-aeonik-pro text-primary mt-4">
Your backend, minus the hassle Your backend, minus the hassle

4
src/lib/animations/Products/auth/box.svelte
View File

@@ -44,8 +44,8 @@
<div class="pseudo-table"> <div class="pseudo-table">
<div class="header"> <div class="header">
<span class="web-eyebrow">Name</span> <span class="text-micro uppercase">Name</span>
<span class="web-eyebrow">Identifier</span> <span class="text-micro uppercase">Identifier</span>
</div> </div>
{#each authData as user (user.id)} {#each authData as user (user.id)}
<div <div

4
src/lib/animations/Products/databases/box.svelte
View File

@@ -8,8 +8,8 @@
<div class="pseudo-table"> <div class="pseudo-table">
<div class="header"> <div class="header">
<span class="web-eyebrow">Document ID</span> <span class="text-micro uppercase">Document ID</span>
<span class="web-eyebrow">Task</span> <span class="text-micro uppercase">Task</span>
</div> </div>
{#each $state.tasks.slice(0, $state.tableSlice) as task (task.id)} {#each $state.tasks.slice(0, $state.tableSlice) as task (task.id)}
<div class="row" transition:slide={{ duration: 150 }} animate:flip={{ duration: 150 }}> <div class="row" transition:slide={{ duration: 150 }} animate:flip={{ duration: 150 }}>

6
src/lib/animations/Products/messaging/box.svelte
View File

@@ -8,9 +8,9 @@
<div class="pseudo-table"> <div class="pseudo-table">
<div class="header"> <div class="header">
<span class="web-eyebrow">Message ID</span> <span class="text-micro uppercase">Message ID</span>
<span class="web-eyebrow">Type</span> <span class="text-micro uppercase">Type</span>
<span class="web-eyebrow" style:text-align="center">Status</span> <span class="text-micro uppercase" style:text-align="center">Status</span>
</div> </div>
{#each $state.messages.slice(0, $state.tableSlice) as task (task.id)} {#each $state.messages.slice(0, $state.tableSlice) as task (task.id)}
<div class="row" transition:slide={{ duration: 150 }} animate:flip={{ duration: 150 }}> <div class="row" transition:slide={{ duration: 150 }} animate:flip={{ duration: 150 }}>

6
src/lib/animations/Products/storage/box.svelte
View File

@@ -8,9 +8,9 @@
<div class="pseudo-table"> <div class="pseudo-table">
<div class="header"> <div class="header">
<span class="web-eyebrow">Filename</span> <span class="text-micro uppercase">Filename</span>
<span class="web-eyebrow">Type</span> <span class="text-micro uppercase">Type</span>
<span class="web-eyebrow">Size</span> <span class="text-micro uppercase">Size</span>
</div> </div>
{#each $state.files as file (file.src)} {#each $state.files as file (file.src)}
<div class="row" in:slide={{ duration: 150 }} animate:flip={{ duration: 150 }}> <div class="row" in:slide={{ duration: 150 }} animate:flip={{ duration: 150 }}>

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

@@ -37,8 +37,8 @@
alt={author} alt={author}
/> />
<div class="web-author-info"> <div class="web-author-info">
<h4 class="web-sub-body-400 text-primary">{author}</h4> <h4 class="text-sub-body text-primary">{author}</h4>
<ul class="web-metadata web-caption-400 web-is-not-mobile"> <ul class="web-metadata text-caption web-is-not-mobile">
<li> <li>
{formatDate(date)} {formatDate(date)}
</li> </li>

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

@@ -53,7 +53,7 @@
style="flex-wrap: wrap-reverse;" style="flex-wrap: wrap-reverse;"
> >
<div class="flex items-center gap-4"> <div class="flex items-center gap-4">
<h5 class="web-main-body-600 text-primary">Was this page helpful?</h5> <h5 class="text-body font-semibold text-primary">Was this page helpful?</h5>
<div class="flex gap-2"> <div class="flex gap-2">
<button <button
class="web-radio-button" class="web-radio-button"
@@ -79,7 +79,7 @@
</div> </div>
</div> </div>
<div class="web-content-footer-header-end"> <div class="web-content-footer-header-end">
<ul class="web-metadata web-caption-400"> <ul class="web-metadata text-caption">
{#if date} {#if date}
<li>Last updated on {new Date(date)?.toLocaleDateString()}</li> <li>Last updated on {new Date(date)?.toLocaleDateString()}</li>
{/if} {/if}

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

@@ -100,10 +100,12 @@
<ul class="web-footer-nav-main-list" use:melt={$root}> <ul class="web-footer-nav-main-list" use:melt={$root}>
{#each Object.entries(links) as [title, items]} {#each Object.entries(links) as [title, items]}
<li class="web-footer-nav-main-item web-is-not-mobile"> <li class="web-footer-nav-main-item web-is-not-mobile">
<h2 class="web-footer-nav-main-title web-is-not-mobile web-caption-500 web-eyebrow"> <h2
class="web-footer-nav-main-title web-is-not-mobile text-caption uppercase font-medium"
>
{title} {title}
</h2> </h2>
<ul class="web-footer-nav-secondary-list web-sub-body-400"> <ul class="web-footer-nav-secondary-list text-sub-body">
{#each items as { href, label, target, rel }} {#each items as { href, label, target, rel }}
<li> <li>
<a class="web-link" {href} {target} {rel}>{label}</a> <a class="web-link" {href} {target} {rel}>{label}</a>
@@ -120,7 +122,7 @@
class="web-footer-nav-button web-is-only-mobile" class="web-footer-nav-button web-is-only-mobile"
use:melt={$trigger({ value: title })} use:melt={$trigger({ value: title })}
> >
<span class="web-caption-500 web-eyebrow">{title}</span> <span class="text-caption font-medium uppercase">{title}</span>
<span <span
class="web-icon-chevron-down web-u-transition" class="web-icon-chevron-down web-u-transition"
class:web-u-rotate-180={$isSelected(title)} class:web-u-rotate-180={$isSelected(title)}
@@ -130,7 +132,7 @@
</h5> </h5>
{#if $isSelected(title)} {#if $isSelected(title)}
<ul <ul
class="web-footer-nav-secondary-list web-sub-body-400" class="web-footer-nav-secondary-list text-sub-body"
use:melt={$content({ value: title })} use:melt={$content({ value: title })}
transition:slide={{ duration: 250 }} transition:slide={{ duration: 250 }}
> >

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

@@ -42,7 +42,7 @@
<div class="shadow" /> <div class="shadow" />
</div> </div>
<a href="/init" rel="noopener noreferrer" class="action"> <a href="/init" rel="noopener noreferrer" class="action">
<span class="web-caption-500">Join now</span> <span class="text-caption font-medium">Join now</span>
<span class="web-icon-arrow-right" aria-hidden="true" /> <span class="web-icon-arrow-right" aria-hidden="true" />
<div class="shadow" /> <div class="shadow" />
</a> </a>

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

@@ -28,7 +28,7 @@
<div>Copyright © {year} Appwrite</div> <div>Copyright © {year} Appwrite</div>
<iframe <iframe
class="status max-w-[230px]" class="status max-w-[230px] w-fit"
title="Appwrite Status" title="Appwrite Status"
src="https://status.appwrite.online/badge?theme=dark" src="https://status.appwrite.online/badge?theme=dark"
height="35" height="35"

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

@@ -28,7 +28,7 @@
{#each links as { href, label }} {#each links as { href, label }}
<li> <li>
<a class="web-side-nav-button" {href}> <a class="web-side-nav-button" {href}>
<span class="web-caption-400">{label}</span> <span class="text-caption">{label}</span>
</a> </a>
</li> </li>
{/each} {/each}
@@ -44,7 +44,7 @@
> >
<span class="web-icon-star" aria-hidden="true" /> <span class="web-icon-star" aria-hidden="true" />
<span class="text">Star on GitHub</span> <span class="text">Star on GitHub</span>
<span class="web-inline-tag web-sub-body-400">{GITHUB_STARS}</span> <span class="web-inline-tag text-sub-body">{GITHUB_STARS}</span>
</a> </a>
</div> </div>
</div> </div>

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

@@ -28,9 +28,9 @@
<div class="web-strip-plans-plan"> <div class="web-strip-plans-plan">
<h4 class="title text-description">Free</h4> <h4 class="title text-description">Free</h4>
<div class="text-title font-aeonik-pro text-primary">$0</div> <div class="text-title font-aeonik-pro text-primary">$0</div>
<div class="info web-caption-500" /> <div class="info text-caption font-medium" />
</div> </div>
<p class="web-strip-plans-info web-caption-500"> <p class="web-strip-plans-info text-caption font-medium">
For personal hobby projects and students. For personal hobby projects and students.
</p> </p>
<a <a
@@ -46,9 +46,9 @@
<div class="web-strip-plans-plan"> <div class="web-strip-plans-plan">
<h4 class="title text-description">Pro</h4> <h4 class="title text-description">Pro</h4>
<div class="text-title font-aeonik-pro 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 class="info text-caption font-medium">per member/month</div>
</div> </div>
<p class="web-strip-plans-info web-caption-500"> <p class="web-strip-plans-info text-caption font-medium">
For pro developers and teams that need to scale their products. For pro developers and teams that need to scale their products.
</p> </p>
<a <a
@@ -67,9 +67,9 @@
<div class="web-strip-plans-plan"> <div class="web-strip-plans-plan">
<h4 class="title text-description">Scale</h4> <h4 class="title text-description">Scale</h4>
<div class="text-title font-aeonik-pro 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 class="info text-caption font-medium">per org/month</div>
</div> </div>
<p class="web-strip-plans-info web-caption-500"> <p class="web-strip-plans-info text-caption font-medium">
For pro developers and production projects that need the ability to scale. For pro developers and production projects that need the ability to scale.
</p> </p>
<button <button

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

@@ -16,10 +16,10 @@
width="32" width="32"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Auth</h4> <h4 class="text-body text-primary">Auth</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span> <span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div> </div>
<p class="web-sub-body-400 ml-1"> <p class="text-sub-body ml-1">
Build secure authentication and manage your users. Build secure authentication and manage your users.
</p> </p>
</a> </a>
@@ -38,10 +38,10 @@
width="32" width="32"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Functions</h4> <h4 class="text-body text-primary">Functions</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span> <span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div> </div>
<p class="web-sub-body-400 ml-1"> <p class="text-sub-body ml-1">
Scale big and unlock limitless potential with Appwrite functions. Scale big and unlock limitless potential with Appwrite functions.
</p> </p>
</a> </a>
@@ -60,10 +60,10 @@
width="32" width="32"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Databases</h4> <h4 class="text-body text-primary">Databases</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span> <span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div> </div>
<p class="web-sub-body-400 ml-1"> <p class="text-sub-body ml-1">
Store and query structured data, ensuring scalable storage. Store and query structured data, ensuring scalable storage.
</p> </p>
</a> </a>
@@ -82,10 +82,10 @@
width="32" width="32"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Messaging</h4> <h4 class="text-body text-primary">Messaging</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span> <span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div> </div>
<p class="web-sub-body-400 ml-1"> <p class="text-sub-body ml-1">
Manage your files’ project, using convenient APIs and utilities. Manage your files’ project, using convenient APIs and utilities.
</p> </p>
</a> </a>
@@ -104,10 +104,10 @@
width="32" width="32"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Realtime</h4> <h4 class="text-body text-primary">Realtime</h4>
<span class="icon-arrow-right ml-0" aria-hidden="true"></span> <span class="icon-arrow-right ml-0" aria-hidden="true"></span>
</div> </div>
<p class="web-sub-body-400 ml-1"> <p class="text-sub-body ml-1">
Utilize realtime information from all Appwrite services. Utilize realtime information from all Appwrite services.
</p> </p>
</a> </a>

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

@@ -184,7 +184,7 @@
{#if value} {#if value}
<section> <section>
{#if results.length > 0} {#if results.length > 0}
<h6 class="web-eyebrow">{results.length} results found</h6> <h6 class="text-micro uppercase">{results.length} results found</h6>
<ul class="mt-2 flex flex-col gap-1"> <ul class="mt-2 flex flex-col gap-1">
{#each results as hit, i (hit.uid)} {#each results as hit, i (hit.uid)}
{@const relevantSubtitle = getRelevantSubtitle(hit)} {@const relevantSubtitle = getRelevantSubtitle(hit)}
@@ -192,7 +192,7 @@
<a <a
data-hit={i} data-hit={i}
href={createHref(hit)} href={createHref(hit)}
class="web-button web-caption-400 is-text web-u-padding-block-8 web-padding-inline-12 web-u-cross-start flex class="web-button text-caption is-text web-u-padding-block-8 web-padding-inline-12 web-u-cross-start flex
max-w-full min-w-full flex-col gap-2" max-w-full min-w-full flex-col gap-2"
use:melt={$option({ use:melt={$option({
value: hit, value: hit,
@@ -218,14 +218,14 @@
{/each} {/each}
</ul> </ul>
{:else} {:else}
<p class="web-caption-400"> <p class="text-caption">
No results found for <span class="font-bold">{value}</span> No results found for <span class="font-bold">{value}</span>
</p> </p>
{/if} {/if}
</section> </section>
{/if} {/if}
<section> <section>
<h6 class="web-eyebrow">Recommended</h6> <h6 class="text-micro uppercase">Recommended</h6>
<ul class="mt-2 flex flex-col gap-1"> <ul class="mt-2 flex flex-col gap-1">
{#each recommended as hit, i (hit.uid)} {#each recommended as hit, i (hit.uid)}
{@const index = i + (results.length ? results.length : 0)} {@const index = i + (results.length ? results.length : 0)}
@@ -237,7 +237,7 @@
value: hit, value: hit,
label: hit.title ?? i.toString() label: hit.title ?? i.toString()
})} })}
class="web-button web-caption-400 is-text web-u-padding-block-4 web-u-cross-start flex min-w-full flex-col gap-2" class="web-button text-caption is-text web-u-padding-block-4 web-u-cross-start flex min-w-full flex-col gap-2"
> >
<div class="web-u-trim-1"> <div class="web-u-trim-1">
<span class="web-u-color-text-secondary">{hit.h1}</span> <span class="web-u-color-text-secondary">{hit.h1}</span>

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

@@ -14,7 +14,7 @@
} = getTocCtx(); } = getTocCtx();
</script> </script>
<ul class="web-page-steps-list web-sub-body-500"> <ul class="web-page-steps-list text-sub-body font-medium">
{#if tree && tree.length} {#if tree && tree.length}
{#each tree as heading, i (i)} {#each tree as heading, i (i)}
<li> <li>

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

@@ -63,7 +63,7 @@
{/if} {/if}
{#if $open && !disabled} {#if $open && !disabled}
<div use:melt={$content} class="web-tooltip web-sub-body-400" transition:fly={flyParams}> <div use:melt={$content} class="web-tooltip text-sub-body" transition:fly={flyParams}>
<div use:melt={$arrow} /> <div use:melt={$arrow} />
<slot name="tooltip" /> <slot name="tooltip" />
</div> </div>

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

@@ -101,7 +101,7 @@
</div> </div>
<div class="web-mobile-header-end"> <div class="web-mobile-header-end">
<a href={PUBLIC_APPWRITE_DASHBOARD} class="web-button web-is-only-desktop"> <a href={PUBLIC_APPWRITE_DASHBOARD} class="web-button web-is-only-desktop">
<span class="web-sub-body-500">Go to Console</span> <span class="text-sub-body font-medium">Go to Console</span>
</a> </a>
<button <button
class="web-button is-text" class="web-button is-text"
@@ -174,7 +174,7 @@
> >
<span class="web-icon-star" aria-hidden="true" /> <span class="web-icon-star" aria-hidden="true" />
<span class="text">Star on GitHub</span> <span class="text">Star on GitHub</span>
<span class="web-inline-tag web-sub-body-400">{GITHUB_STARS}</span> <span class="web-inline-tag text-sub-body">{GITHUB_STARS}</span>
</a> </a>
<IsLoggedIn /> <IsLoggedIn />
</div> </div>

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

@@ -36,7 +36,7 @@
<span class="icon-cheveron-left" aria-hidden="true" /> <span class="icon-cheveron-left" aria-hidden="true" />
</a> </a>
{/if} {/if}
<ul class="web-metadata web-caption-400"> <ul class="web-metadata text-caption">
<slot name="metadata" /> <slot name="metadata" />
</ul> </ul>
<div class="relative flex items-center"> <div class="relative flex items-center">
@@ -67,7 +67,7 @@
<div class="web-references-menu-content"> <div class="web-references-menu-content">
{#if toc && toc.length > 0} {#if toc && toc.length > 0}
<div class="flex items-center justify-between gap-4"> <div class="flex items-center justify-between gap-4">
<h5 class="web-references-menu-title web-eyebrow">On This Page</h5> <h5 class="web-references-menu-title text-micro uppercase">On This Page</h5>
</div> </div>
<ol class="web-references-menu-list"> <ol class="web-references-menu-list">
{#each toc as parent (parent.href)} {#each toc as parent (parent.href)}
@@ -80,7 +80,7 @@
{#if parent?.step} {#if parent?.step}
<span class="web-numeric-badge">{parent.step}</span> <span class="web-numeric-badge">{parent.step}</span>
{/if} {/if}
<span class="web-caption-400">{parent.title}</span> <span class="text-caption">{parent.title}</span>
</a> </a>
{#if parent.children} {#if parent.children}
<ol class="web-references-menu-list mt-4 ml-8"> <ol class="web-references-menu-list mt-4 ml-8">
@@ -90,9 +90,7 @@
href={child.href} href={child.href}
class="web-references-menu-link" class="web-references-menu-link"
> >
<span class="web-caption-400" <span class="text-caption">{child.title}</span>
>{child.title}</span
>
</a> </a>
</li> </li>
{/each} {/each}
@@ -104,7 +102,7 @@
<div class="border-greyscale-900/[0.04] border-t pt-5"> <div class="border-greyscale-900/[0.04] border-t pt-5">
<button class="web-link inline-flex items-center gap-2" use:scrollToTop> <button class="web-link inline-flex items-center gap-2" use:scrollToTop>
<span class="web-icon-arrow-up" aria-hidden="true" /> <span class="web-icon-arrow-up" aria-hidden="true" />
<span class="web-caption-400">Back to top</span> <span class="text-caption">Back to top</span>
</button> </button>
</div> </div>
{/if} {/if}

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

@@ -23,7 +23,7 @@
<button class="web-icon-button web-is-only-mobile" aria-label="previous page"> <button class="web-icon-button web-is-only-mobile" aria-label="previous page">
<span class="icon-cheveron-left" aria-hidden="true" /> <span class="icon-cheveron-left" aria-hidden="true" />
</button> </button>
<ul class="web-metadata web-caption-400"> <ul class="web-metadata text-caption">
<slot name="metadata" /> <slot name="metadata" />
</ul> </ul>
<div class="relative flex items-center"> <div class="relative flex items-center">
@@ -52,7 +52,7 @@
{#if prevStep} {#if prevStep}
<a href={prevStep.href} class="web-button is-text"> <a href={prevStep.href} class="web-button is-text">
<span class="icon-cheveron-left" aria-hidden="true" /> <span class="icon-cheveron-left" aria-hidden="true" />
<span class="web-sub-body-500"> <span class="text-sub-body font-medium">
Step {prevStep.step}<span class="web-is-not-mobile" Step {prevStep.step}<span class="web-is-not-mobile"
>: {prevStep.title}</span >: {prevStep.title}</span
> >
@@ -65,7 +65,7 @@
class="web-button is-secondary" class="web-button is-secondary"
style:margin-left={prevStep ? undefined : 'auto'} style:margin-left={prevStep ? undefined : 'auto'}
> >
<span class="web-sub-body-500"> <span class="text-sub-body font-medium">
Step {nextStep.step}<span class="web-is-not-mobile" Step {nextStep.step}<span class="web-is-not-mobile"
>: {nextStep.title}</span >: {nextStep.title}</span
> >
@@ -80,7 +80,7 @@
<aside class="web-references-menu ps-6"> <aside class="web-references-menu ps-6">
<div class="web-references-menu-content"> <div class="web-references-menu-content">
<div class="flex items-center justify-between gap-4"> <div class="flex items-center justify-between gap-4">
<h5 class="web-references-menu-title web-eyebrow">Tutorial Steps</h5> <h5 class="web-references-menu-title text-micro uppercase">Tutorial Steps</h5>
</div> </div>
<ol class="web-references-menu-list"> <ol class="web-references-menu-list">
{#each tutorials as tutorial} {#each tutorials as tutorial}
@@ -93,7 +93,7 @@
class:is-selected={isCurrentStep} class:is-selected={isCurrentStep}
> >
<span class="web-numeric-badge">{tutorial.step}</span> <span class="web-numeric-badge">{tutorial.step}</span>
<span class="web-caption-400">{tutorial.title}</span> <span class="text-caption">{tutorial.title}</span>
</a> </a>
{#if isCurrentStep} {#if isCurrentStep}
<ol class="web-references-menu-list mt-4 ml-8"> <ol class="web-references-menu-list mt-4 ml-8">
@@ -110,7 +110,7 @@
>{parent.step}</span >{parent.step}</span
> >
{/if} {/if}
<span class="web-caption-400">{parent.title}</span> <span class="text-caption">{parent.title}</span>
</a> </a>
{#if parent.children} {#if parent.children}
<ol class="web-references-menu-list mt-4 ml-8"> <ol class="web-references-menu-list mt-4 ml-8">
@@ -120,7 +120,7 @@
href={child.href} href={child.href}
class="web-references-menu-link" class="web-references-menu-link"
> >
<span class="web-caption-400" <span class="text-caption"
>{child.title}</span >{child.title}</span
> >
</a> </a>
@@ -138,7 +138,7 @@
<div class="border-greyscale-900/[0.04] border-t pt-5"> <div class="border-greyscale-900/[0.04] border-t pt-5">
<button class="web-link inline-flex items-center gap-2" use:scrollToTop> <button class="web-link inline-flex items-center gap-2" use:scrollToTop>
<span class="web-icon-arrow-up" aria-hidden="true" /> <span class="web-icon-arrow-up" aria-hidden="true" />
<span class="web-caption-400">Back to top</span> <span class="text-caption">Back to top</span>
</button> </button>
</div> </div>
</div> </div>

6
src/lib/layouts/Main.svelte
View File

@@ -197,9 +197,9 @@
{:else} {:else}
<AnnouncementBanner> <AnnouncementBanner>
<a href="/discord" target="_blank" rel="noopener noreferrer"> <a href="/discord" target="_blank" rel="noopener noreferrer">
<span class="web-caption-500">We are having lots of fun on</span> <span class="text-caption font-medium">We are having lots of fun on</span>
<span class="web-icon-discord" aria-hidden="true" /> <span class="web-icon-discord" aria-hidden="true" />
<span class="web-caption-500">Discord. Come and join us!</span> <span class="text-caption font-medium">Discord. Come and join us!</span>
</a> </a>
</AnnouncementBanner> </AnnouncementBanner>
{/if} {/if}
@@ -252,7 +252,7 @@
> >
<span class="web-icon-star" aria-hidden="true" /> <span class="web-icon-star" aria-hidden="true" />
<span class="text">Star on GitHub</span> <span class="text">Star on GitHub</span>
<span class="web-inline-tag web-sub-body-400">{GITHUB_STARS}</span> <span class="web-inline-tag text-sub-body">{GITHUB_STARS}</span>
</a> </a>
<IsLoggedIn /> <IsLoggedIn />
</div> </div>

7
src/lib/layouts/Sidebar.svelte
View File

@@ -59,7 +59,8 @@
<a href={parent.href} aria-label="go back"> <a href={parent.href} aria-label="go back">
<span class="icon-cheveron-left" aria-hidden="true" /> <span class="icon-cheveron-left" aria-hidden="true" />
</a> </a>
<span class="web-side-nav-wrapper-parent-title web-eyebrow">{parent.label}</span <span class="web-side-nav-wrapper-parent-title text-micro uppercase"
>{parent.label}</span
> >
</section> </section>
{/if} {/if}
@@ -76,7 +77,7 @@
{/if} {/if}
{:else} {:else}
{#if navGroup.label} {#if navGroup.label}
<h2 class="web-side-nav-header web-eyebrow whitespace-nowrap"> <h2 class="web-side-nav-header text-micro uppercase whitespace-nowrap">
{navGroup.label} {navGroup.label}
</h2> </h2>
{/if} {/if}
@@ -121,7 +122,7 @@
> >
<span class="web-icon-star" aria-hidden="true" /> <span class="web-icon-star" aria-hidden="true" />
<span class="text">Star on GitHub</span> <span class="text">Star on GitHub</span>
<span class="web-inline-tag web-sub-body-400">{GITHUB_STARS}</span> <span class="web-inline-tag text-sub-body">{GITHUB_STARS}</span>
</a> </a>
</div> </div>
</div> </div>

2
src/lib/layouts/SidebarNavButton.svelte
View File

@@ -13,7 +13,7 @@
{#if groupItem.icon} {#if groupItem.icon}
<span class="icon {groupItem.icon}" aria-hidden="true" /> <span class="icon {groupItem.icon}" aria-hidden="true" />
{/if} {/if}
<span class="web-caption-400">{groupItem.label} </span> <span class="text-caption">{groupItem.label} </span>
{#if groupItem.isParent} {#if groupItem.isParent}
<span class="icon-cheveron-right ml-auto" aria-hidden="true" /> <span class="icon-cheveron-right ml-auto" aria-hidden="true" />
{/if} {/if}

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

@@ -200,7 +200,7 @@
data-orientation="horizontal" data-orientation="horizontal"
data-melt-tabs-trigger="" data-melt-tabs-trigger=""
> >
<span class="web-main-body-500">Latest</span> <span class="text-body font-medium">Latest</span>
</button> </button>
</li> </li>
<li class="web-secondary-tabs-item"> <li class="web-secondary-tabs-item">
@@ -214,7 +214,7 @@
data-orientation="horizontal" data-orientation="horizontal"
data-melt-tabs-trigger="" data-melt-tabs-trigger=""
> >
<span class="web-main-body-500">News</span> <span class="text-body font-medium">News</span>
</button> </button>
</li> </li>
<li class="web-secondary-tabs-item"> <li class="web-secondary-tabs-item">
@@ -228,7 +228,7 @@
data-orientation="horizontal" data-orientation="horizontal"
data-melt-tabs-trigger="" data-melt-tabs-trigger=""
> >
<span class="web-main-body-500">Insights</span> <span class="text-body font-medium">Insights</span>
</button> </button>
</li> </li>
<li class="web-secondary-tabs-item"> <li class="web-secondary-tabs-item">
@@ -242,7 +242,7 @@
data-orientation="horizontal" data-orientation="horizontal"
data-melt-tabs-trigger="" data-melt-tabs-trigger=""
> >
<span class="web-main-body-500">Tutorials</span> <span class="text-body font-medium">Tutorials</span>
</button> </button>
</li> </li>
<li class="web-secondary-tabs-item"> <li class="web-secondary-tabs-item">
@@ -256,7 +256,7 @@
data-orientation="horizontal" data-orientation="horizontal"
data-melt-tabs-trigger="" data-melt-tabs-trigger=""
> >
<span class="web-main-body-500">Changelog</span> <span class="text-body font-medium">Changelog</span>
</button> </button>
</li> </li>
</ul> --> </ul> -->

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

@@ -161,7 +161,7 @@
> >
Become a Technology Partner Become a Technology Partner
</h2> </h2>
<p class="web-main-body-500"> <p class="text-body font-medium">
Join our Technology Partners program to integrate your solutions with Join our Technology Partners program to integrate your solutions with
Appwrite’s API, enhancing functionality and expanding your reach. Appwrite’s API, enhancing functionality and expanding your reach.
</p> </p>

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

@@ -110,7 +110,7 @@
<span class="web-icon-chevron-left" aria-hidden="true" /> <span class="web-icon-chevron-left" aria-hidden="true" />
<span>Back to blog</span> <span>Back to blog</span>
</a> </a>
<ul class="web-metadata web-caption-400"> <ul class="web-metadata text-caption">
<li> <li>
<time datetime={date}>{formatDate(date)}</time> <time datetime={date}>{formatDate(date)}</time>
</li> </li>
@@ -140,17 +140,17 @@
/> />
{/if} {/if}
<div class="flex flex-col"> <div class="flex flex-col">
<h4 class="web-sub-body-400 text-primary"> <h4 class="text-sub-body text-primary">
{authorData.name} {authorData.name}
</h4> </h4>
<p class="web-caption-400">{authorData.role}</p> <p class="text-caption">{authorData.role}</p>
</div> </div>
</a> </a>
</div> </div>
{/if} {/if}
<div class="share-post-section mt-4 flex items-center gap-4"> <div class="share-post-section mt-4 flex items-center gap-4">
<span class="web-eyebrow pr-2" style:color="#adadb0"> <span class="text-micro uppercase pr-2" style:color="#adadb0">
SHARE SHARE
</span> </span>
@@ -206,7 +206,7 @@
<div class="web-article-content mt-8"> <div class="web-article-content mt-8">
{#if lastUpdated} {#if lastUpdated}
<span class="web-main-body-500 last-updated-text"> <span class="text-body font-medium last-updated-text">
Updated: Updated:
<time dateTime={lastUpdated}> <time dateTime={lastUpdated}>
{formatDate(lastUpdated)} {formatDate(lastUpdated)}

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

@@ -13,8 +13,8 @@
const classList: Record<typeof level, string> = { const classList: Record<typeof level, string> = {
1: 'text-label', 1: 'text-label',
2: 'text-description', 2: 'text-description',
3: 'web-main-body-500', 3: 'text-body font-medium',
4: 'web-sub-body-500' 4: 'text-sub-body font-medium'
}; };
let element: HTMLElement | undefined; let element: HTMLElement | undefined;
@@ -80,7 +80,7 @@
margin-block-start: 2rem; margin-block-start: 2rem;
} }
.web-sub-body-500.in-policy { .text-sub-body font-medium.in-policy {
margin-block-end: 1.25rem; margin-block-end: 1.25rem;
} }
</style> </style>

2
src/markdoc/nodes/Table.svelte
View File

@@ -43,7 +43,7 @@
text-transform: none; text-transform: none;
} }
:global(td .web-eyebrow) { :global(td .text-micro uppercase) {
all: unset; all: unset;
} }

2
src/markdoc/nodes/Th.svelte
View File

@@ -12,7 +12,7 @@
class="web-table-head-col" class="web-table-head-col"
{align} {align}
> >
<span class="web-eyebrow"> <span class="text-micro uppercase">
<slot /> <slot />
</span> </span>
</td> </td>

4
src/markdoc/tags/Arrow_Link.svelte
View File

@@ -12,8 +12,8 @@
const inDocs = isInDocs(); const inDocs = isInDocs();
$: classes = (() => { $: classes = (() => {
if (inDocs) return 'web-link web-paragraph-md'; if (inDocs) return 'web-link text-paragraph-md';
if (inChangelog) return 'web-link web-paragraph-lg'; if (inChangelog) return 'web-link text-paragraph-lg';
return ''; return '';
})(); })();
</script> </script>

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

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

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

@@ -14,11 +14,11 @@
{#if icon} {#if icon}
<span class="{icon} web-u-font-size-24" aria-hidden="true" /> <span class="{icon} web-u-font-size-24" aria-hidden="true" />
{/if} {/if}
<h4 class="web-sub-body-500 text-primary"> <h4 class="text-sub-body font-medium text-primary">
{title} {title}
</h4> </h4>
</header> </header>
<p class="web-sub-body-400 mt-1" style:margin-block="0"> <p class="text-sub-body mt-1" style:margin-block="0">
<slot /> <slot />
</p> </p>
</a> </a>

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

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

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

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

4
src/routes/+error.svelte
View File

@@ -15,7 +15,9 @@
<div class="web-big-padding-section-level-2"> <div class="web-big-padding-section-level-2">
<div class="container"> <div class="container">
<div class="web-hero" style="--hero-gap:1.25rem;"> <div class="web-hero" style="--hero-gap:1.25rem;">
<span class="web-badges web-eyebrow !text-white">{$page.status}</span> <span class="web-badges text-micro uppercase !text-white"
>{$page.status}</span
>
<h1 class="text-headline font-aeonik-pro text-primary"> <h1 class="text-headline font-aeonik-pro text-primary">
{$page.error?.message ?? 'An error has occured'} {$page.error?.message ?? 'An error has occured'}
</h1> </h1>

10
src/routes/+page.svelte
View File

@@ -124,9 +124,9 @@
class="web-hero-banner-button web-u-margin-block-end-24" class="web-hero-banner-button web-u-margin-block-end-24"
> >
<span class="web-icon-star" aria-hidden="true" /> <span class="web-icon-star" aria-hidden="true" />
<span class="web-caption-500">New</span> <span class="text-caption font-medium">New</span>
<div class="web-hero-banner-button-sep" /> <div class="web-hero-banner-button-sep" />
<span class="web-caption-400 web-u-trim-1" <span class="text-caption web-u-trim-1"
>Announcing: A new Init. Faster. Smoother. Better.</span >Announcing: A new Init. Faster. Smoother. Better.</span
> >
<span class="web-icon-arrow-right" aria-hidden="true" /> <span class="web-icon-arrow-right" aria-hidden="true" />
@@ -301,7 +301,7 @@
</section> </section>
<div class="mt-20 overflow-hidden"> <div class="mt-20 overflow-hidden">
<ul <ul
class="web-info-boxes web-sub-body-500 divide-x divide-y divide-black/[0.04]" class="web-info-boxes text-sub-body font-medium divide-x divide-y divide-black/[0.04]"
> >
{#each infoBoxes as box} {#each infoBoxes as box}
<li class="relative p-8 last-of-type:border-r border-black/[0.04]"> <li class="relative p-8 last-of-type:border-r border-black/[0.04]">
@@ -439,7 +439,7 @@
<div class="py-[7.5rem]"> <div class="py-[7.5rem]">
<div class="container relative"> <div class="container relative">
<section class="web-hero is-align-start"> <section class="web-hero is-align-start">
<span class="web-badges web-eyebrow !text-white">SDKs_</span> <span class="web-badges text-micro uppercase !text-white">SDKs_</span>
<h2 class="text-display font-aeonik-pro text-primary max-w-[600px]"> <h2 class="text-display font-aeonik-pro text-primary max-w-[600px]">
Code the way you want Code the way you want
</h2> </h2>
@@ -471,7 +471,7 @@
<div class="container relative"> <div class="container relative">
<div class="grid md:grid-cols-2"> <div class="grid md:grid-cols-2">
<section class="web-hero is-align-start"> <section class="web-hero is-align-start">
<span class="web-badges web-eyebrow !text-white">Scale_</span> <span class="web-badges text-micro uppercase !text-white">Scale_</span>
<h2 class="text-display font-aeonik-pro text-primary max-w-[600px]"> <h2 class="text-display font-aeonik-pro text-primary max-w-[600px]">
We scale for you We scale for you
</h2> </h2>

6
src/routes/DeveloperCard.svelte
View File

@@ -10,8 +10,8 @@
<div class="flex justify-between gap-4"> <div class="flex justify-between gap-4">
<div class="web-user-box"> <div class="web-user-box">
<img class="web-user-box-image" src={avatarSrc} alt="Avatar of {name}" /> <img class="web-user-box-image" src={avatarSrc} alt="Avatar of {name}" />
<div class="web-user-box-name web-sub-body-500">{name}</div> <div class="web-user-box-name text-sub-body font-medium">{name}</div>
<div class="web-user-box-username web-sub-body-400">{tag}</div> <div class="web-user-box-username text-sub-body">{tag}</div>
</div> </div>
<span <span
class="web-social-item-icon web-icon-{icon}" class="web-social-item-icon web-icon-{icon}"
@@ -19,7 +19,7 @@
aria-hidden="true" aria-hidden="true"
/> />
</div> </div>
<p class="web-sub-body-500 web-u-text-color-neutral-700"> <p class="text-sub-body font-medium web-u-text-color-neutral-700">
<slot /> <slot />
</p> </p>
</div> </div>

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

@@ -336,7 +336,7 @@
gap-2 px-6" gap-2 px-6"
> >
<h3 class="text-label">Light Grey</h3> <h3 class="text-label">Light Grey</h3>
<p class="web-caption-400">#EDEDF0</p> <p class="text-caption">#EDEDF0</p>
<div class="buttons | light"> <div class="buttons | light">
<Copy toCopy="#EDEDF0" /> <Copy toCopy="#EDEDF0" />
</div> </div>
@@ -347,7 +347,7 @@
gap-2 px-6" gap-2 px-6"
> >
<h3 class="text-label">Dark Grey</h3> <h3 class="text-label">Dark Grey</h3>
<p class="web-caption-400">#19191D</p> <p class="text-caption">#19191D</p>
<div class="buttons"> <div class="buttons">
<Copy toCopy="#19191D" /> <Copy toCopy="#19191D" />
</div> </div>
@@ -358,7 +358,7 @@
gap-2 px-6" gap-2 px-6"
> >
<h3 class="text-label">Appwrite Pink</h3> <h3 class="text-label">Appwrite Pink</h3>
<p class="web-caption-400">#FD366E</p> <p class="text-caption">#FD366E</p>
<div class="buttons"> <div class="buttons">
<Copy toCopy="#FD366E" /> <Copy toCopy="#FD366E" />
</div> </div>

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

@@ -135,7 +135,7 @@
</a> </a>
<div class="web-feature-article-content"> <div class="web-feature-article-content">
<header class="web-feature-article-header"> <header class="web-feature-article-header">
<ul class="web-metadata web-caption-400 web-is-only-mobile"> <ul class="web-metadata text-caption web-is-only-mobile">
<li>{featured.timeToRead} min</li> <li>{featured.timeToRead} min</li>
</ul> </ul>
<a href={featured.href}> <a href={featured.href}>
@@ -144,7 +144,7 @@
</h2> </h2>
</a> </a>
</header> </header>
<p class="web-sub-body-400"> <p class="text-sub-body">
{featured.description} {featured.description}
</p> </p>
<div class="web-author"> <div class="web-author">
@@ -158,13 +158,11 @@
height="24" height="24"
/> />
<div class="web-author-info"> <div class="web-author-info">
<a href={author?.href} class="web-sub-body-400 web-link" <a href={author?.href} class="text-sub-body web-link"
>{author?.name}</a >{author?.name}</a
> >
<p class="web-caption-400 hidden">{author?.bio}</p> <p class="text-caption hidden">{author?.bio}</p>
<ul <ul class="web-metadata text-caption web-is-not-mobile">
class="web-metadata web-caption-400 web-is-not-mobile"
>
<li>{featured.timeToRead} min</li> <li>{featured.timeToRead} min</li>
</ul> </ul>
</div> </div>

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

@@ -6,7 +6,7 @@
</script> </script>
<div class="changelog-entry"> <div class="changelog-entry">
<time class="web-caption-400 padded" datetime={entry.date}>{formatDate(entry.date)}</time> <time class="text-caption padded" datetime={entry.date}>{formatDate(entry.date)}</time>
{#if entry.cover} {#if entry.cover}
<a href={entry.href} class="web-media"> <a href={entry.href} class="web-media">
<img src={entry.cover} alt="" loading="lazy" class="web-u-media-ratio-16-9 w-full" /> <img src={entry.cover} alt="" loading="lazy" class="web-u-media-ratio-16-9 w-full" />

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

@@ -80,7 +80,7 @@
<span class="web-icon-chevron-left" aria-hidden="true" /> <span class="web-icon-chevron-left" aria-hidden="true" />
<span>Back to Changelog</span> <span>Back to Changelog</span>
</a> </a>
<ul class="web-metadata web-caption-400"> <ul class="web-metadata text-caption">
<li> <li>
<time datetime={data.date}>{formatDate(data.date)}</time> <time datetime={data.date}>{formatDate(data.date)}</time>
</li> </li>
@@ -89,7 +89,9 @@
{data.title} {data.title}
</h1> </h1>
<div class="share-post-section mt-4 flex items-center gap-4"> <div class="share-post-section mt-4 flex items-center gap-4">
<span class="web-eyebrow pr-2" style:color="#adadb0"> SHARE </span> <span class="text-micro uppercase pr-2" style:color="#adadb0">
SHARE
</span>
<ul class="flex gap-2"> <ul class="flex gap-2">
{#each sharingOptions as sharingOption} {#each sharingOptions as sharingOption}

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

@@ -185,9 +185,7 @@
> >
<span aria-hidden="true" class="web-icon-star" /> <span aria-hidden="true" class="web-icon-star" />
<span>Star on GitHub</span> <span>Star on GitHub</span>
<span class="web-inline-tag web-sub-body-400" <span class="web-inline-tag text-sub-body">{GITHUB_STARS}</span>
>{GITHUB_STARS}</span
>
</a> </a>
</div> </div>
</div> </div>
@@ -277,7 +275,7 @@
> >
<div> <div>
<h3 class="text-label 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"> <p class="text-body font-medium mt-1">
Anyone can join and help Appwrite become better. Anyone can join and help Appwrite become better.
</p> </p>
<a <a
@@ -305,8 +303,7 @@
{#each data.issues as issue} {#each data.issues as issue}
<tr class="web-table-line-row"> <tr class="web-table-line-row">
<td class="web-table-line-cell whitespace-nowrap"> <td class="web-table-line-cell whitespace-nowrap">
<span class="web-caption-400" <span class="text-caption">#{issue.number}</span
>#{issue.number}</span
> >
</td> </td>
<td class="web-table-line-cell"> <td class="web-table-line-cell">
@@ -315,7 +312,7 @@
href={issue.url} href={issue.url}
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
class="web-link web-sub-body-500" class="web-link text-sub-body font-medium"
> >
{issue.title} {issue.title}
</a> </a>
@@ -349,8 +346,10 @@
<div <div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col" class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
> >
<div class="web-sub-body-500 text-primary">Create content</div> <div class="text-sub-body font-medium text-primary">
<div class="web-sub-body-400"> Create content
</div>
<div class="text-sub-body">
Help others discover Appwrite with videos and blogs. Help others discover Appwrite with videos and blogs.
</div> </div>
</div> </div>
@@ -359,8 +358,10 @@
<div <div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col" class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
> >
<div class="web-sub-body-500 text-primary">Present at meetups</div> <div class="text-sub-body font-medium text-primary">
<div class="web-sub-body-400"> Present at meetups
</div>
<div class="text-sub-body">
Share your experience and represent Appwrite in public. Share your experience and represent Appwrite in public.
</div> </div>
</div> </div>
@@ -369,8 +370,10 @@
<div <div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col" class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
> >
<div class="web-sub-body-500 text-primary">Report bugs</div> <div class="text-sub-body font-medium text-primary">
<div class="web-sub-body-400"> Report bugs
</div>
<div class="text-sub-body">
Find bugs and submit PRs to fix them. Find bugs and submit PRs to fix them.
</div> </div>
</div> </div>
@@ -379,8 +382,10 @@
<div <div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col" class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
> >
<div class="web-sub-body-500 text-primary">Submit new ideas</div> <div class="text-sub-body font-medium text-primary">
<div class="web-sub-body-400"> Submit new ideas
</div>
<div class="text-sub-body">
Suggest features, integrations, or SDKs for our roadmap. Suggest features, integrations, or SDKs for our roadmap.
</div> </div>
</div> </div>
@@ -389,10 +394,10 @@
<div <div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col" class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
> >
<div class="web-sub-body-500 text-primary"> <div class="text-sub-body font-medium text-primary">
Improve documentation Improve documentation
</div> </div>
<div class="web-sub-body-400"> <div class="text-sub-body">
Find improvements in our docs and improve accessibility. Find improvements in our docs and improve accessibility.
</div> </div>
</div> </div>
@@ -401,8 +406,10 @@
<div <div
class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col" class="web-card is-normal has-border-gradient web-u-gap-6 flex flex-col"
> >
<div class="web-sub-body-500 text-primary">Helping others</div> <div class="text-sub-body font-medium text-primary">
<div class="web-sub-body-400"> Helping others
</div>
<div class="text-sub-body">
Support developers with their projects and contributions. Support developers with their projects and contributions.
</div> </div>
</div> </div>

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

@@ -50,10 +50,10 @@
<span class="">{location}</span> <span class="">{location}</span>
</li> </li>
</ul> </ul>
<svelte:element this={headingTag} class="web-sub-body-500 text-primary mt-1"> <svelte:element this={headingTag} class="text-sub-body font-medium text-primary mt-1">
{title} {title}
</svelte:element> </svelte:element>
<p class="web-sub-body-500"> <p class="text-sub-body font-medium">
{description} {description}
</p> </p>
<div class="mbs-auto flex flex-wrap gap-2 pt-4"> <div class="mbs-auto flex flex-wrap gap-2 pt-4">

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

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

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

@@ -114,11 +114,11 @@
<div class="web-timeline-content-item-top web-grid-1-1" <div class="web-timeline-content-item-top web-grid-1-1"
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;"> style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span> <span class="web-badges text-micro uppercase web-u-cross-child-start">2019_</span>
<h3 class="text-title font-aeonik-pro text-primary"> <h3 class="text-title font-aeonik-pro text-primary">
A passion project called Appwrite A passion project called Appwrite
</h3> </h3>
<p class="web-main-body-400"> <p class="text-body">
Appwrite's first ever pull request was submitted in August 2019 by CEO and Founder Eldad A. Fux. Just one month later, September 2019, Appwrite officially launched. Soon the community started contributing by the hundreds pushing the product to new heights. Appwrite's first ever pull request was submitted in August 2019 by CEO and Founder Eldad A. Fux. Just one month later, September 2019, Appwrite officially launched. Soon the community started contributing by the hundreds pushing the product to new heights.
</p> </p>
</div> </div>
@@ -138,7 +138,7 @@
<div> <div>
<div class="web-card is-white web-u-max-width-350"> <div class="web-card is-white web-u-max-width-350">
<h6 class="text-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> <p class="text-sub-body mt-3">Early stages of authentication, avatars, database, teams, and storage features</p>
</div> </div>
</div> </div>
</div> </div>
@@ -147,7 +147,7 @@
<div class="web-grid-1-1" <div class="web-grid-1-1"
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;"> style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span> <span class="web-badges text-micro uppercase web-u-cross-child-start">2019_</span>
<h3 class="text-title font-aeonik-pro text-primary"> <h3 class="text-title font-aeonik-pro text-primary">
Building the team Building the team
</h3> </h3>
@@ -163,7 +163,7 @@
<div> <div>
<div class="web-card is-white web-u-max-width-168"> <div class="web-card is-white web-u-max-width-168">
<h6 class="text-title font-aeonik-pro">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> <p class="text-sub-body web-u-margin-block-start-6">GitHub Stars</p>
</div> </div>
</div> </div>
<div> <div>
@@ -175,7 +175,7 @@
<div class="web-grid-1-1" <div class="web-grid-1-1"
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;"> style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span> <span class="web-badges text-micro uppercase web-u-cross-child-start">2019_</span>
<h3 class="text-title font-aeonik-pro text-primary"> <h3 class="text-title font-aeonik-pro text-primary">
Community validation Community validation
</h3> </h3>
@@ -196,12 +196,12 @@
<div class="flex gap-4 justify-between"> <div class="flex gap-4 justify-between">
<div class="web-user-box"> <div class="web-user-box">
<img class="web-user-box-image" src="/images/avatars/eldad.png" alt="Avatar of Eldad Fux"> <img class="web-user-box-image" src="/images/avatars/eldad.png" alt="Avatar of Eldad Fux">
<div class="web-user-box-name web-sub-body-500">Eldad Fux</div> <div class="web-user-box-name text-sub-body font-medium">Eldad Fux</div>
<div class="web-user-box-username web-sub-body-400">@eldadfux</div> <div class="web-user-box-username text-sub-body">@eldadfux</div>
</div> </div>
<span class="web-social-item-icon icon-twitter" aria-label="twitter" aria-hidden="true"></span> <span class="web-social-item-icon icon-twitter" aria-label="twitter" aria-hidden="true"></span>
</div> </div>
<p class="web-sub-body-500 web-u-text-color-neutral-700"> <p class="text-sub-body font-medium web-u-text-color-neutral-700">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin in ultrices lacus. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin in ultrices lacus.
Duis pellentesque quis purus in posuere. Duis pellentesque quis purus in posuere.
</p> </p>
@@ -217,7 +217,7 @@
<div class="web-grid-1-1" <div class="web-grid-1-1"
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;"> style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span> <span class="web-badges text-micro uppercase web-u-cross-child-start">2019_</span>
<h3 class="text-title font-aeonik-pro text-primary"> <h3 class="text-title font-aeonik-pro text-primary">
Continuous improvement Continuous improvement
</h3> </h3>
@@ -246,7 +246,7 @@
<div class="web-grid-1-1" <div class="web-grid-1-1"
style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;"> style="--grid-1-1-gap:2.5rem; --grid-1-1-gap-desktop:15rem;">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
<span class="web-badges web-eyebrow web-u-cross-child-start">2019_</span> <span class="web-badges text-micro uppercase web-u-cross-child-start">2019_</span>
<h3 class="text-title font-aeonik-pro text-primary"> <h3 class="text-title font-aeonik-pro text-primary">
Taking it to the Cloud Taking it to the Cloud
</h3> </h3>
@@ -376,9 +376,9 @@
</h5> </h5>
<ul class="web-grid-2c-4c mt-12"> <ul class="web-grid-2c-4c mt-12">
<li class="flex flex-col"> <li class="flex flex-col">
<h6 class="web-main-body-500 text-primary">Aaron Applebaum</h6> <h6 class="text-body font-medium text-primary">Aaron Applebaum</h6>
<p class="web-main-body-500">Partner</p> <p class="text-body font-medium">Partner</p>
<p class="web-main-body-500">MizMaa</p> <p class="text-body font-medium">MizMaa</p>
<ul class="mt-auto flex gap-2 pt-4"> <ul class="mt-auto flex gap-2 pt-4">
<li> <li>
<a <a
@@ -405,9 +405,9 @@
</ul> </ul>
</li> </li>
<li class="flex flex-col"> <li class="flex flex-col">
<h6 class="web-main-body-500 text-primary">Ariel Maislos</h6> <h6 class="text-body font-medium text-primary">Ariel Maislos</h6>
<p class="web-main-body-500">Angel Investor</p> <p class="text-body font-medium">Angel Investor</p>
<p class="web-main-body-500">Former Apple IL CEO</p> <p class="text-body font-medium">Former Apple IL CEO</p>
<ul class="mt-auto flex gap-2 pt-4"> <ul class="mt-auto flex gap-2 pt-4">
<li> <li>
<a <a
@@ -434,14 +434,14 @@
</ul> </ul>
</li> </li>
<li class="flex flex-col"> <li class="flex flex-col">
<h6 class="web-main-body-500 text-primary">Gilad Engel</h6> <h6 class="text-body font-medium text-primary">Gilad Engel</h6>
<p class="web-main-body-500">Angel Investor</p> <p class="text-body font-medium">Angel Investor</p>
<ul class="mt-auto flex gap-2 pt-4" /> <ul class="mt-auto flex gap-2 pt-4" />
</li> </li>
<li class="flex flex-col"> <li class="flex flex-col">
<h6 class="web-main-body-500 text-primary">Krishna Visvanathan</h6> <h6 class="text-body font-medium text-primary">Krishna Visvanathan</h6>
<p class="web-main-body-500">Co-founder & Partner</p> <p class="text-body font-medium">Co-founder & Partner</p>
<p class="web-main-body-500">Crane Venture Partners</p> <p class="text-body font-medium">Crane Venture Partners</p>
<ul class="mt-auto flex gap-2 pt-4"> <ul class="mt-auto flex gap-2 pt-4">
<li> <li>
<a <a
@@ -457,8 +457,8 @@
</ul> </ul>
</li> </li>
<li class="flex flex-col"> <li class="flex flex-col">
<h6 class="web-main-body-500 text-primary">Ameet Patel</h6> <h6 class="text-body font-medium text-primary">Ameet Patel</h6>
<p class="web-main-body-500">Angel Investor</p> <p class="text-body font-medium">Angel Investor</p>
<ul class="mt-auto flex gap-2 pt-4"> <ul class="mt-auto flex gap-2 pt-4">
<li> <li>
<a <a
@@ -474,9 +474,9 @@
</ul> </ul>
</li> </li>
<li class="flex flex-col"> <li class="flex flex-col">
<h6 class="web-main-body-500 text-primary">Benno Jering</h6> <h6 class="text-body font-medium text-primary">Benno Jering</h6>
<p class="web-main-body-500">Partner</p> <p class="text-body font-medium">Partner</p>
<p class="web-main-body-500">Redline Capital</p> <p class="text-body font-medium">Redline Capital</p>
<ul class="mt-auto flex gap-2 pt-4"> <ul class="mt-auto flex gap-2 pt-4">
<li> <li>
<a <a
@@ -492,9 +492,9 @@
</ul> </ul>
</li> </li>
<li class="flex flex-col"> <li class="flex flex-col">
<h6 class="web-main-body-500 text-primary">James Lindenbaum</h6> <h6 class="text-body font-medium text-primary">James Lindenbaum</h6>
<p class="web-main-body-500">Co-founder</p> <p class="text-body font-medium">Co-founder</p>
<p class="web-main-body-500">Heroku</p> <p class="text-body font-medium">Heroku</p>
<ul class="mt-auto flex gap-2 pt-4"> <ul class="mt-auto flex gap-2 pt-4">
<li> <li>
<a <a
@@ -510,9 +510,9 @@
</ul> </ul>
</li> </li>
<li class="flex flex-col"> <li class="flex flex-col">
<h6 class="web-main-body-500 text-primary">Uri Boness</h6> <h6 class="text-body font-medium text-primary">Uri Boness</h6>
<p class="web-main-body-500">Co-Founder</p> <p class="text-body font-medium">Co-Founder</p>
<p class="web-main-body-500">Elastic</p> <p class="text-body font-medium">Elastic</p>
<ul class="mt-auto flex gap-2 pt-4"> <ul class="mt-auto flex gap-2 pt-4">
<li> <li>
<a <a

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

@@ -181,12 +181,12 @@
<div <div
class="web-u-flex-vertical-reverse-mobile flex justify-between gap-4" class="web-u-flex-vertical-reverse-mobile flex justify-between gap-4"
> >
<p class="web-caption-400 web-u-max-width-380"> <p class="text-caption web-u-max-width-380">
{#if error} {#if error}
{error} {error}
{/if} {/if}
</p> </p>
<!-- <p class="web-caption-400 web-u-max-width-380"> <!-- <p class="text-caption web-u-max-width-380">
This form is protected by reCAPTCHA, and the Google <a This form is protected by reCAPTCHA, and the Google <a
class="web-link" class="web-link"
href="/privacy" href="/privacy"

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

@@ -10,7 +10,7 @@
<div class="web-article mx-auto flex max-w-[700px] items-center justify-center py-4"> <div class="web-article mx-auto flex max-w-[700px] items-center justify-center py-4">
<div class="container"> <div class="container">
<div class="web-hero" style="--hero-gap:1.25rem;"> <div class="web-hero" style="--hero-gap:1.25rem;">
<span class="web-badges web-eyebrow !text-white">{$page.status}</span> <span class="web-badges text-micro uppercase !text-white">{$page.status}</span>
<h1 class="text-headline font-aeonik-pro text-primary"> <h1 class="text-headline font-aeonik-pro text-primary">
{$page.error?.message ?? 'An error has occured'} {$page.error?.message ?? 'An error has occured'}
</h1> </h1>

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

@@ -97,7 +97,7 @@
</p> </p>
<Technologies /> <Technologies />
<a href="/docs/sdks" class="web-button is-secondary" style:align-self="start"> <a href="/docs/sdks" class="web-button is-secondary" style:align-self="start">
<span class="web-sub-body-500">Explore all technologies</span> <span class="text-sub-body font-medium">Explore all technologies</span>
</a> </a>
<div class="web-is-not-mobile spline-wrapper absolute"> <div class="web-is-not-mobile spline-wrapper absolute">
<img <img
@@ -158,8 +158,8 @@
width="48" width="48"
height="48" height="48"
/> />
<h4 class="web-sub-body-500 text-primary mt-2">Auth</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Auth</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Sign in users with multiple OAuth providers. Sign in users with multiple OAuth providers.
</p> </p>
</a> </a>
@@ -180,10 +180,8 @@
width="48" width="48"
height="48" height="48"
/> />
<h4 class="web-sub-body-500 text-primary mt-2">Databases</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Databases</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">Store your application and user data.</p>
Store your application and user data.
</p>
</a> </a>
</li> </li>
<li> <li>
@@ -202,8 +200,8 @@
width="48" width="48"
height="48" height="48"
/> />
<h4 class="web-sub-body-500 text-primary mt-2">Functions</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Functions</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Extend and customize your server's functionality. Extend and customize your server's functionality.
</p> </p>
</a> </a>
@@ -224,8 +222,8 @@
width="48" width="48"
height="48" height="48"
/> />
<h4 class="web-sub-body-500 text-primary mt-2">Messaging</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Messaging</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Send and schedule email, SMS, and push notifications. Send and schedule email, SMS, and push notifications.
</p> </p>
</a> </a>
@@ -246,8 +244,8 @@
width="48" width="48"
height="48" height="48"
/> />
<h4 class="web-sub-body-500 text-primary mt-2">Storage</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Storage</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Store images, videos, documents, and files. Store images, videos, documents, and files.
</p> </p>
</a> </a>
@@ -268,10 +266,8 @@
width="48" width="48"
height="48" height="48"
/> />
<h4 class="web-sub-body-500 text-primary mt-2">Realtime</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Realtime</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">Respond to server events in realtime.</p>
Respond to server events in realtime.
</p>
</a> </a>
</li> </li>
</ul> </ul>
@@ -289,24 +285,24 @@
<ul class="web-grid-row-2"> <ul class="web-grid-row-2">
<li> <li>
<a href="/docs/sdks" class="web-card is-normal"> <a href="/docs/sdks" class="web-card is-normal">
<h4 class="web-sub-body-500 text-primary mt-2">SDKs</h4> <h4 class="text-sub-body font-medium text-primary mt-2">SDKs</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Light-weight SDKs for your favorite platforms. Light-weight SDKs for your favorite platforms.
</p> </p>
</a> </a>
</li> </li>
<li> <li>
<a href="/docs/apis/rest" class="web-card is-normal"> <a href="/docs/apis/rest" class="web-card is-normal">
<h4 class="web-sub-body-500 text-primary mt-2">REST API</h4> <h4 class="text-sub-body font-medium text-primary mt-2">REST API</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Integrate with HTTP requests without the needing an SDK. Integrate with HTTP requests without the needing an SDK.
</p> </p>
</a> </a>
</li> </li>
<li> <li>
<a href="/docs/apis/graphql" class="web-card is-normal"> <a href="/docs/apis/graphql" class="web-card is-normal">
<h4 class="web-sub-body-500 text-primary mt-2">GraphQL</h4> <h4 class="text-sub-body font-medium text-primary mt-2">GraphQL</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Leverage GraphQL through our SDKs or integrate directly with REST Leverage GraphQL through our SDKs or integrate directly with REST
endpoints. endpoints.
</p> </p>
@@ -314,8 +310,8 @@
</li> </li>
<li> <li>
<a href="/docs/apis/realtime" class="web-card is-normal"> <a href="/docs/apis/realtime" class="web-card is-normal">
<h4 class="web-sub-body-500 text-primary mt-2">Realtime</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Realtime</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Respond to auth, databases, storage, and function events in Respond to auth, databases, storage, and function events in
realtime. realtime.
</p> </p>
@@ -335,32 +331,32 @@
<ul class="web-grid-row-4"> <ul class="web-grid-row-4">
<li> <li>
<a href="/docs/advanced/migrations/self-hosted" class="web-card is-normal"> <a href="/docs/advanced/migrations/self-hosted" class="web-card is-normal">
<h4 class="web-sub-body-500 text-primary mt-2">Self-hosted</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Self-hosted</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Move data from self-hosted to Appwrite Cloud. Move data from self-hosted to Appwrite Cloud.
</p> </p>
</a> </a>
</li> </li>
<li> <li>
<a href="/docs/advanced/migrations/firebase" class="web-card is-normal"> <a href="/docs/advanced/migrations/firebase" class="web-card is-normal">
<h4 class="web-sub-body-500 text-primary mt-2">Firebase</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Firebase</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Migrate users and data from Firebase to Appwrite. Migrate users and data from Firebase to Appwrite.
</p> </p>
</a> </a>
</li> </li>
<li> <li>
<a href="/docs/advanced/migrations/supabase" class="web-card is-normal"> <a href="/docs/advanced/migrations/supabase" class="web-card is-normal">
<h4 class="web-sub-body-500 text-primary mt-2">Supabase</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Supabase</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Migrate users and data from Supabase to Appwrite. Migrate users and data from Supabase to Appwrite.
</p> </p>
</a> </a>
</li> </li>
<li> <li>
<a href="/docs/advanced/migrations/nhost" class="web-card is-normal"> <a href="/docs/advanced/migrations/nhost" class="web-card is-normal">
<h4 class="web-sub-body-500 text-primary mt-2">Nhost</h4> <h4 class="text-sub-body font-medium text-primary mt-2">Nhost</h4>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
Migrate users and data from NHost to Appwrite. Migrate users and data from NHost to Appwrite.
</p> </p>
</a> </a>

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

@@ -21,10 +21,10 @@
</div> </div>
<article class="web-grid-articles-item-content"> <article class="web-grid-articles-item-content">
<header class="web-articles-item-header"> <header class="web-articles-item-header">
<h3 class="web-sub-body-500 text-primary">{title}</h3> <h3 class="text-sub-body font-medium text-primary">{title}</h3>
</header> </header>
<p <p
class="web-articles-item-paragraph web-sub-body-500 mt-1 line-clamp-2" class="web-articles-item-paragraph text-sub-body font-medium mt-1 line-clamp-2"
style="word-break: keep-all;" style="word-break: keep-all;"
> >
{description} {description}

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

@@ -207,7 +207,7 @@
<div class="web-article-content web-u-gap-80"> <div class="web-article-content web-u-gap-80">
{#each quickStarts as category} {#each quickStarts as category}
<section class="flex flex-col gap-6"> <section class="flex flex-col gap-6">
<h2 class="web-eyebrow">{category.title}</h2> <h2 class="text-micro uppercase">{category.title}</h2>
<ul class="web-grid-row-4 web-grid-row-4-mobile-2"> <ul class="web-grid-row-4 web-grid-row-4-mobile-2">
{#each category.quickStarts as quickStart} {#each category.quickStarts as quickStart}
<li class="is-mobile-col-span-2"> <li class="is-mobile-col-span-2">
@@ -220,7 +220,7 @@
class="{quickStart.icon} web-u-font-size-24" class="{quickStart.icon} web-u-font-size-24"
aria-hidden="true" aria-hidden="true"
/> />
<h4 class="web-sub-body-500 text-primary"> <h4 class="text-sub-body font-medium text-primary">
{quickStart.title} {quickStart.title}
</h4> </h4>
</header> </header>

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

@@ -41,12 +41,12 @@
<div class="flex flex-col gap-6"> <div class="flex flex-col gap-6">
<div class="flex flex-col gap-4"> <div class="flex flex-col gap-4">
{#if platformType === 'CLIENT'} {#if platformType === 'CLIENT'}
<p class="web-sub-body-400"> <p class="text-sub-body">
This endpoint is rate limited. You can only make a limited number of request to This endpoint is rate limited. You can only make a limited number of request to
his endpoint within a specific time frame. his endpoint within a specific time frame.
</p> </p>
{:else} {:else}
<p class="web-sub-body-400"> <p class="text-sub-body">
This endpoint is not limited when using Server SDKs with API keys. If you are This endpoint is not limited when using Server SDKs with API keys. If you are
using SSR with <code>setSession</code>, these rate limits will still apply. using SSR with <code>setSession</code>, these rate limits will still apply.
<a <a
@@ -57,7 +57,7 @@
</a> </a>
</p> </p>
{/if} {/if}
<p class="web-sub-body-400">The limit is applied for each unique limit key.</p> <p class="text-sub-body">The limit is applied for each unique limit key.</p>
</div> </div>
<div class="web-table-wrapper"> <div class="web-table-wrapper">
<div class="web-table-scroll is-remove-outer-styles"> <div class="web-table-scroll is-remove-outer-styles">
@@ -65,13 +65,13 @@
<thead class="web-table-header"> <thead class="web-table-header">
<tr class="web-table-row"> <tr class="web-table-row">
<th class="web-table-head-col"> <th class="web-table-head-col">
<div class="web-eyebrow text-primary">Time frame</div> <div class="text-micro uppercase text-primary">Time frame</div>
</th> </th>
<th class="web-table-head-col"> <th class="web-table-head-col">
<div class="web-eyebrow text-primary">Attempts</div> <div class="text-micro uppercase text-primary">Attempts</div>
</th> </th>
<th class="web-table-head-col"> <th class="web-table-head-col">
<div class="web-eyebrow text-primary">Key</div> <div class="text-micro uppercase text-primary">Key</div>
</th> </th>
</tr> </tr>
</thead> </thead>

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

@@ -15,12 +15,12 @@
<span class="web-code text-primary"> <span class="web-code text-primary">
{parameter.name} {parameter.name}
</span> </span>
<span class="web-caption-400">{parameter.type}</span> <span class="text-caption">{parameter.type}</span>
{#if parameter.required} {#if parameter.required}
<div class="web-tag">required</div> <div class="web-tag">required</div>
{/if} {/if}
</header> </header>
<p class="web-sub-body-400 mt-4"> <p class="text-sub-body mt-4">
<!-- eslint-disable-next-line svelte/no-at-html-tags --> <!-- eslint-disable-next-line svelte/no-at-html-tags -->
{@html parse(parameter.description)} {@html parse(parameter.description)}
</p> </p>

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

@@ -12,13 +12,13 @@
<li> <li>
<article> <article>
<header class="flex items-baseline gap-2"> <header class="flex items-baseline gap-2">
<span class="web-eyebrow text-primary"> <span class="text-micro uppercase text-primary">
{response.code} {response.code}
</span> </span>
<span class="web-caption-400">application/json</span> <span class="text-caption">application/json</span>
</header> </header>
{#if response.models.length > 0} {#if response.models.length > 0}
<ul class="web-sub-body-400 mt-4"> <ul class="text-sub-body mt-4">
{#each response.models as model} {#each response.models as model}
<li> <li>
<a <a

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

@@ -176,7 +176,7 @@
<div class="web-article-content-grid-6-4-column-2 flex flex-col gap-8"> <div class="web-article-content-grid-6-4-column-2 flex flex-col gap-8">
<div class="web-inline-info"> <div class="web-inline-info">
<span class="icon-info" aria-hidden="true" /> <span class="icon-info" aria-hidden="true" />
<h5 class="web-sub-body-500 text-primary"> <h5 class="text-sub-body font-medium text-primary">
No endpoint found for this version and platform No endpoint found for this version and platform
</h5> </h5>
Please switch to a newer version or different platform. Please switch to a newer version or different platform.
@@ -251,7 +251,7 @@
<div <div
class="web-references-menu-header flex justify-between items-center gap-4 mt-6" class="web-references-menu-header flex justify-between items-center gap-4 mt-6"
> >
<h5 class="web-references-menu-title web-eyebrow">On This Page</h5> <h5 class="web-references-menu-title text-micro uppercase">On This Page</h5>
<button class="web-icon-button" id="refClose" on:click={toggleReferences}> <button class="web-icon-button" id="refClose" on:click={toggleReferences}>
<span class="icon-x" aria-hidden="true" /> <span class="icon-x" aria-hidden="true" />
</button> </button>
@@ -261,7 +261,7 @@
<li class="web-references-menu-item"> <li class="web-references-menu-item">
<a <a
href={`#${method.id}`} href={`#${method.id}`}
class="web-references-menu-link web-caption-400" class="web-references-menu-link text-caption"
class:is-selected={method.id === selected}>{method.title}</a class:is-selected={method.id === selected}>{method.title}</a
> >
</li> </li>
@@ -270,7 +270,7 @@
<div class="border-t border-greyscale-900/[0.04] web-u-padding-block-20"> <div class="border-t border-greyscale-900/[0.04] web-u-padding-block-20">
<button class="web-link inline-flex items-center gap-2" use:scrollToTop> <button class="web-link inline-flex items-center gap-2" use:scrollToTop>
<span class="web-icon-arrow-up" aria-hidden="true" /> <span class="web-icon-arrow-up" aria-hidden="true" />
<span class="web-caption-400">Back to top</span> <span class="text-caption">Back to top</span>
</button> </button>
</div> </div>
</div> </div>

6
src/routes/docs/references/[version]/models/[model]/+page.svelte
View File

@@ -25,13 +25,13 @@
<Thead> <Thead>
<Tr> <Tr>
<Th> <Th>
<span class="web-eyebrow">NAME</span> <span class="text-micro uppercase">NAME</span>
</Th> </Th>
<Th> <Th>
<span class="web-eyebrow">TYPE</span> <span class="text-micro uppercase">TYPE</span>
</Th> </Th>
<Th> <Th>
<span class="web-eyebrow">DESCRIPTION</span> <span class="text-micro uppercase">DESCRIPTION</span>
</Th> </Th>
</Tr> </Tr>
</Thead> </Thead>

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

@@ -69,7 +69,7 @@
<div class="web-article-content web-u-gap-80"> <div class="web-article-content web-u-gap-80">
{#each data.tutorials as category} {#each data.tutorials as category}
<section class="flex flex-col gap-6"> <section class="flex flex-col gap-6">
<h2 class="web-eyebrow">{category.title}</h2> <h2 class="text-micro uppercase">{category.title}</h2>
<ul class="web-grid-row-4 web-grid-row-4-mobile-2"> <ul class="web-grid-row-4 web-grid-row-4-mobile-2">
{#each category.tutorials as tutorial} {#each category.tutorials as tutorial}
<li> <li>
@@ -85,10 +85,10 @@
class="{getIcon(tutorial)} web-u-font-size-24" class="{getIcon(tutorial)} web-u-font-size-24"
aria-hidden="true" aria-hidden="true"
/> />
<h3 class="web-sub-body-500 text-primary"> <h3 class="text-sub-body font-medium text-primary">
{tutorial.framework} {tutorial.framework}
</h3> </h3>
<span class="badge web-caption-400">Coming Soon</span> <span class="badge text-caption">Coming Soon</span>
</header> </header>
</a> </a>
{:else} {:else}
@@ -98,11 +98,11 @@
class="{getIcon(tutorial)} web-u-font-size-24" class="{getIcon(tutorial)} web-u-font-size-24"
aria-hidden="true" aria-hidden="true"
/> />
<h3 class="web-sub-body-500 text-primary"> <h3 class="text-sub-body font-medium text-primary">
{tutorial.framework} {tutorial.framework}
</h3> </h3>
</header> </header>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
{tutorial.title} {tutorial.title}
</p> </p>
</a> </a>

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

@@ -141,7 +141,7 @@
<section class="container hero web-u-padding-block-end-0"> <section class="container hero web-u-padding-block-end-0">
<div> <div>
<h1 class="text-display font-aeonik-pro 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"> <p class="text-body font-medium mt-5">
If you love building, writing, speaking, and helping other developers If you love building, writing, speaking, and helping other developers
build with Appwrite, help us support you by joining the Appwrite Heroes build with Appwrite, help us support you by joining the Appwrite Heroes
program and becoming a leader in our developer community. program and becoming a leader in our developer community.
@@ -169,7 +169,7 @@
About Appwrite Heroes About Appwrite Heroes
</h2> </h2>
<div> <div>
<p class="web-sub-body-500"> <p class="text-sub-body font-medium">
The Appwrite Heroes program is an exclusive group of developers who The Appwrite Heroes program is an exclusive group of developers who
are experts in Appwrite and dedicated to creating valuable content are experts in Appwrite and dedicated to creating valuable content
to assist other developers in achieving success. Appwrite Heroes to assist other developers in achieving success. Appwrite Heroes
@@ -237,7 +237,7 @@
</h2> </h2>
</section> </section>
<div class="mt-20 overflow-hidden"> <div class="mt-20 overflow-hidden">
<ul class="web-info-boxes web-sub-body-500"> <ul class="web-info-boxes text-sub-body font-medium">
<li class="web-info-boxes-item"> <li class="web-info-boxes-item">
<img <img
src="/images/icons/gradients/discussion.svg" src="/images/icons/gradients/discussion.svg"

6
src/routes/heroes/HeroCard.svelte
View File

@@ -27,13 +27,13 @@
<div class="flex justify-between gap-4"> <div class="flex justify-between gap-4">
<div class="web-user-box"> <div class="web-user-box">
<img class="web-user-box-image" src={avatar} alt="" /> <img class="web-user-box-image" src={avatar} alt="" />
<div class="web-user-box-name web-sub-body-500 web-clr-primary"> <div class="web-user-box-name text-sub-body font-medium web-clr-primary">
{name} {name}
</div> </div>
<div class="web-user-box-username web-sub-body-400">{role}</div> <div class="web-user-box-username text-sub-body">{role}</div>
</div> </div>
</div> </div>
<p class="web-sub-body-500 web-u-text-color-neutral-700 mt-5"> <p class="text-sub-body font-medium web-u-text-color-neutral-700 mt-5">
{bio} {bio}
</p> </p>
<ul class="mt-8 flex gap-3"> <ul class="mt-8 flex gap-3">

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

@@ -22,7 +22,7 @@
</div> </div>
{/if} {/if}
<p class="web-sub-body-500">Countdown to next announcement</p> <p class="text-sub-body font-medium">Countdown to next announcement</p>
</div> </div>
<style lang="scss"> <style lang="scss">
@@ -39,7 +39,7 @@
margin-block-start: 0.75rem; margin-block-start: 0.75rem;
} }
.web-sub-body-500 { .text-sub-body font-medium {
margin-block-start: 0.5rem; margin-block-start: 0.5rem;
} }
</style> </style>

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

@@ -21,7 +21,7 @@
{#if hasReleased} {#if hasReleased}
<div class="day"> <div class="day">
<div class="circle" aria-hidden /> <div class="circle" aria-hidden />
<span class="web-eyebrow text-primary" <span class="text-micro uppercase text-primary"
>Day {number}<span class="web-u-color-text-accent">_</span></span >Day {number}<span class="web-u-color-text-accent">_</span></span
> >
<h2 class="text-label text-primary">{day.title}</h2> <h2 class="text-label text-primary">{day.title}</h2>
@@ -31,7 +31,7 @@
</div> </div>
{:else} {:else}
<div class="release"> <div class="release">
<span class="web-eyebrow text-primary" <span class="text-micro uppercase text-primary"
>Day {number}<span class="web-u-color-text-accent">_</span></span >Day {number}<span class="web-u-color-text-accent">_</span></span
> >
<div class="bottom"> <div class="bottom">

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

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

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

@@ -197,7 +197,7 @@
{:else if i === 4} {:else if i === 4}
<Day5 {date} release={day.release} /> <Day5 {date} release={day.release} />
{:else} {:else}
<h2 class="web-eyebrow text-primary"> <h2 class="text-micro uppercase text-primary">
<div class="web-dot" /> <div class="web-dot" />
{date} {date}
<span class="web-u-color-text-accent">_</span> <span class="web-u-color-text-accent">_</span>
@@ -273,7 +273,7 @@
<div class="container"> <div class="container">
<div class="text"> <div class="text">
<h2 class="text-label text-primary">Start building with Appwrite</h2> <h2 class="text-label text-primary">Start building with Appwrite</h2>
<p class="web-main-body-500"> <p class="text-body font-medium">
Appwrite's open-source platform lets you add Auth, DBs, Functions and Storage to 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 your product and build any application at any scale, own your data, and use your
preferred coding languages and tools. preferred coding languages and tools.

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

@@ -78,14 +78,14 @@
{#if ticket.gh_user} {#if ticket.gh_user}
<div class="u-flex u-cross-center u-gap-8 text-primary"> <div class="u-flex u-cross-center u-gap-8 text-primary">
<img src="/images/icons/colored/check.svg" alt="" /> <img src="/images/icons/colored/check.svg" alt="" />
<span class="web-sub-body-500">GitHub account connected</span> <span class="text-sub-body font-medium">GitHub account connected</span>
</div> </div>
<div <div
class="u-flex u-cross-center u-main-between" class="u-flex u-cross-center u-main-between"
style="margin-block-start: 0.25rem; gap: 1.25rem" style="margin-block-start: 0.25rem; gap: 1.25rem"
> >
<p class="web-sub-body-500"> <p class="text-sub-body font-medium">
Your ticket has been updated to show your unique GitHub contribution pattern. Your ticket has been updated to show your unique GitHub contribution pattern.
</p> </p>
<Switch bind:checked={showGitHub} /> <Switch bind:checked={showGitHub} />
@@ -105,8 +105,8 @@
</button> </button>
{/if} {/if}
{:else} {:else}
<h2 class="web-sub-body-500 text-primary">Integrate your GitHub account</h2> <h2 class="text-sub-body font-medium text-primary">Integrate your GitHub account</h2>
<p class="web-sub-body-500" style:margin-block-start="0.25rem"> <p class="text-sub-body font-medium" style:margin-block-start="0.25rem">
Sign in with your GitHub account and see the magic happen in your ticket. Sign in with your GitHub account and see the magic happen in your ticket.
</p> </p>
<button <button
@@ -123,15 +123,15 @@
{#if ticket.aw_email} {#if ticket.aw_email}
<div class="u-flex u-cross-center u-gap-8 text-primary"> <div class="u-flex u-cross-center u-gap-8 text-primary">
<img src="/images/icons/colored/check.svg" alt="" /> <img src="/images/icons/colored/check.svg" alt="" />
<span class="web-sub-body-500">Appwrite account connected</span> <span class="text-sub-body font-medium">Appwrite account connected</span>
</div> </div>
<p class="web-sub-body-500" style="margin-block-start: 0.25rem;"> <p class="text-sub-body font-medium" style="margin-block-start: 0.25rem;">
Your ticket has been upgraded. Your ticket has been upgraded.
</p> </p>
{:else} {:else}
<h2 class="web-sub-body-500 text-primary">Integrate your Appwrite account</h2> <h2 class="text-sub-body font-medium text-primary">Integrate your Appwrite account</h2>
<p class="web-sub-body-500" style:margin-block-start="0.25rem"> <p class="text-sub-body font-medium" style:margin-block-start="0.25rem">
Sign in with your Appwrite account and see the magic happen in your ticket. Sign in with your Appwrite account and see the magic happen in your ticket.
</p> </p>
<a <a
@@ -144,8 +144,8 @@
{/if} {/if}
<hr /> <hr />
<h2 class="web-sub-body-500 text-primary">Add your tribe</h2> <h2 class="text-sub-body font-medium text-primary">Add your tribe</h2>
<p class="web-sub-body-500" style:margin-block-start="0.25rem"> <p class="text-sub-body font-medium" style:margin-block-start="0.25rem">
Customize your Init ticket with your technology. Customize your Init ticket with your technology.
</p> </p>
<div class="tribes"> <div class="tribes">

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

@@ -11,7 +11,7 @@
<div class="container"> <div class="container">
<div class="text"> <div class="text">
<h2 class="text-title font-aeonik-pro text-primary">{title}</h2> <h2 class="text-title font-aeonik-pro text-primary">{title}</h2>
<p class="web-main-body-500"> <p class="text-body font-medium">
{description} {description}
</p> </p>
<a href={PUBLIC_APPWRITE_DASHBOARD} class="web-button">Get started</a> <a href={PUBLIC_APPWRITE_DASHBOARD} class="web-button">Get started</a>

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

@@ -20,7 +20,7 @@
</div> </div>
{/if} {/if}
<p class="web-sub-body-500">Countdown to next announcement</p> <p class="text-sub-body font-medium">Countdown to next announcement</p>
</div> </div>
<style lang="scss"> <style lang="scss">
@@ -38,7 +38,7 @@
margin-block-start: 0.75rem; margin-block-start: 0.75rem;
} }
.web-sub-body-500 { .text-sub-body font-medium {
margin-block-start: 0.5rem; margin-block-start: 0.5rem;
} }
</style> </style>

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

@@ -43,7 +43,7 @@
{:else} {:else}
<div style:z-index="10" style="margin-top: auto; margin-bottom: 0;"> <div style:z-index="10" style="margin-top: auto; margin-bottom: 0;">
<span <span
class="text-primary web-eyebrow web-u-uppercase" class="text-primary text-micro uppercase web-u-uppercase"
style:margin-bottom="-8px" style:margin-bottom="-8px"
style:display="block" style:display="block"
> >

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

@@ -49,10 +49,10 @@
</li> </li>
{/if} {/if}
</ul> </ul>
<svelte:element this={headingTag} class="web-sub-body-500 text-primary mt-1"> <svelte:element this={headingTag} class="text-sub-body font-medium text-primary mt-1">
{title} {title}
</svelte:element> </svelte:element>
<p class="web-sub-body-500"> <p class="text-sub-body font-medium">
{description} {description}
</p> </p>
<div class="mbs-auto flex flex-wrap gap-2 pt-4"> <div class="mbs-auto flex flex-wrap gap-2 pt-4">

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

@@ -52,7 +52,7 @@
{#if ticket.gh_user} {#if ticket.gh_user}
<div class="flex items-center gap-2"> <div class="flex items-center gap-2">
<div class="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> <span class="text-sub-body font-medium">Connected to GitHub</span>
</div> </div>
<Tooltip placement="bottom"> <Tooltip placement="bottom">

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

@@ -16,7 +16,7 @@
$: hasReleased = now >= release; $: hasReleased = now >= release;
</script> </script>
<h2 class="web-eyebrow text-primary"> <h2 class="text-micro uppercase text-primary">
<div class="web-dot" /> <div class="web-dot" />
{#if day !== undefined} {#if day !== undefined}
{day}<span class="web-u-color-text-accent">_</span> {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} {:else if i === 4}
<Day4 release={day.release} /> <Day4 release={day.release} />
{:else} {:else}
<h2 class="web-eyebrow text-primary"> <h2 class="text-micro uppercase text-primary">
<div class="web-dot" /> <div class="web-dot" />
{date} {date}
<span class="web-u-color-text-accent">_</span> <span class="web-u-color-text-accent">_</span>

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

@@ -106,7 +106,7 @@
<div <div
class="l-integrations-hero web-u-max-width-680 flex flex-col justify-center gap-5" class="l-integrations-hero web-u-max-width-680 flex flex-col justify-center gap-5"
> >
<div class="web-eyebrow text-primary"> <div class="text-micro uppercase text-primary">
INTEGRATIONS<span class="web-u-color-text-accent">_</span> INTEGRATIONS<span class="web-u-color-text-accent">_</span>
</div> </div>
<h1 class="text-headline font-aeonik-pro text-primary"> <h1 class="text-headline font-aeonik-pro text-primary">
@@ -144,7 +144,9 @@
</section> </section>
<section class="flex flex-col"> <section class="flex flex-col">
<section class="flex flex-col gap-4"> <section class="flex flex-col gap-4">
<h2 class="web-side-nav-header web-eyebrow whitespace-nowrap"> <h2
class="web-side-nav-header text-micro uppercase whitespace-nowrap"
>
Platform Platform
</h2> </h2>
<ul class="flex flex-wrap gap-2" class:disabled={hasQuery}> <ul class="flex flex-wrap gap-2" class:disabled={hasQuery}>
@@ -168,7 +170,9 @@
</section> </section>
<div class="web-u-sep-block-start my-6"></div> <div class="web-u-sep-block-start my-6"></div>
<section class="flex flex-col gap-4"> <section class="flex flex-col gap-4">
<h2 class="web-side-nav-header web-eyebrow whitespace-nowrap"> <h2
class="web-side-nav-header text-micro uppercase whitespace-nowrap"
>
Categories Categories
</h2> </h2>
@@ -263,7 +267,7 @@
{item.title} {item.title}
</h4> </h4>
</div> </div>
<p class="web-sub-body-400 mt-1"> <p class="text-sub-body mt-1">
{item.description} {item.description}
</p> </p>
</a> </a>
@@ -304,13 +308,15 @@
width="40" width="40"
height="40" height="40"
/> />
<div class="web-main-body-500 gap-2"> <div
class="text-body font-medium gap-2"
>
<span class="text-primary mt-3"> <span class="text-primary mt-3">
{item.title} {item.title}
</span> </span>
</div> </div>
<div <div
class="web-caption-400 web-u-color-text-secondary" class="text-caption web-u-color-text-secondary"
> >
{item.category} {item.category}
</div> </div>
@@ -377,9 +383,7 @@
<h4 class="text-primary mt-3"> <h4 class="text-primary mt-3">
{integration.title} {integration.title}
</h4> </h4>
<p <p class="text-sub-body mt-1">
class="web-sub-body-400 mt-1"
>
{integration.description} {integration.description}
</p> </p>
</a> </a>
@@ -424,7 +428,7 @@
> >
Become a Technology Partner Become a Technology Partner
</h2> </h2>
<p class="web-main-body-500"> <p class="text-body font-medium">
Join our Technology Partners program to integrate your solutions with Join our Technology Partners program to integrate your solutions with
Appwrite’s API, enhancing functionality and expanding your reach. Appwrite’s API, enhancing functionality and expanding your reach.
</p> </p>

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

@@ -323,7 +323,7 @@
<div <div
class="web-u-flex-vertical-reverse-mobile flex justify-between gap-4" class="web-u-flex-vertical-reverse-mobile flex justify-between gap-4"
> >
<p class="web-caption-400 web-u-max-width-380"> <p class="text-caption web-u-max-width-380">
{#if error} {#if error}
{error} {error}
{/if} {/if}

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

@@ -231,7 +231,7 @@
<div <div
class="web-u-flex-vertical-reverse-mobile flex justify-between gap-4" class="web-u-flex-vertical-reverse-mobile flex justify-between gap-4"
> >
<p class="web-caption-400 web-u-max-width-380"> <p class="text-caption web-u-max-width-380">
{#if error} {#if error}
{error} {error}
{/if} {/if}

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

@@ -77,14 +77,16 @@
$0 $0
</div> </div>
<div class="mt-1">&nbsp;</div> <div class="mt-1">&nbsp;</div>
<p class="web-main-body-500 mt-4"> <p class="text-body font-medium mt-4">
For personal hobby projects and students. For personal hobby projects and students.
</p> </p>
<a <a
href="{PUBLIC_APPWRITE_DASHBOARD}/register" href="{PUBLIC_APPWRITE_DASHBOARD}/register"
class="web-button is-secondary is-full-width mt-8" class="web-button is-secondary is-full-width mt-8"
> >
<span class="web-sub-body-500">Start building</span> <span class="text-sub-body font-medium"
>Start building</span
>
</a> </a>
</header> </header>
<div class="web-pricing-cards-content"> <div class="web-pricing-cards-content">
@@ -125,7 +127,7 @@
$15 $15
</div> </div>
<div class="mt-1">per member/month</div> <div class="mt-1">per member/month</div>
<p class="web-main-body-500 mt-4"> <p class="text-body font-medium mt-4">
For pro developers and teams that need to scale For pro developers and teams that need to scale
their products. their products.
</p> </p>
@@ -135,8 +137,10 @@
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<!-- <span class="web-sub-body-500">Start trial</span> --> <!-- <span class="text-sub-body font-medium">Start trial</span> -->
<span class="web-sub-body-500">Start building</span> <span class="text-sub-body font-medium"
>Start building</span
>
</a> </a>
</header> </header>
<div class="web-pricing-cards-content"> <div class="web-pricing-cards-content">
@@ -175,7 +179,7 @@
$599 $599
</div> </div>
<div class="mt-1">per organization/month</div> <div class="mt-1">per organization/month</div>
<p class="web-main-body-500 mt-4"> <p class="text-body font-medium mt-4">
For scaling teams and agencies that need dedicated For scaling teams and agencies that need dedicated
support. support.
</p> </p>
@@ -183,7 +187,9 @@
class="web-button is-secondary is-full-width mt-8" class="web-button is-secondary is-full-width mt-8"
disabled disabled
> >
<span class="web-sub-body-500">Coming soon</span> <span class="text-sub-body font-medium"
>Coming soon</span
>
</button> </button>
</header> </header>
<div class="web-pricing-cards-content"> <div class="web-pricing-cards-content">
@@ -213,7 +219,7 @@
style="background:rgba(35, 35, 37, 0.90);" style="background:rgba(35, 35, 37, 0.90);"
> >
<header class="flex gap-3"> <header class="flex gap-3">
<h3 id="enterprises" class="web-main-body-500 text-primary"> <h3 id="enterprises" class="text-body font-medium text-primary">
Enterprises Enterprises
</h3> </h3>
<div class="web-inline-tag is-pink">Coming Soon</div> <div class="web-inline-tag is-pink">Coming Soon</div>
@@ -235,7 +241,7 @@
<header class="flex gap-3"> <header class="flex gap-3">
<h3 <h3
id="open-source-teams" id="open-source-teams"
class="web-main-body-500 text-primary" class="text-body font-medium text-primary"
> >
Open-source teams Open-source teams
</h3> </h3>

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

@@ -369,7 +369,7 @@
}} }}
> >
<h3 class="text-title font-aeonik-pro 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"> <p class="text-body font-medium mt-4">
Discover our plans and find the one that fits your project’s needs. Discover our plans and find the one that fits your project’s needs.
</p> </p>
</header> </header>
@@ -387,7 +387,7 @@
--p-secondary-tabs-bg-color-selected: var(--web-color-accent) / 0.08;" --p-secondary-tabs-bg-color-selected: var(--web-color-accent) / 0.08;"
let:tab let:tab
> >
<span class="web-main-body-500 capitalize">{tab}</span> <span class="text-body font-medium capitalize">{tab}</span>
</TabsList> </TabsList>
</Tabs> </Tabs>
</div> </div>
@@ -429,7 +429,7 @@
href="https://cloud.appwrite.io/register" href="https://cloud.appwrite.io/register"
class="web-button is-secondary" class="web-button is-secondary"
> >
<span class="web-sub-body-500">Start building</span> <span class="text-sub-body font-medium">Start building</span>
</a> </a>
</div> </div>
</div> </div>
@@ -442,8 +442,8 @@
target="_blank" target="_blank"
rel="noopener noreferrer" rel="noopener noreferrer"
> >
<!-- <span class="web-sub-body-500">Start trial</span> --> <!-- <span class="text-sub-body font-medium">Start trial</span> -->
<span class="web-sub-body-500">Start building</span> <span class="text-sub-body font-medium">Start building</span>
</a> </a>
</div> </div>
</div> </div>
@@ -451,7 +451,7 @@
<div class="flex flex-wrap items-center justify-between gap-4"> <div class="flex flex-wrap items-center justify-between gap-4">
<h4 class="text-label text-primary">Scale</h4> <h4 class="text-label text-primary">Scale</h4>
<button class="web-button is-secondary" disabled> <button class="web-button is-secondary" disabled>
<span class="web-sub-body-500">Coming soon</span> <span class="text-sub-body font-medium">Coming soon</span>
</button> </button>
</div> </div>
</div> </div>
@@ -461,7 +461,7 @@
{#each tables as table} {#each tables as table}
{@const isOpen = $value?.includes(table.title)} {@const isOpen = $value?.includes(table.title)}
<table <table
class="web-compare-table web-sub-body-400" class="web-compare-table text-sub-body"
class:is-open-in-mobile={isOpen} class:is-open-in-mobile={isOpen}
use:melt={$item(table.title)} use:melt={$item(table.title)}
use:visible={{ top: 128 }} use:visible={{ top: 128 }}
@@ -496,7 +496,7 @@
<tbody class="web-compare-table-body" use:melt={$content(table.title)}> <tbody class="web-compare-table-body" use:melt={$content(table.title)}>
{#each table.rows as row} {#each table.rows as row}
<tr> <tr>
<th class="web-sub-body-500"> <th class="text-sub-body font-medium">
<div class="flex gap-1"> <div class="flex gap-1">
{row.title} {row.title}
</div> </div>

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

@@ -106,7 +106,7 @@
use:melt={$content(`${index}`)} use:melt={$content(`${index}`)}
transition:slide transition:slide
> >
<p class="web-main-body-400"> <p class="text-body">
<!-- eslint-disable-next-line svelte/no-at-html-tags --> <!-- eslint-disable-next-line svelte/no-at-html-tags -->
{@html faqItem.answer} {@html faqItem.answer}
</p> </p>
@@ -125,7 +125,7 @@
</summary> </summary>
<div class="collapsible-content"> <div class="collapsible-content">
<p class="web-main-body-400"> <p class="text-body">
<!-- eslint-disable-next-line svelte/no-at-html-tags --> <!-- eslint-disable-next-line svelte/no-at-html-tags -->
{@html faqItem.answer} {@html faqItem.answer}
</p> </p>

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

@@ -38,7 +38,7 @@
> >
<div class="inner"> <div class="inner">
<div class="header"> <div class="header">
<h3 class="web-sub-body-500">Push notification</h3> <h3 class="text-sub-body font-medium">Push notification</h3>
<div class="web-icon-close" /> <div class="web-icon-close" />
</div> </div>
<div class="griddy"> <div class="griddy">
@@ -87,7 +87,7 @@
<span>APPWRITE</span> <span>APPWRITE</span>
<span>now</span> <span>now</span>
</div> </div>
<span class="title web-caption-500">{title}</span> <span class="title text-caption font-medium">{title}</span>
<span class="message">{message}</span> <span class="message">{message}</span>
</div> </div>
</div> </div>

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

@@ -45,7 +45,7 @@
{#each $months as month} {#each $months as month}
<div class="grid" use:melt={$grid}> <div class="grid" use:melt={$grid}>
{#each weekdays as day} {#each weekdays as day}
<span class="web-eyebrow"> <span class="text-micro uppercase">
{day} {day}
</span> </span>
{/each} {/each}

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

@@ -5,7 +5,7 @@
<div class="step" data-hideline={hideLine}> <div class="step" data-hideline={hideLine}>
<div class="web-dot" /> <div class="web-dot" />
<h2 class="web-eyebrow text-primary step-title">{title}</h2> <h2 class="text-micro uppercase text-primary step-title">{title}</h2>
<div class="step-content mt-8"> <div class="step-content mt-8">
<slot /> <slot />
</div> </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"> <foreignObject x={textPos[0]} y={textPos[1]} width="360" height="64">
<span class="web-eyebrow text-primary" data-active={$selected[i]}> <span class="text-micro uppercase text-primary" data-active={$selected[i]}>
{device.value} {device.value}
</span> </span>
</foreignObject> </foreignObject>
@@ -320,10 +320,10 @@
return next; return next;
}} }}
/> />
<span class="web-sub-body-500 text-primary"> <span class="text-sub-body font-medium text-primary">
{user.name} {user.name}
</span> </span>
<span class="web-caption-400"> <span class="text-caption">
&nbsp;({selectedDevices}/{user.devices.length} targets) &nbsp;({selectedDevices}/{user.devices.length} targets)
</span> </span>
</div> </div>
@@ -340,7 +340,7 @@
/> />
<label for="device-{i}-{j}"> <label for="device-{i}-{j}">
<span class="type">{device.type}</span> <span class="type">{device.type}</span>
<span class="web-caption-400">{device.value}</span> <span class="text-caption">{device.value}</span>
</label> </label>
</li> </li>
{/each} {/each}

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

@@ -255,10 +255,10 @@ messaging.create_email(
<div> <div>
<div class="product"> <div class="product">
<img src="/images/icons/illustrated/dark/messaging.png" alt="" /> <img src="/images/icons/illustrated/dark/messaging.png" alt="" />
<span class="web-eyebrow text-primary"> <span class="text-micro uppercase text-primary">
Messaging<span class="web-u-color-text-accent">_</span> Messaging<span class="web-u-color-text-accent">_</span>
</span> </span>
<span class="web-hero-banner-button web-eyebrow">BETA</span> <span class="web-hero-banner-button text-micro uppercase">BETA</span>
</div> </div>
<h1 class="text-display font-aeonik-pro text-primary"> <h1 class="text-display font-aeonik-pro text-primary">
Open source messaging service for developers Open source messaging service for developers
@@ -292,13 +292,15 @@ messaging.create_email(
<div class="web-big-padding-section-level-2" style="margin-block-end: 160px"> <div class="web-big-padding-section-level-2" style="margin-block-end: 160px">
<div class="container"> <div class="container">
<section class="web-hero is-align-start"> <section class="web-hero is-align-start">
<span class="web-badges web-eyebrow !text-white">capabilities_</span> <span class="web-badges text-micro uppercase !text-white"
>capabilities_</span
>
<h2 class="text-display font-aeonik-pro text-primary max-w-[700px]"> <h2 class="text-display font-aeonik-pro text-primary max-w-[700px]">
All of your messages in one place All of your messages in one place
</h2> </h2>
</section> </section>
<div class="mt-20 overflow-hidden"> <div class="mt-20 overflow-hidden">
<ul class="web-info-boxes is-desktop-max-out-3 web-sub-body-500"> <ul class="web-info-boxes is-desktop-max-out-3 text-sub-body font-medium">
<li class="web-info-boxes-item"> <li class="web-info-boxes-item">
<img <img
src="/images/icons/gradients/mobile.svg" src="/images/icons/gradients/mobile.svg"
@@ -476,7 +478,7 @@ messaging.create_email(
<div class="web-big-padding-section-level-2"> <div class="web-big-padding-section-level-2">
<div class="container"> <div class="container">
<div class="web-hero is-align-start"> <div class="web-hero is-align-start">
<span class="web-badges web-eyebrow !text-white">SDKs_</span> <span class="web-badges text-micro uppercase !text-white">SDKs_</span>
<h2 class="text-display font-aeonik-pro text-primary max-w-[700px]"> <h2 class="text-display font-aeonik-pro text-primary max-w-[700px]">
Start today with your preferred technologies Start today with your preferred technologies
</h2> </h2>
@@ -537,10 +539,10 @@ messaging.create_email(
width="32" width="32"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Auth</h4> <h4 class="text-body text-primary">Auth</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" /> <span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div> </div>
<p class="web-sub-body-400"> <p class="text-sub-body">
Build secure authentication and manage your users. Build secure authentication and manage your users.
</p> </p>
</div> </div>
@@ -562,10 +564,10 @@ messaging.create_email(
width="32" width="32"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Functions</h4> <h4 class="text-body text-primary">Functions</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" /> <span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div> </div>
<p class="web-sub-body-400"> <p class="text-sub-body">
Scale big and unlock limitless potential with Appwrite Scale big and unlock limitless potential with Appwrite
functions. functions.
</p> </p>
@@ -588,10 +590,10 @@ messaging.create_email(
width="37" width="37"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Databases</h4> <h4 class="text-body text-primary">Databases</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" /> <span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div> </div>
<p class="web-sub-body-400"> <p class="text-sub-body">
Store and query structured data, ensuring scalable storage. Store and query structured data, ensuring scalable storage.
</p> </p>
</div> </div>
@@ -613,10 +615,10 @@ messaging.create_email(
width="32" width="32"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Storage</h4> <h4 class="text-body text-primary">Storage</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" /> <span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div> </div>
<p class="web-sub-body-400"> <p class="text-sub-body">
Manage your files' project, using convenient APIs and utilities. Manage your files' project, using convenient APIs and utilities.
</p> </p>
</div> </div>
@@ -638,10 +640,10 @@ messaging.create_email(
width="32" width="32"
height="32" height="32"
/> />
<h4 class="web-main-body-400 text-primary">Realtime</h4> <h4 class="text-body text-primary">Realtime</h4>
<span class="web-icon-arrow-right ml-auto" aria-hidden="true" /> <span class="web-icon-arrow-right ml-auto" aria-hidden="true" />
</div> </div>
<p class="web-sub-body-400"> <p class="text-sub-body">
Utilize realtime information from all Appwrite services. Utilize realtime information from all Appwrite services.
</p> </p>
</div> </div>

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

@@ -205,7 +205,7 @@
/> />
<div class="flex flex-col gap-2 text-center"> <div class="flex flex-col gap-2 text-center">
<h2 class="text-label text-primary">Complete backend</h2> <h2 class="text-label text-primary">Complete backend</h2>
<p class="web-main-body-500"> <p class="text-body font-medium">
Get access to Appwrite’s Scale plan and build your entire Get access to Appwrite’s Scale plan and build your entire
backend with Appwrite. backend with Appwrite.
</p> </p>
@@ -220,7 +220,7 @@
/> />
<div class="flex flex-col gap-2 text-center"> <div class="flex flex-col gap-2 text-center">
<h2 class="text-label text-primary">Cloud credits</h2> <h2 class="text-label text-primary">Cloud credits</h2>
<p class="web-main-body-500"> <p class="text-body font-medium">
Get Appwrite Cloud Scale for 12 months and reduce risk at an Get Appwrite Cloud Scale for 12 months and reduce risk at an
early stage. early stage.
</p> </p>
@@ -235,7 +235,7 @@
/> />
<div class="flex flex-col gap-2 text-center"> <div class="flex flex-col gap-2 text-center">
<h2 class="text-label text-primary">Priority support</h2> <h2 class="text-label text-primary">Priority support</h2>
<p class="web-main-body-500"> <p class="text-body font-medium">
Get community support and priority email support from the Get community support and priority email support from the
Appwrite team. Appwrite team.
</p> </p>
@@ -260,7 +260,7 @@
<h3 class="text-title font-aeonik-pro text-primary"> <h3 class="text-title font-aeonik-pro text-primary">
Ship faster Ship faster
</h3> </h3>
<p class="web-main-body-500"> <p class="text-body font-medium">
Utilizing Appwrite as your backend, you significantly Utilizing Appwrite as your backend, you significantly
cut down the time and resources spent on building a cut down the time and resources spent on building a
backend infrastructure from scratch. This means you can backend infrastructure from scratch. This means you can
@@ -284,10 +284,12 @@
width="48" width="48"
height="48" height="48"
/> />
<div class="web-user-box-name web-sub-body-500"> <div
class="web-user-box-name text-sub-body font-medium"
>
Marius Bolik Marius Bolik
</div> </div>
<div class="web-user-box-username web-sub-body-400"> <div class="web-user-box-username text-sub-body">
CTO // mySHOEFITTER CTO // mySHOEFITTER
</div> </div>
</div> </div>
@@ -321,7 +323,7 @@
<h3 class="text-title font-aeonik-pro text-primary"> <h3 class="text-title font-aeonik-pro text-primary">
Scalable architecture Scalable architecture
</h3> </h3>
<p class="web-main-body-500"> <p class="text-body font-medium">
Appwrite's scalable architecture ensures you can build Appwrite's scalable architecture ensures you can build
your product with growth in mind. Whether you're just your product with growth in mind. Whether you're just
testing the waters or ready to scale up rapidly, our testing the waters or ready to scale up rapidly, our
@@ -341,10 +343,12 @@
width="48" width="48"
height="48" height="48"
/> />
<div class="web-user-box-name web-sub-body-500"> <div
class="web-user-box-name text-sub-body font-medium"
>
{ryanOconner.name} {ryanOconner.name}
</div> </div>
<div class="web-user-box-username web-sub-body-400"> <div class="web-user-box-username text-sub-body">
{ryanOconner.handle} {ryanOconner.handle}
</div> </div>
</div> </div>
@@ -368,7 +372,7 @@
<h3 class="text-title font-aeonik-pro text-primary"> <h3 class="text-title font-aeonik-pro text-primary">
Built-in security and compliance Built-in security and compliance
</h3> </h3>
<p class="web-main-body-500"> <p class="text-body font-medium">
Appwrite comes with built-in security features like Appwrite comes with built-in security features like
authentication, database security, and more, reducing authentication, database security, and more, reducing
the time and effort you need to spend on securing your the time and effort you need to spend on securing your
@@ -386,10 +390,12 @@
width="48" width="48"
height="48" height="48"
/> />
<div class="web-user-box-name web-sub-body-500"> <div
class="web-user-box-name text-sub-body font-medium"
>
{souvikSarkar.name} {souvikSarkar.name}
</div> </div>
<div class="web-user-box-username web-sub-body-400"> <div class="web-user-box-username text-sub-body">
{souvikSarkar.handle} {souvikSarkar.handle}
</div> </div>
</div> </div>
@@ -442,16 +448,17 @@
<div <div
class="web-user-box-name flex gap-2" class="web-user-box-name flex gap-2"
> >
<span class="web-sub-body-500" <span
class="text-sub-body font-medium"
>Walter O'Brien</span >Walter O'Brien</span
> >
<time <time
class="web-caption-400 web-u-color-text-tertiary" class="text-caption web-u-color-text-tertiary"
>8:32 AM</time >8:32 AM</time
> >
</div> </div>
<div <div
class="web-user-box-content web-caption-400 text-primary" class="web-user-box-content text-caption text-primary"
> >
Hello devs! I am getting a CORS Hello devs! I am getting a CORS
error when sending a request to the error when sending a request to the
@@ -473,16 +480,17 @@
<div <div
class="web-user-box-name flex gap-2" class="web-user-box-name flex gap-2"
> >
<span class="web-sub-body-500" <span
class="text-sub-body font-medium"
>Steven</span >Steven</span
> >
<time <time
class="web-caption-400 web-u-color-text-tertiary" class="text-caption web-u-color-text-tertiary"
>8:38 AM</time >8:38 AM</time
> >
</div> </div>
<div <div
class="web-user-box-content web-caption-400 text-primary" class="web-user-box-content text-caption text-primary"
> >
Hey Louis! Is this the message you Hey Louis! Is this the message you
get get
@@ -509,16 +517,17 @@
<div <div
class="web-user-box-name flex gap-2" class="web-user-box-name flex gap-2"
> >
<span class="web-sub-body-500" <span
class="text-sub-body font-medium"
>Walter O'Brien</span >Walter O'Brien</span
> >
<time <time
class="web-caption-400 web-u-color-text-tertiary" class="text-caption web-u-color-text-tertiary"
>9:05 AM</time >9:05 AM</time
> >
</div> </div>
<div <div
class="web-user-box-content web-caption-400 text-primary" class="web-user-box-content text-caption text-primary"
> >
Yes! Yes!
</div> </div>
@@ -538,16 +547,17 @@
<div <div
class="web-user-box-name flex gap-2" class="web-user-box-name flex gap-2"
> >
<span class="web-sub-body-500" <span
class="text-sub-body font-medium"
>Steven</span >Steven</span
> >
<time <time
class="web-caption-400 web-u-color-text-tertiary" class="text-caption web-u-color-text-tertiary"
>9:08 AM</time >9:08 AM</time
> >
</div> </div>
<div <div
class="web-user-box-content web-caption-400 text-primary" class="web-user-box-content text-caption text-primary"
> >
You should be able to debug this You should be able to debug this
with a few steps. Just follow this with a few steps. Just follow this
@@ -569,7 +579,7 @@
<h3 class="text-title font-aeonik-pro text-primary"> <h3 class="text-title font-aeonik-pro text-primary">
Power of open source community Power of open source community
</h3> </h3>
<p class="web-main-body-500"> <p class="text-body font-medium">
Join a growing community of developers and founders who Join a growing community of developers and founders who
use Appwrite to build their products. Gain access to a use Appwrite to build their products. Gain access to a
wealth of knowledge, support, and shared experiences to wealth of knowledge, support, and shared experiences to
@@ -587,10 +597,12 @@
width="48" width="48"
height="48" height="48"
/> />
<div class="web-user-box-name web-sub-body-500"> <div
class="web-user-box-name text-sub-body font-medium"
>
{mariusBolik.name} {mariusBolik.name}
</div> </div>
<div class="web-user-box-username web-sub-body-400"> <div class="web-user-box-username text-sub-body">
{mariusBolik.handle} {mariusBolik.handle}
</div> </div>
</div> </div>
@@ -628,10 +640,10 @@
width="48" width="48"
height="48" height="48"
/> />
<div class="web-user-box-name web-sub-body-500"> <div class="web-user-box-name text-sub-body font-medium">
{t.name} {t.name}
</div> </div>
<div class="web-user-box-username web-sub-body-400"> <div class="web-user-box-username text-sub-body">
{t.handle} {t.handle}
</div> </div>
</div> </div>
@@ -726,7 +738,7 @@
>Thank you for your submission</span >Thank you for your submission</span
> >
</h6> </h6>
<p class="web-main-body-400"> <p class="text-body">
Our team will review your application and get back to Our team will review your application and get back to
you soon. you soon.
</p> </p>
@@ -797,7 +809,7 @@
<div <div
class="web-u-flex-vertical-reverse-mobile flex justify-between gap-4" class="web-u-flex-vertical-reverse-mobile flex justify-between gap-4"
> >
<p class="web-caption-400 web-u-max-width-380"> <p class="text-caption web-u-max-width-380">
{#if error} {#if error}
{error} {error}
{/if} {/if}

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

@@ -111,7 +111,7 @@
use:melt={$content(`${index}`)} use:melt={$content(`${index}`)}
transition:slide transition:slide
> >
<p class="web-main-body-400"> <p class="text-body">
<!-- eslint-disable-next-line svelte/no-at-html-tags --> <!-- eslint-disable-next-line svelte/no-at-html-tags -->
{@html faqItem.answer} {@html faqItem.answer}
</p> </p>
@@ -130,7 +130,7 @@
</summary> </summary>
<div class="collapsible-content"> <div class="collapsible-content">
<p class="web-main-body-400"> <p class="text-body">
<!-- eslint-disable-next-line svelte/no-at-html-tags --> <!-- eslint-disable-next-line svelte/no-at-html-tags -->
{@html faqItem.answer} {@html faqItem.answer}
</p> </p>

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

@@ -32,7 +32,7 @@
<div class="web-big-padding-section-level-2"> <div class="web-big-padding-section-level-2">
<div class="container"> <div class="container">
<div class="web-hero" style="--hero-gap:1.25rem;"> <div class="web-hero" style="--hero-gap:1.25rem;">
<span class="web-badges web-eyebrow !text-white">verification</span> <span class="web-badges text-micro uppercase text-white">verification</span>
<h1 class="text-headline font-aeonik-pro text-primary"> <h1 class="text-headline font-aeonik-pro text-primary">
{#if error} {#if error}
Error Error

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

@@ -193,7 +193,7 @@
{:else} {:else}
<div class="web-card is-normal has-border-gradient empty-card"> <div class="web-card is-normal has-border-gradient empty-card">
<enhanced:img class="img" src="./(assets)/empty-state.png" alt="" /> <enhanced:img class="img" src="./(assets)/empty-state.png" alt="" />
<span class="web-main-body-500">No support threads found</span> <span class="text-body font-medium">No support threads found</span>
<button <button
class="web-button" class="web-button"
on:click={() => { on:click={() => {

4
src/routes/threads/PreFooter.svelte
View File

@@ -5,7 +5,7 @@
<div class="cards"> <div class="cards">
<div class="cardy"> <div class="cardy">
<h3 class="text-label text-primary">Join our Discord</h3> <h3 class="text-label text-primary">Join our Discord</h3>
<p class="web-main-body-400 text-primary mt-4"> <p class="text-body text-primary mt-4">
Get community support by joining our Discord server. Get community support by joining our Discord server.
</p> </p>
<a class="web-button mt-6" href="https://appwrite.io/discord"> <a class="web-button mt-6" href="https://appwrite.io/discord">
@@ -15,7 +15,7 @@
</div> </div>
<div class="cardy"> <div class="cardy">
<h3 class="text-label text-primary">Get premium support</h3> <h3 class="text-label text-primary">Get premium support</h3>
<p class="web-main-body-400 text-primary mt-4"> <p class="text-body text-primary mt-4">
Join Appwrite Pro and get email support from our team. Join Appwrite Pro and get email support from our team.
</p> </p>
<a class="web-button mt-6" href="https://appwrite.io/pricing"> <a class="web-button mt-6" href="https://appwrite.io/pricing">

2
src/routes/threads/TagsDropdown.svelte
View File

@@ -21,7 +21,7 @@
use:melt={menu} use:melt={menu}
transition:fly={{ y: 8, duration: 250 }} transition:fly={{ y: 8, duration: 250 }}
> >
<ul class="web-sub-body-400"> <ul class="text-sub-body">
{#each tags as tag} {#each tags as tag}
{@const checked = selectedTags?.includes(tag)} {@const checked = selectedTags?.includes(tag)}
<DropdownCheckboxItem let:checkboxItem {checked}> <DropdownCheckboxItem let:checkboxItem {checked}>

11
src/routes/threads/ThreadCard.svelte
View File

@@ -11,13 +11,16 @@
{#key highlightTerms} {#key highlightTerms}
<a href="/threads/{thread.discord_id}" class="web-card is-normal has-border-gradient thread"> <a href="/threads/{thread.discord_id}" class="web-card is-normal has-border-gradient thread">
<div class="flex gap-2"> <div class="flex gap-2">
<h3 class="web-main-body-500 text-primary break-words" use:highlight={highlightTerms}> <h3
class="text-body font-medium text-primary break-words"
use:highlight={highlightTerms}
>
{thread.title} {thread.title}
</h3> </h3>
<!-- <time class="web-caption-400 ml-auto">12 Jan, 2023</time> --> <!-- <time class="text-caption ml-auto">12 Jan, 2023</time> -->
</div> </div>
<p class="web-main-body-500 mt-1 break-words" use:highlight={highlightTerms}> <p class="text-body font-medium mt-1 break-words" use:highlight={highlightTerms}>
{thread.content.length > 200 ? thread.content.slice(0, 200) + '...' : thread.content} {thread.content.length > 200 ? thread.content.slice(0, 200) + '...' : thread.content}
</p> </p>
@@ -35,7 +38,7 @@
aria-label="Replies" aria-label="Replies"
> >
<span class="web-icon-message web-u-font-size-16" aria-hidden="true" /> <span class="web-icon-message web-u-font-size-16" aria-hidden="true" />
<span class="web-caption-400 web-u-line-height-1-2">{thread.message_count}</span> <span class="text-caption web-u-line-height-1-2">{thread.message_count}</span>
</div> </div>
</div> </div>
</a> </a>

14
src/routes/threads/[id]/+page.svelte
View File

@@ -71,15 +71,17 @@
<MessageCard {message}> <MessageCard {message}>
{#if isFirst} {#if isFirst}
<div class="web-inline-info web-u-margin-block-start-24"> <div class="web-inline-info web-u-margin-block-start-24">
<div class="web-sub-body-500 text-primary">TL;DR</div> <div class="text-sub-body font-medium text-primary">TL;DR</div>
{data.tldr} {data.tldr}
</div> </div>
{/if} {/if}
</MessageCard> </MessageCard>
{/each} {/each}
<div class="web-card is-normal has-border-gradient"> <div class="web-card is-normal has-border-gradient">
<span class="web-sub-body-500 text-primary">Reply</span> <span class="text-sub-body font-medium text-primary">Reply</span>
<p class="web-sub-body-500 mt-4">Reply to this thread by joining our Discord</p> <p class="text-sub-body font-medium mt-4">
Reply to this thread by joining our Discord
</p>
<a class="web-button mt-6" href={discordLink}> <a class="web-button mt-6" href={discordLink}>
<span class="web-icon-discord" /> <span class="web-icon-discord" />
<span class="text">Reply on Discord</span> <span class="text">Reply on Discord</span>
@@ -88,20 +90,20 @@
</div> </div>
<div class="related"> <div class="related">
{#if data.related.length} {#if data.related.length}
<h2 class="web-eyebrow text-primary">Recommended threads</h2> <h2 class="text-micro uppercase text-primary">Recommended threads</h2>
{/if} {/if}
<ul> <ul>
{#each data.related as thread} {#each data.related as thread}
<li> <li>
<a href="/threads/{thread.$id}" data-sveltekit-reload> <a href="/threads/{thread.$id}" data-sveltekit-reload>
<div class="flex items-center"> <div class="flex items-center">
<span class="web-sub-body-500 text-primary"> <span class="text-sub-body font-medium text-primary">
{thread.title.length > 40 {thread.title.length > 40
? thread.title.slice(0, 40) + '...' ? thread.title.slice(0, 40) + '...'
: thread.title} : thread.title}
</span> </span>
</div> </div>
<p class="web-sub-body-400 mt-2"> <p class="text-sub-body mt-2">
{thread.content.length > 160 {thread.content.length > 160
? thread.content.slice(0, 160) + '...' ? thread.content.slice(0, 160) + '...'
: thread.content} : thread.content}

8
src/routes/threads/[id]/MessageCard.svelte
View File

@@ -29,13 +29,13 @@
<div class="author-img"> <div class="author-img">
<img src={message.author_avatar} alt="" class="h-full w-full rounded-[inherit]" /> <img src={message.author_avatar} alt="" class="h-full w-full rounded-[inherit]" />
</div> </div>
<span class="web-sub-body-500 text-primary">{message.author}</span> <span class="text-sub-body font-medium text-primary">{message.author}</span>
</div> </div>
<span class="timestamp web-caption-400"> <span class="timestamp text-caption">
{formatTimestamp(message.timestamp)} {formatTimestamp(message.timestamp)}
</span> </span>
</div> </div>
<div class="web-sub-body-500 mt-4"> <div class="text-sub-body font-medium mt-4">
<SvelteMarkdown <SvelteMarkdown
source={message.message} source={message.message}
renderers={{ renderers={{
@@ -53,7 +53,7 @@
overflow: hidden; overflow: hidden;
} }
.web-sub-body-500 { .text-sub-body font-medium {
font-size: 1rem !important; font-size: 1rem !important;
} }