[feat] add color scheme
This commit is contained in:
@@ -61,7 +61,7 @@
|
||||
{:else if $alertStore.type === 'tos'}
|
||||
<!-- svelte-ignore a11y-missing-attribute -->
|
||||
<!-- svelte-ignore a11y-click-events-have-key-events -->
|
||||
<div class="text-white">You should accept RisuRealm's <a class="text-green-600 hover:text-green-500 transition-colors duration-200 cursor-pointer" on:click={() => {
|
||||
<div class="text-textcolor">You should accept RisuRealm's <a class="text-green-600 hover:text-green-500 transition-colors duration-200 cursor-pointer" on:click={() => {
|
||||
openURL('https://sv.risuai.xyz/hub/tos')
|
||||
}}>Terms of Service</a> to continue</div>
|
||||
{:else if $alertStore.type !== 'select'}
|
||||
@@ -161,7 +161,7 @@
|
||||
</div>
|
||||
</div>
|
||||
{:else if $alertStore.type === 'toast'}
|
||||
<div class="toast-anime absolute right-0 bottom-0 bg-darkbg p-4 break-any rounded-md flex flex-col max-w-3xl max-h-11/12 overflow-y-auto z-50 text-neutral-200"
|
||||
<div class="toast-anime absolute right-0 bottom-0 bg-darkbg p-4 break-any rounded-md flex flex-col max-w-3xl max-h-11/12 overflow-y-auto z-50 text-textcolor"
|
||||
on:animationend={() => {
|
||||
alertStore.set({
|
||||
type: 'none',
|
||||
|
||||
@@ -14,10 +14,10 @@
|
||||
|
||||
<div class="absolute w-full h-full z-40 bg-black bg-opacity-50 flex justify-center items-center">
|
||||
<div class="bg-darkbg p-4 break-any rounded-md flex flex-col max-w-3xl w-72 max-h-full overflow-y-auto">
|
||||
<div class="flex items-center text-neutral-200 mb-4">
|
||||
<div class="flex items-center text-textcolor mb-4">
|
||||
<h2 class="mt-0 mb-0">{language.chatList}</h2>
|
||||
<div class="flex-grow flex justify-end">
|
||||
<button class="text-gray-500 hover:text-green-500 mr-2 cursor-pointer items-center" on:click={close}>
|
||||
<button class="text-textcolor2 hover:text-green-500 mr-2 cursor-pointer items-center" on:click={close}>
|
||||
<XIcon size={24}/>
|
||||
</button>
|
||||
</div>
|
||||
@@ -28,20 +28,20 @@
|
||||
$DataBase.characters[$selectedCharID].chatPage = i
|
||||
close()
|
||||
}
|
||||
}} class="flex items-center text-neutral-200 border-t-1 border-solid border-0 border-gray-600 p-2 cursor-pointer" class:bg-selected={i === $DataBase.characters[$selectedCharID].chatPage}>
|
||||
}} class="flex items-center text-textcolor border-t-1 border-solid border-0 border-darkborderc p-2 cursor-pointer" class:bg-selected={i === $DataBase.characters[$selectedCharID].chatPage}>
|
||||
{#if editMode}
|
||||
<TextInput bind:value={$DataBase.characters[$selectedCharID].chats[i].name} padding={false}/>
|
||||
{:else}
|
||||
<span>{chat.name}</span>
|
||||
{/if}
|
||||
<div class="flex-grow flex justify-end">
|
||||
<button class="text-gray-500 hover:text-green-500 mr-2 cursor-pointer" on:click={async (e) => {
|
||||
<button class="text-textcolor2 hover:text-green-500 mr-2 cursor-pointer" on:click={async (e) => {
|
||||
e.stopPropagation()
|
||||
exportChat(i)
|
||||
}}>
|
||||
<DownloadIcon size={18}/>
|
||||
</button>
|
||||
<button class="text-gray-500 hover:text-green-500 cursor-pointer" on:click={async (e) => {
|
||||
<button class="text-textcolor2 hover:text-green-500 cursor-pointer" on:click={async (e) => {
|
||||
e.stopPropagation()
|
||||
if($DataBase.characters[$selectedCharID].chats.length === 1){
|
||||
alertError(language.errors.onlyOneChat)
|
||||
@@ -61,7 +61,7 @@
|
||||
</button>
|
||||
{/each}
|
||||
<div class="flex mt-2 items-center">
|
||||
<button class="text-gray-500 hover:text-green-500 cursor-pointer mr-1" on:click={() => {
|
||||
<button class="text-textcolor2 hover:text-green-500 cursor-pointer mr-1" on:click={() => {
|
||||
const cha = $DataBase.characters[$selectedCharID]
|
||||
const len = $DataBase.characters[$selectedCharID].chats.length
|
||||
let chats = $DataBase.characters[$selectedCharID].chats
|
||||
@@ -83,12 +83,12 @@
|
||||
}}>
|
||||
<PlusIcon/>
|
||||
</button>
|
||||
<button class="text-gray-500 hover:text-green-500 mr-2 cursor-pointer" on:click={() => {
|
||||
<button class="text-textcolor2 hover:text-green-500 mr-2 cursor-pointer" on:click={() => {
|
||||
importChat()
|
||||
}}>
|
||||
<FolderUpIcon size={18}/>
|
||||
</button>
|
||||
<button class="text-gray-500 hover:text-green-500 cursor-pointer" on:click={() => {
|
||||
<button class="text-textcolor2 hover:text-green-500 cursor-pointer" on:click={() => {
|
||||
editMode = !editMode
|
||||
}}>
|
||||
<EditIcon size={18}/>
|
||||
|
||||
@@ -17,12 +17,12 @@
|
||||
<img src="/icon/github-mark-white.svg" width="24" alt="github" />
|
||||
</button>
|
||||
{/if}
|
||||
<button class="text-white" on:click={() => {
|
||||
<button class="text-textcolor" on:click={() => {
|
||||
openURL("https://www.patreon.com/RisuAI")
|
||||
}}>
|
||||
<WalletIcon size={24} />
|
||||
</button>
|
||||
<button class="text-white" on:click={() => {
|
||||
<button class="text-textcolor" on:click={() => {
|
||||
openURL("mailto:amasio1234@proton.me")
|
||||
}}>
|
||||
<MailIcon size={24} />
|
||||
|
||||
@@ -38,16 +38,16 @@
|
||||
|
||||
<div class="h-full w-full flex justify-center">
|
||||
<div class="h-full p-2 bg-darkbg max-w-full w-2xl flex items-center flex-col ">
|
||||
<h1 class="text-neutral-200 text-2xl font-bold mt-2">Catalog</h1>
|
||||
<h1 class="text-textcolor text-2xl font-bold mt-2">Catalog</h1>
|
||||
<TextInput placeholder="Search" bind:value={search} size="lg" autocomplete="off" marginBottom={true}/>
|
||||
<div class="w-full flex justify-center">
|
||||
<div class="flex flex-wrap gap-2 mx-auto container">
|
||||
{#each formatChars(search) as char}
|
||||
<div class="flex items-center text-neutral-200">
|
||||
<div class="flex items-center text-textcolor">
|
||||
{#if char.image}
|
||||
<BarIcon onClick={() => {changeChar(char.index)}} additionalStyle={getCharImage(char.image, 'css')}></BarIcon>
|
||||
{:else}
|
||||
<BarIcon onClick={() => {changeChar(char.index)}} additionalStyle={char.index === $selectedCharID ? 'background:#44475a' : ''}>
|
||||
<BarIcon onClick={() => {changeChar(char.index)}} additionalStyle={char.index === $selectedCharID ? 'background:var(--risu-theme-selected)' : ''}>
|
||||
{#if char.type === 'group'}
|
||||
<Users />
|
||||
{:else}
|
||||
|
||||
@@ -12,7 +12,7 @@
|
||||
let provider = 0
|
||||
</script>
|
||||
|
||||
<div class="w-full h-full flex justify-center welcome-bg text-neutral-200">
|
||||
<div class="w-full h-full flex justify-center welcome-bg text-textcolor">
|
||||
<article class="w-full overflow-x-hidden max-w-full min-h-full h-full flex flex-col overflow-y-auto">
|
||||
<div class="w-full justify-center flex mt-8">
|
||||
<img src="/logo_typo_trans.png" alt="logo" class="w-full max-w-screen-sm mb-0">
|
||||
@@ -64,7 +64,7 @@
|
||||
<span class="mb-2">API key</span>
|
||||
<TextInput bind:value={$DataBase.openAIKey} placeholder="API Key" autocomplete="off"/>
|
||||
</div>
|
||||
<span class="text-gray-400">{language.setup.apiKeyhelp} <a href="https://platform.openai.com/account/api-keys" target="_blank">https://platform.openai.com/account/api-keys</a></span>
|
||||
<span class="text-textcolor2">{language.setup.apiKeyhelp} <a href="https://platform.openai.com/account/api-keys" target="_blank">https://platform.openai.com/account/api-keys</a></span>
|
||||
<div class="flex flex-col items-start ml-2 mt-6">
|
||||
<button class="hover:text-green-500 transition-colors" on:click={() => {
|
||||
provider = 1
|
||||
|
||||
Reference in New Issue
Block a user