mirror of
https://github.com/LukeHagar/website.git
synced 2025-12-09 12:57:48 +00:00
fix vue icon
This commit is contained in:
@@ -1,114 +1,109 @@
|
||||
<script lang="ts">
|
||||
import { MainFooter } from '$lib/components';
|
||||
import { DEFAULT_DESCRIPTION, DEFAULT_HOST } from '$lib/utils/metadata';
|
||||
import { DOCS_TITLE_SUFFIX } from '$routes/titles';
|
||||
import { MainFooter } from '$lib/components';
|
||||
import { DEFAULT_DESCRIPTION, DEFAULT_HOST } from '$lib/utils/metadata';
|
||||
import { themeInUse } from '$routes/+layout.svelte';
|
||||
import { DOCS_TITLE_SUFFIX } from '$routes/titles';
|
||||
|
||||
const title = 'Tutorials' + DOCS_TITLE_SUFFIX;
|
||||
const description = DEFAULT_DESCRIPTION;
|
||||
const ogImage = DEFAULT_HOST + '/images/open-graph/docs.png';
|
||||
const title = 'Tutorials' + DOCS_TITLE_SUFFIX;
|
||||
const description = DEFAULT_DESCRIPTION;
|
||||
const ogImage = DEFAULT_HOST + '/images/open-graph/docs.png';
|
||||
</script>
|
||||
|
||||
<svelte:head>
|
||||
<!-- Titles -->
|
||||
<title>{title}</title>
|
||||
<meta property="og:title" content={title} />
|
||||
<meta name="twitter:title" content={title} />
|
||||
<!-- Desscription -->
|
||||
<meta name="description" content={description} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta name="twitter:description" content={description} />
|
||||
<!-- Image -->
|
||||
<meta property="og:image" content={ogImage} />
|
||||
<meta property="og:image:width" content="1200" />
|
||||
<meta property="og:image:height" content="630" />
|
||||
<meta name="twitter:image" content={ogImage} />
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
<!-- Titles -->
|
||||
<title>{title}</title>
|
||||
<meta property="og:title" content={title} />
|
||||
<meta name="twitter:title" content={title} />
|
||||
<!-- Desscription -->
|
||||
<meta name="description" content={description} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta name="twitter:description" content={description} />
|
||||
<!-- Image -->
|
||||
<meta property="og:image" content={ogImage} />
|
||||
<meta property="og:image:width" content="1200" />
|
||||
<meta property="og:image:height" content="630" />
|
||||
<meta name="twitter:image" content={ogImage} />
|
||||
<meta name="twitter:card" content="summary_large_image" />
|
||||
</svelte:head>
|
||||
|
||||
<main class="aw-main-section">
|
||||
<article class="aw-article">
|
||||
<header class="aw-article-header">
|
||||
<div class="aw-article-header-start u-flex-vertical aw-u-cross-start">
|
||||
<div class="u-position-relative u-flex u-cross-center">
|
||||
<h1 class="aw-title">Platforms</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="aw-article-header-end" />
|
||||
</header>
|
||||
<div class="aw-article-content aw-u-gap-80">
|
||||
<section class="u-flex-vertical u-gap-24">
|
||||
<h2 class="aw-eyebrow">Client</h2>
|
||||
<ul class="aw-grid-row-4 aw-grid-row-4-mobile-2">
|
||||
<li class="is-mobile-col-span-2">
|
||||
<a href="/docs/tutorials/react" class="aw-card is-normal">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-react aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">React</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">
|
||||
Learn Appwrite Auth, Databases, and more with React.
|
||||
</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<a href="/docs/tutorials/vue" class="aw-card is-normal">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="aw-icon-vue aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Vue</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">
|
||||
Learn Appwrite Auth, Databases, and more with Vue.
|
||||
</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<a href="/docs/tutorials/sveltekit" class="aw-card is-normal">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-svelte aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">SvelteKit</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">
|
||||
Learn Appwrite Auth, Databases, and more with SvelteKit.
|
||||
</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<article class="aw-card is-full-color">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-flutter aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Flutter</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">
|
||||
Coming soon...
|
||||
</p>
|
||||
</article>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<article class="aw-card is-full-color">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-apple aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Apple</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">
|
||||
Coming soon...
|
||||
</p>
|
||||
</article>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<article class="aw-card is-full-color">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-android aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Android</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">
|
||||
Coming soon...
|
||||
</p>
|
||||
</article>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</article>
|
||||
<article class="aw-article">
|
||||
<header class="aw-article-header">
|
||||
<div class="aw-article-header-start u-flex-vertical aw-u-cross-start">
|
||||
<div class="u-position-relative u-flex u-cross-center">
|
||||
<h1 class="aw-title">Platforms</h1>
|
||||
</div>
|
||||
</div>
|
||||
<div class="aw-article-header-end" />
|
||||
</header>
|
||||
<div class="aw-article-content aw-u-gap-80">
|
||||
<section class="u-flex-vertical u-gap-24">
|
||||
<h2 class="aw-eyebrow">Client</h2>
|
||||
<ul class="aw-grid-row-4 aw-grid-row-4-mobile-2">
|
||||
<li class="is-mobile-col-span-2">
|
||||
<a href="/docs/tutorials/react" class="aw-card is-normal">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-react aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">React</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">
|
||||
Learn Appwrite Auth, Databases, and more with React.
|
||||
</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<a href="/docs/tutorials/vue" class="aw-card is-normal">
|
||||
<header class="u-flex u-cross-center u-gap-4">
|
||||
<img src="/images/platforms/{$themeInUse}/vue.svg" alt="" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Vue</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">
|
||||
Learn Appwrite Auth, Databases, and more with Vue.
|
||||
</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<a href="/docs/tutorials/sveltekit" class="aw-card is-normal">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-svelte aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">SvelteKit</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">
|
||||
Learn Appwrite Auth, Databases, and more with SvelteKit.
|
||||
</p>
|
||||
</a>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<article class="aw-card is-full-color">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-flutter aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Flutter</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">Coming soon...</p>
|
||||
</article>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<article class="aw-card is-full-color">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-apple aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Apple</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">Coming soon...</p>
|
||||
</article>
|
||||
</li>
|
||||
<li class="is-mobile-col-span-2">
|
||||
<article class="aw-card is-full-color">
|
||||
<header class="u-flex u-cross-baseline u-gap-4">
|
||||
<span class="icon-android aw-u-font-size-24" aria-hidden="true" />
|
||||
<h4 class="aw-sub-body-500 aw-u-color-text-primary">Android</h4>
|
||||
</header>
|
||||
<p class="aw-sub-body-400 u-margin-block-start-4">Coming soon...</p>
|
||||
</article>
|
||||
</li>
|
||||
</ul>
|
||||
</section>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<MainFooter variant="docs" />
|
||||
<MainFooter variant="docs" />
|
||||
</main>
|
||||
|
||||
Reference in New Issue
Block a user