File size: 2,702 Bytes
f437e64 767afa7 c8c5d70 64d3841 5d07536 64d3841 f437e64 2606dde 5d07536 2606dde 767afa7 f437e64 82fcab7 5d07536 82fcab7 5d07536 c8c5d70 82fcab7 7c4fdc9 fd5e4ef 7c4fdc9 82fcab7 5d07536 64d3841 767afa7 64d3841 5d07536 64d3841 5d07536 64d3841 5d07536 64d3841 5d07536 64d3841 c8c5d70 82fcab7 |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 |
<script lang="ts">
import { browser } from "$app/environment";
import { base } from "$app/paths";
import { page } from "$app/stores";
import { PUBLIC_APP_DATA_SHARING, PUBLIC_APP_NAME, PUBLIC_VERSION } from "$env/static/public";
import LogoHuggingFaceBorderless from "$lib/components/icons/LogoHuggingFaceBorderless.svelte";
import Modal from "$lib/components/Modal.svelte";
import type { LayoutData } from "../../routes/$types";
import Logo from "./icons/Logo.svelte";
export let settings: LayoutData["settings"];
const isIframe = browser && window.self !== window.parent;
</script>
<Modal>
<div
class="flex w-full flex-col items-center gap-6 bg-gradient-to-t from-primary-500/40 via-primary-500/10 to-primary-500/0 px-4 pb-10 pt-9 text-center "
>
<h2 class="flex items-center text-2xl font-semibold text-gray-800">
<Logo classNames="mr-1" />
{PUBLIC_APP_NAME}
<div
class="ml-3 flex h-6 items-center rounded-lg border border-gray-100 bg-gray-50 px-2 text-base text-gray-400"
>
v{PUBLIC_VERSION}
</div>
</h2>
{#if $page.data.requiresLogin}
<p
class="px-4 text-lg font-semibold leading-snug text-gray-800 sm:px-12"
style="text-wrap: balance;"
>
Please Sign in with Hugging Face to continue
</p>
{/if}
<p class="text-base text-gray-800">
Disclaimer: AI is an area of active research with known problems such as biased generation and
misinformation. Do not use this application for high-stakes decisions or advice.
</p>
{#if PUBLIC_APP_DATA_SHARING}
<p class="px-2 text-sm text-gray-500">
Your conversations will be shared with model authors unless you disable it from your
settings.
</p>
{/if}
<form
action="{base}/{$page.data.requiresLogin ? 'login' : 'settings'}"
target={isIframe ? "_blank" : ""}
method="POST"
class="flex w-full flex-col items-center gap-2"
>
{#if $page.data.requiresLogin}
<button
type="submit"
class="mt-2 flex items-center whitespace-nowrap rounded-full bg-black px-5 py-2 text-lg font-semibold text-gray-100 transition-colors hover:bg-primary-500"
>
Sign in
{#if PUBLIC_APP_NAME === "HuggingChat"}
with <LogoHuggingFaceBorderless classNames="text-xl mr-1 ml-1.5" /> Hugging Face
{/if}
</button>
{:else}
<input type="hidden" name="ethicsModalAccepted" value={true} />
{#each Object.entries(settings) as [key, val]}
<input type="hidden" name={key} value={val} />
{/each}
<button
type="submit"
class="mt-2 rounded-full bg-black px-5 py-2 text-lg font-semibold text-gray-100 transition-colors hover:bg-primary-500"
>
Start chatting
</button>
{/if}
</form>
</div>
</Modal>
|