mirror of
https://github.com/open-webui/open-webui
synced 2025-02-08 14:05:40 +00:00
64 lines
1.9 KiB
Svelte
64 lines
1.9 KiB
Svelte
|
<script>
|
||
|
|
import { getContext } from 'svelte';
|
||
|
|
const i18n = getContext('i18n');
|
||
|
|
|
||
|
|
import Marquee from './common/Marquee.svelte';
|
||
|
|
import SlideShow from './common/SlideShow.svelte';
|
||
|
|
import ArrowRightCircle from './icons/ArrowRightCircle.svelte';
|
||
|
|
|
||
|
|
export let show = true;
|
||
|
|
export let getStartedHandler = () => {};
|
||
|
|
</script>
|
||
|
|
|
||
|
|
{#if show}
|
||
|
|
<div class="w-full h-screen max-h-[100dvh] text-white relative">
|
||
|
|
<SlideShow duration={5000} />
|
||
|
|
|
||
|
|
<div
|
||
|
|
class="w-full h-full absolute top-0 left-0 bg-gradient-to-t dark:from-black dark:to-black/60"
|
||
|
|
></div>
|
||
|
|
|
||
|
|
<div class="w-full h-full absolute top-0 left-0 backdrop-blur-xl"></div>
|
||
|
|
|
||
|
|
<div class="relative bg-transparent w-full min-h-screen flex z-10">
|
||
|
|
<div class="flex flex-col justify-center w-full items-center pb-10 text-center">
|
||
|
|
<div class="text-5xl lg:text-7xl font-secondary">
|
||
|
|
<Marquee
|
||
|
|
duration={5000}
|
||
|
|
words={[
|
||
|
|
$i18n.t('Explore the cosmos'),
|
||
|
|
$i18n.t('Unlock mysteries'),
|
||
|
|
$i18n.t('Chart new frontiers'),
|
||
|
|
$i18n.t('Dive into knowledge'),
|
||
|
|
$i18n.t('Discover wonders'),
|
||
|
|
$i18n.t('Ignite curiosity'),
|
||
|
|
$i18n.t('Forge new paths'),
|
||
|
|
$i18n.t('Unravel secrets'),
|
||
|
|
$i18n.t('Pioneer insights'),
|
||
|
|
$i18n.t('Embark on adventures')
|
||
|
|
]}
|
||
|
|
/>
|
||
|
|
|
||
|
|
<div class="mt-0.5">{$i18n.t(`wherever you are`)}</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="absolute bottom-12 left-0 right-0 w-full">
|
||
|
|
<div class="flex justify-center">
|
||
|
|
<div class="flex flex-col justify-center items-center">
|
||
|
|
<button
|
||
|
|
class="relative z-20 flex p-1 rounded-full bg-white/5 hover:bg-white/10 transition font-medium text-sm"
|
||
|
|
on:click={() => {
|
||
|
|
getStartedHandler();
|
||
|
|
}}
|
||
|
|
>
|
||
|
|
<ArrowRightCircle className="size-6" />
|
||
|
|
</button>
|
||
|
|
<div class="mt-1.5 font-primary text-base font-medium">{$i18n.t(`Get started`)}</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
{/if}
|