mirror of
https://github.com/appwrite/console.git
synced 2026-06-06 19:27:48 +00:00
Fix header
This commit is contained in:
@@ -10,14 +10,19 @@
|
||||
: '';
|
||||
</script>
|
||||
|
||||
<div class="top-cover-console" class:no-padding={isStudio} style:block-size={blocksize}>
|
||||
<div class="cover-container" {style}>
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
<slot name="header" />
|
||||
</Layout.Stack>
|
||||
<slot />
|
||||
{#if isStudio}
|
||||
<slot name="header" />
|
||||
<slot />
|
||||
{:else}
|
||||
<div class="top-cover-console" class:no-padding={isStudio} style:block-size={blocksize}>
|
||||
<div class="cover-container" {style}>
|
||||
<Layout.Stack direction="row" alignItems="center">
|
||||
<slot name="header" />
|
||||
</Layout.Stack>
|
||||
<slot />
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/if}
|
||||
|
||||
<style lang="scss">
|
||||
.top-cover-console {
|
||||
|
||||
@@ -60,12 +60,15 @@
|
||||
</Card.Base>
|
||||
</section>
|
||||
{/if}
|
||||
<Layout.Stack>
|
||||
{#if $page.data?.header}
|
||||
<svelte:component this={$page.data.header} />
|
||||
{/if}
|
||||
<slot />
|
||||
</Layout.Stack>
|
||||
|
||||
<Card.Base>
|
||||
<Layout.Stack>
|
||||
{#if $page.data?.header}
|
||||
<svelte:component this={$page.data.header} />
|
||||
{/if}
|
||||
<slot />
|
||||
</Layout.Stack>
|
||||
</Card.Base>
|
||||
</Layout.Stack>
|
||||
</div>
|
||||
{#if hasProjectSidebar}
|
||||
|
||||
@@ -6,6 +6,7 @@
|
||||
import { Cover } from '$lib/layout';
|
||||
import { canWriteProjects } from '$lib/stores/roles';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { isStudio } from '$lib/system';
|
||||
|
||||
const projectId = page.params.project;
|
||||
const path = `${base}/project-${projectId}/auth`;
|
||||
@@ -52,7 +53,8 @@
|
||||
|
||||
<Cover>
|
||||
<svelte:fragment slot="header">
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size="xl">Auth</Typography.Title>
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size={isStudio ? 's' : 'xl'}
|
||||
>Auth</Typography.Title>
|
||||
</svelte:fragment>
|
||||
<Tabs>
|
||||
{#each tabs as tab}
|
||||
|
||||
@@ -2,6 +2,4 @@
|
||||
import { Layout, Card, Typography, Divider } from '@appwrite.io/pink-svelte';
|
||||
</script>
|
||||
|
||||
<Layout.Stack direction="row">
|
||||
<Card.Base>Iframe</Card.Base>
|
||||
</Layout.Stack>
|
||||
<Layout.Stack direction="row">Iframe</Layout.Stack>
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
import { isTabSelected } from '$lib/helpers/load';
|
||||
import { Cover } from '$lib/layout';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { isStudio } from '$lib/system';
|
||||
|
||||
const projectId = page.params.project;
|
||||
const path = `${base}/project-${projectId}/databases`;
|
||||
@@ -26,7 +27,8 @@
|
||||
|
||||
<Cover>
|
||||
<svelte:fragment slot="header">
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size="xl">Databases</Typography.Title>
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size={isStudio ? 's' : 'xl'}
|
||||
>Databases</Typography.Title>
|
||||
</svelte:fragment>
|
||||
<Tabs>
|
||||
{#each tabs as tab}
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
import { isTabSelected } from '$lib/helpers/load';
|
||||
import { Cover } from '$lib/layout';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { isStudio } from '$lib/system';
|
||||
|
||||
$: projectId = page.params.project;
|
||||
$: path = `${base}/project-${projectId}/functions`;
|
||||
@@ -30,7 +31,8 @@
|
||||
|
||||
<Cover>
|
||||
<svelte:fragment slot="header">
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size="xl">Functions</Typography.Title>
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size={isStudio ? 's' : 'xl'}
|
||||
>Functions</Typography.Title>
|
||||
</svelte:fragment>
|
||||
|
||||
<Tabs>
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
import { isTabSelected } from '$lib/helpers/load';
|
||||
import { Cover } from '$lib/layout';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { isStudio } from '$lib/system';
|
||||
|
||||
const projectId = page.params.project;
|
||||
const path = `${base}/project-${projectId}/messaging`;
|
||||
@@ -31,7 +32,8 @@
|
||||
|
||||
<Cover>
|
||||
<svelte:fragment slot="header">
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size="xl">Messaging</Typography.Title>
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size={isStudio ? 's' : 'xl'}
|
||||
>Messaging</Typography.Title>
|
||||
</svelte:fragment>
|
||||
<Tabs>
|
||||
{#each tabs as tab}
|
||||
|
||||
@@ -11,12 +11,13 @@
|
||||
import { isSmallViewport } from '$lib/stores/viewport';
|
||||
import { Dependencies } from '$lib/constants';
|
||||
import { trackEvent } from '$lib/actions/analytics';
|
||||
import { isStudio } from '$lib/system';
|
||||
</script>
|
||||
|
||||
{#if !page.url.pathname.includes('get-started')}
|
||||
<Cover>
|
||||
<svelte:fragment slot="header">
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size="xl">
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size={isStudio ? 's' : 'xl'}>
|
||||
{$project?.name}
|
||||
</Typography.Title>
|
||||
<Id value={$project.$id}>{$project.$id}</Id>
|
||||
|
||||
@@ -6,7 +6,7 @@
|
||||
import type { TabElement } from '$lib/helpers/load';
|
||||
import { Cover } from '$lib/layout';
|
||||
import { canWriteProjects } from '$lib/stores/roles';
|
||||
import { isCloud } from '$lib/system';
|
||||
import { isCloud, isStudio } from '$lib/system';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
|
||||
const projectId = page.params.project;
|
||||
@@ -51,7 +51,8 @@
|
||||
|
||||
<Cover>
|
||||
<svelte:fragment slot="header">
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size="xl">Settings</Typography.Title>
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size={isStudio ? 's' : 'xl'}
|
||||
>Settings</Typography.Title>
|
||||
</svelte:fragment>
|
||||
|
||||
<Tabs>
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
import { isTabSelected } from '$lib/helpers/load';
|
||||
import { Cover } from '$lib/layout';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { isStudio } from '$lib/system';
|
||||
|
||||
$: projectId = page.params.project;
|
||||
$: path = `${base}/project-${projectId}/sites`;
|
||||
@@ -25,7 +26,8 @@
|
||||
|
||||
<Cover>
|
||||
<svelte:fragment slot="header">
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size="xl">Sites</Typography.Title>
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size={isStudio ? 's' : 'xl'}
|
||||
>Sites</Typography.Title>
|
||||
</svelte:fragment>
|
||||
|
||||
<Tabs variant="primary" let:root>
|
||||
|
||||
@@ -5,6 +5,7 @@
|
||||
import { isTabSelected } from '$lib/helpers/load';
|
||||
import { Cover } from '$lib/layout';
|
||||
import { Typography } from '@appwrite.io/pink-svelte';
|
||||
import { isStudio } from '$lib/system';
|
||||
|
||||
const projectId = page.params.project;
|
||||
const path = `${base}/project-${projectId}/storage`;
|
||||
@@ -26,7 +27,8 @@
|
||||
|
||||
<Cover>
|
||||
<svelte:fragment slot="header">
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size="xl">Storage</Typography.Title>
|
||||
<Typography.Title color="--fgcolor-neutral-primary" size={isStudio ? 's' : 'xl'}
|
||||
>Storage</Typography.Title>
|
||||
</svelte:fragment>
|
||||
<Tabs>
|
||||
{#each tabs as tab}
|
||||
|
||||
Reference in New Issue
Block a user