mincomk/risuai
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[ref] input to components

Browse Source
This commit is contained in:
kwaroran
2023-07-18 18:18:14 +09:00
parent 26421fde03
commit c0622c4f0d
24 changed files with 291 additions and 161 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
src/lib/Others/AlertComp.svelte
View File

@@ -7,6 +7,7 @@
import BarIcon from '../SideBars/BarIcon.svelte';
import { User } from 'lucide-svelte';
import { hubURL } from 'src/ts/characterCards';
import TextInput from '../UI/GUI/TextInput.svelte';
let btn
let input = ''
@@ -90,7 +91,7 @@
})
}}>OK</button>
{:else if $alertStore.type === 'input'}
<input class="text-neutral-200 mt-2 p-2 bg-transparent input-text focus:bg-selected" value="" id="alert-input" autocomplete="off">
<TextInput value="" id="alert-input" autocomplete="off"/>
<button bind:this={btn} class="mt-4 border-borderc bg-transparent outline-none border-solid border-1 p-2 text-lg text-neutral-200 hover:bg-green-500 transition-colors focus:border-3" on:click={() => {
alertStore.set({
type: 'none',

3
src/lib/Others/ChatList.svelte
View File

@@ -6,6 +6,7 @@
import { DownloadIcon, EditIcon, FolderUpIcon, PlusIcon, TrashIcon, XIcon } from "lucide-svelte";
import { exportChat, importChat } from "../../ts/characters";
import { findCharacterbyId } from "../../ts/util";
import TextInput from "../UI/GUI/TextInput.svelte";
let editMode = false
export let close = () => {}
@@ -29,7 +30,7 @@
}
}} 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}>
{#if editMode}
<input class="text-neutral-200 p-2 bg-transparent input-text focus:bg-selected" bind:value={$DataBase.characters[$selectedCharID].chats[i].name} placeholder="string">
<TextInput bind:value={$DataBase.characters[$selectedCharID].chats[i].name} padding={false}/>
{:else}
<span>{chat.name}</span>
{/if}

3
src/lib/Others/GridCatalog.svelte
View File

@@ -4,6 +4,7 @@
import BarIcon from "../SideBars/BarIcon.svelte";
import { User, Users } from "lucide-svelte";
import { selectedCharID } from "../../ts/stores";
import TextInput from "../UI/GUI/TextInput.svelte";
export let endGrid = () => {}
let search = ''
@@ -38,7 +39,7 @@
<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>
<input class="text-neutral-200 mt-2 mb-4 p-2 bg-transparent input-text focus:bg-selected w-4/5 text-xl" placeholder="Search" bind:value={search}>
<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}

17
src/lib/Others/WelcomeRisu.svelte
View File

@@ -5,6 +5,7 @@
import { addDefaultCharacters } from "src/ts/characters";
import { DataBase } from "src/ts/storage/database";
import { sleep } from "src/ts/util";
import TextInput from "../UI/GUI/TextInput.svelte";
let step = 0
let provider = 0
@@ -58,8 +59,8 @@
{#if provider === 1}
<h2>{language.setup.openaikey}</h2>
<div class="w-full ml-2">
<span>API key</span>
<input class="text-neutral-200 mt-2 p-2 bg-transparent input-text focus:bg-selected m-0" bind:value={$DataBase.openAIKey}>
<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>
<div class="flex flex-col items-start ml-2 mt-6">
@@ -71,12 +72,12 @@
{:else if provider === 2}
<h2>{language.setup.openaiProxy}</h2>
<div class="w-full ml-2">
<span>OpenAI Reverse Proxy URL</span>
<input class="text-neutral-200 mt-2 p-2 bg-transparent input-text focus:bg-selected m-0" bind:value={$DataBase.forceReplaceUrl} placeholder="https://...">
<span class="mb-2">OpenAI Reverse Proxy URL</span>
<TextInput bind:value={$DataBase.forceReplaceUrl} placeholder="https://..." autocomplete="off"/>
</div>
<div class="w-full ml-2 mt-4">
<span>API key (Used for passwords)</span>
<input class="text-neutral-200 mt-2 p-2 bg-transparent input-text focus:bg-selected m-0" bind:value={$DataBase.openAIKey} placeholder="Optional">
<span class="mb-2">API key (Used for passwords)</span>
<TextInput bind:value={$DataBase.proxyKey} placeholder="Optional" autocomplete="off"/>
</div>
<div class="flex flex-col items-start ml-2 mt-6">
<button class="hover:text-green-500 transition-colors" on:click={() => {
@@ -144,9 +145,9 @@
</button>
</div>
{:else if step === 5}
<h2>{language.setup.inputName}</h2>
<h2 class="mb-2">{language.setup.inputName}</h2>
<div class="w-full ml-2">
<input class="text-neutral-200 mt-2 p-2 bg-transparent input-text focus:bg-selected m-0" bind:value={$DataBase.username}>
<TextInput bind:value={$DataBase.username} />
</div>
<div class="flex flex-col items-start ml-2 mt-6">
<button class="hover:text-green-500 transition-colors" on:click={async () => {