Refactor additionalClass parameter to be className for clarity
This commit is contained in:
@@ -103,8 +103,8 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<span class="mt-4 text-xl">{language.basicInfo}</span>
|
<span class="mt-4 text-xl">{language.basicInfo}</span>
|
||||||
<TextInput bind:value={currentModule.name} additionalClass="mt-1" placeholder={language.name}/>
|
<TextInput bind:value={currentModule.name} className="mt-1" placeholder={language.name}/>
|
||||||
<TextInput bind:value={currentModule.description} additionalClass="mt-1" placeholder={language.description} size="sm"/>
|
<TextInput bind:value={currentModule.description} className="mt-1" placeholder={language.description} size="sm"/>
|
||||||
<span class="mt-6 text-xl">{language.moduleContent}</span>
|
<span class="mt-6 text-xl">{language.moduleContent}</span>
|
||||||
<div class="grid grid-cols-2 border-selected border rounded-md">
|
<div class="grid grid-cols-2 border-selected border rounded-md">
|
||||||
<button class={(!Array.isArray(currentModule.lorebook)) ? 'p-4' : "p-4 bg-selected rounded-tl-md"} on:click={toggleLorebook}>
|
<button class={(!Array.isArray(currentModule.lorebook)) ? 'p-4' : "p-4 bg-selected rounded-tl-md"} on:click={toggleLorebook}>
|
||||||
|
|||||||
@@ -624,10 +624,10 @@
|
|||||||
{/if}
|
{/if}
|
||||||
{#if currentChar.data.ttsMode === 'huggingface'}
|
{#if currentChar.data.ttsMode === 'huggingface'}
|
||||||
<span class="text-textcolor">Model</span>
|
<span class="text-textcolor">Model</span>
|
||||||
<TextInput additionalClass="mb-4 mt-2" bind:value={currentChar.data.hfTTS.model} />
|
<TextInput className="mb-4 mt-2" bind:value={currentChar.data.hfTTS.model} />
|
||||||
|
|
||||||
<span class="text-textcolor">Language</span>
|
<span class="text-textcolor">Language</span>
|
||||||
<TextInput additionalClass="mb-4 mt-2" bind:value={currentChar.data.hfTTS.language} placeholder="en" />
|
<TextInput className="mb-4 mt-2" bind:value={currentChar.data.hfTTS.language} placeholder="en" />
|
||||||
{/if}
|
{/if}
|
||||||
{#if currentChar.data.ttsMode === 'vits'}
|
{#if currentChar.data.ttsMode === 'vits'}
|
||||||
{#if currentChar.data.vits}
|
{#if currentChar.data.vits}
|
||||||
@@ -693,8 +693,8 @@
|
|||||||
|
|
||||||
<span class="text-textcolor">{language.depthPrompt}</span>
|
<span class="text-textcolor">{language.depthPrompt}</span>
|
||||||
<div class="flex justify-center items-center">
|
<div class="flex justify-center items-center">
|
||||||
<NumberInput size="sm" bind:value={currentChar.data.depth_prompt.depth} additionalClass="w-12"/>
|
<NumberInput size="sm" bind:value={currentChar.data.depth_prompt.depth} className="w-12"/>
|
||||||
<TextInput size="sm" bind:value={currentChar.data.depth_prompt.prompt} additionalClass="flex-1"/>
|
<TextInput size="sm" bind:value={currentChar.data.depth_prompt.prompt} className="flex-1"/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<span class="text-textcolor mt-2">{language.altGreet}</span>
|
<span class="text-textcolor mt-2">{language.altGreet}</span>
|
||||||
|
|||||||
@@ -43,7 +43,7 @@
|
|||||||
}
|
}
|
||||||
}} class="flex items-center text-textcolor border-solid border-0 border-darkborderc p-2 cursor-pointer rounded-md"class:bg-selected={i === chara.chatPage}>
|
}} class="flex items-center text-textcolor border-solid border-0 border-darkborderc p-2 cursor-pointer rounded-md"class:bg-selected={i === chara.chatPage}>
|
||||||
{#if editMode}
|
{#if editMode}
|
||||||
<TextInput bind:value={chara.chats[i].name} additionalClass="flex-grow min-w-0" padding={false}/>
|
<TextInput bind:value={chara.chats[i].name} className="flex-grow min-w-0" padding={false}/>
|
||||||
{:else}
|
{:else}
|
||||||
<span>{chat.name}</span>
|
<span>{chat.name}</span>
|
||||||
{/if}
|
{/if}
|
||||||
|
|||||||
@@ -57,4 +57,4 @@
|
|||||||
<TextAreaInput autocomplete="off" bind:value={valueObject[selectedLang]} height={"20"} onInput={() => {
|
<TextAreaInput autocomplete="off" bind:value={valueObject[selectedLang]} height={"20"} onInput={() => {
|
||||||
updateValue()
|
updateValue()
|
||||||
onInput()
|
onInput()
|
||||||
}} additionalClass={className} />
|
}} className={className} />
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<input
|
<input
|
||||||
class={"border border-darkborderc focus:border-borderc rounded-md shadow-sm text-textcolor bg-transparent numinput focus:ring-borderc focus:ring-2 focus:outline-none transition-colors duration-200" + ((additionalClass) ? (' ' + additionalClass) : '')}
|
class={"border border-darkborderc focus:border-borderc rounded-md shadow-sm text-textcolor bg-transparent numinput focus:ring-borderc focus:ring-2 focus:outline-none transition-colors duration-200" + ((className) ? (' ' + className) : '')}
|
||||||
class:text-sm={size === 'sm'}
|
class:text-sm={size === 'sm'}
|
||||||
class:text-md={size === 'md'}
|
class:text-md={size === 'md'}
|
||||||
class:text-lg={size === 'lg'}
|
class:text-lg={size === 'lg'}
|
||||||
@@ -31,7 +31,7 @@
|
|||||||
export let fullwidth = false
|
export let fullwidth = false
|
||||||
export let fullh = false
|
export let fullh = false
|
||||||
export let onChange = () => {}
|
export let onChange = () => {}
|
||||||
export let additionalClass = ''
|
export let className = ''
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style>
|
<style>
|
||||||
|
|||||||
@@ -32,15 +32,15 @@
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
{#if (value === null || value === undefined)}
|
{#if (value === null || value === undefined)}
|
||||||
<TextInput value={"Using default"} additionalClass="flex-1" disabled/>
|
<TextInput value={"Using default"} className="flex-1" disabled/>
|
||||||
{:else if typeof(value) === 'string'}
|
{:else if typeof(value) === 'string'}
|
||||||
<TextInput bind:value={value} additionalClass="flex-1"/>
|
<TextInput bind:value={value} className="flex-1"/>
|
||||||
{:else if typeof(value) === 'number'}
|
{:else if typeof(value) === 'number'}
|
||||||
<NumberInput bind:value={value} additionalClass="flex-1"/>
|
<NumberInput bind:value={value} className="flex-1"/>
|
||||||
{:else if typeof(value) === 'boolean'}
|
{:else if typeof(value) === 'boolean'}
|
||||||
<button class="px-2 py-2 border border-darkborderc flex-1" class:text-textcolor2={!value} on:click={valToggle}>True</button>
|
<button class="px-2 py-2 border border-darkborderc flex-1" class:text-textcolor2={!value} on:click={valToggle}>True</button>
|
||||||
<button class="px-2 py-2 border border-darkborderc flex-1" class:text-textcolor2={value} on:click={valToggle}>False</button>
|
<button class="px-2 py-2 border border-darkborderc flex-1" class:text-textcolor2={value} on:click={valToggle}>False</button>
|
||||||
{:else}
|
{:else}
|
||||||
<TextInput value={"Using default"} additionalClass="flex-1" disabled/>
|
<TextInput value={"Using default"} className="flex-1" disabled/>
|
||||||
{/if}
|
{/if}
|
||||||
</div>
|
</div>
|
||||||
@@ -1,6 +1,6 @@
|
|||||||
{#if optimaizedInput}
|
{#if optimaizedInput}
|
||||||
<textarea
|
<textarea
|
||||||
class={"border border-darkborderc n-scroll focus:border-borderc resize-none rounded-md shadow-sm text-textcolor bg-transparent focus:ring-borderc focus:ring-2 focus:outline-none transition-colors duration-200" + ((additionalClass) ? (' ' + additionalClass) : '')}
|
class={"border border-darkborderc n-scroll focus:border-borderc resize-none rounded-md shadow-sm text-textcolor bg-transparent focus:ring-borderc focus:ring-2 focus:outline-none transition-colors duration-200" + ((className) ? (' ' + className) : '')}
|
||||||
class:text-sm={size === 'sm'}
|
class:text-sm={size === 'sm'}
|
||||||
class:text-md={size === 'md'}
|
class:text-md={size === 'md'}
|
||||||
class:text-lg={size === 'lg'}
|
class:text-lg={size === 'lg'}
|
||||||
@@ -37,7 +37,7 @@
|
|||||||
/>
|
/>
|
||||||
{:else}
|
{:else}
|
||||||
<textarea
|
<textarea
|
||||||
class={"border border-darkborderc n-scroll focus:border-borderc resize-none rounded-md shadow-sm text-textcolor bg-transparent focus:ring-borderc focus:ring-2 focus:outline-none transition-colors duration-200" + ((additionalClass) ? (' ' + additionalClass) : '')}
|
class={"border border-darkborderc n-scroll focus:border-borderc resize-none rounded-md shadow-sm text-textcolor bg-transparent focus:ring-borderc focus:ring-2 focus:outline-none transition-colors duration-200" + ((className) ? (' ' + className) : '')}
|
||||||
class:text-sm={size === 'sm'}
|
class:text-sm={size === 'sm'}
|
||||||
class:text-md={size === 'md'}
|
class:text-md={size === 'md'}
|
||||||
class:text-lg={size === 'lg'}
|
class:text-lg={size === 'lg'}
|
||||||
@@ -74,7 +74,7 @@
|
|||||||
export let onInput = () => {}
|
export let onInput = () => {}
|
||||||
export let fullwidth = false
|
export let fullwidth = false
|
||||||
export let height:'20'|'24'|'32'|'full' = '20'
|
export let height:'20'|'24'|'32'|'full' = '20'
|
||||||
export let additionalClass = ''
|
export let className = ''
|
||||||
export let optimaizedInput = true
|
export let optimaizedInput = true
|
||||||
let inpa = 0
|
let inpa = 0
|
||||||
|
|
||||||
|
|||||||
@@ -1,5 +1,5 @@
|
|||||||
<input
|
<input
|
||||||
class={"border border-darkborderc focus:border-borderc rounded-md shadow-sm text-textcolor bg-transparent focus:ring-borderc focus:ring-2 focus:outline-none transition-colors duration-200" + ((additionalClass) ? (' ' + additionalClass) : '')}
|
class={"border border-darkborderc focus:border-borderc rounded-md shadow-sm text-textcolor bg-transparent focus:ring-borderc focus:ring-2 focus:outline-none transition-colors duration-200" + ((className) ? (' ' + className) : '')}
|
||||||
class:text-sm={size === 'sm'}
|
class:text-sm={size === 'sm'}
|
||||||
class:text-md={size === 'md'}
|
class:text-md={size === 'md'}
|
||||||
class:text-lg={size === 'lg'}
|
class:text-lg={size === 'lg'}
|
||||||
@@ -39,6 +39,6 @@
|
|||||||
export let onInput = () => {}
|
export let onInput = () => {}
|
||||||
export let fullwidth = false
|
export let fullwidth = false
|
||||||
export let fullh = false
|
export let fullh = false
|
||||||
export let additionalClass = ''
|
export let className = ''
|
||||||
export let disabled = false
|
export let disabled = false
|
||||||
</script>
|
</script>
|
||||||
@@ -37,9 +37,9 @@
|
|||||||
<div class="w-full flex justify-center mt-4">
|
<div class="w-full flex justify-center mt-4">
|
||||||
<div class="flex w-2xl max-w-full items-center">
|
<div class="flex w-2xl max-w-full items-center">
|
||||||
{#if $SizeStore.w < 768}
|
{#if $SizeStore.w < 768}
|
||||||
<TextInput additionalClass="flex-grow min-w-0" placeholder="Search" bind:value={search} />
|
<TextInput className="flex-grow min-w-0" placeholder="Search" bind:value={search} />
|
||||||
{:else}
|
{:else}
|
||||||
<TextInput size="xl" additionalClass="flex-grow" placeholder="Search" bind:value={search} />
|
<TextInput size="xl" className="flex-grow" placeholder="Search" bind:value={search} />
|
||||||
|
|
||||||
{/if}
|
{/if}
|
||||||
<button class="bg-darkbg h-14 w-14 min-w-14 rounded-lg ml-2 flex justify-center items-center hover:ring transition-shadow" on:click={() => {
|
<button class="bg-darkbg h-14 w-14 min-w-14 rounded-lg ml-2 flex justify-center items-center hover:ring transition-shadow" on:click={() => {
|
||||||
|
|||||||
Reference in New Issue
Block a user