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

feat: Apply mobileGUI justify-end to other toggles

Browse Source
This commit is contained in:
enzi221
2025-05-20 01:21:54 +09:00
parent 3f68238c9a
commit 932ce2646f
1 changed files with 10 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/lib/SideBars/Toggles.svelte
View File

@@ -40,14 +40,18 @@
{#snippet toggles(items: sidebarToggle[], reverse: boolean = false)} {#snippet toggles(items: sidebarToggle[], reverse: boolean = false)}
{#each items as toggle, index} {#each items as toggle, index}
{#if toggle.type === 'group' && toggle.children.length > 0} {#if toggle.type === 'group' && toggle.children.length > 0}
<details class="mt-3 mb-1 w-full border border-darkborderc rounded"> <details class="w-full mt-3 mb-1 border border-darkborderc rounded">
<summary class="-m-px p-2 bg-darkbutton border border-darkborderc rounded text-xs cursor-pointer select-none hover:bg-selected transition-colors duration-190">{toggle.value}</summary> <summary
class="-m-px p-2 bg-darkbutton border border-darkborderc rounded text-xs cursor-pointer select-none hover:bg-selected transition-colors duration-190"
class:justify-end={$MobileGUI}>
{toggle.value}
</summary>
<div class="flex flex-col px-2 py-4 pt-0"> <div class="flex flex-col px-2 py-4 pt-0">
{@render toggles((toggle as sidebarToggleGroup).children, reverse)} {@render toggles((toggle as sidebarToggleGroup).children, reverse)}
</div> </div>
</details> </details>
{:else if toggle.type === 'select'} {:else if toggle.type === 'select'}
<div class="flex gap-2 mt-2 items-center" class:flex-row-reverse={!reverse} class:justify-end={!reverse}> <div class="w-full flex gap-2 mt-2 items-center" class:justify-end={$MobileGUI} >
<span>{toggle.value}</span> <span>{toggle.value}</span>
<SelectInput className="w-32" bind:value={DBState.db.globalChatVariables[`toggle_${toggle.key}`]}> <SelectInput className="w-32" bind:value={DBState.db.globalChatVariables[`toggle_${toggle.key}`]}>
{#each toggle.options as option, i} {#each toggle.options as option, i}
@@ -56,7 +60,7 @@
</SelectInput> </SelectInput>
</div> </div>
{:else if toggle.type === 'text'} {:else if toggle.type === 'text'}
<div class="flex gap-2 mt-2 items-center" class:flex-row-reverse={!reverse} class:justify-end={!reverse}> <div class="w-full flex gap-2 mt-2 items-center" class:justify-end={$MobileGUI}>
<span>{toggle.value}</span> <span>{toggle.value}</span>
<TextInput className="w-32" bind:value={DBState.db.globalChatVariables[`toggle_${toggle.key}`]} /> <TextInput className="w-32" bind:value={DBState.db.globalChatVariables[`toggle_${toggle.key}`]} />
</div> </div>
@@ -64,7 +68,7 @@
{@const prevToggle = groupedToggles[index - 1]} {@const prevToggle = groupedToggles[index - 1]}
<!-- Prevent multiple dividers appearing in a row --> <!-- Prevent multiple dividers appearing in a row -->
{#if index === 0 || prevToggle.type !== 'divider' || prevToggle.value !== toggle.value} {#if index === 0 || prevToggle.type !== 'divider' || prevToggle.value !== toggle.value}
<div class="flex gap-2 mt-2 w-full min-h-5 items-center" class:flex-row-reverse={!reverse} class:justify-end={!reverse}> <div class="w-full min-h-5 flex gap-2 mt-2 items-center" class:justify-end={!reverse}>
{#if toggle.value} {#if toggle.value}
<span>{toggle.value}</span> <span>{toggle.value}</span>
{/if} {/if}
@@ -72,7 +76,7 @@
</div> </div>
{/if} {/if}
{:else} {:else}
<div class="flex mt-2 items-center"> <div class="w-full flex mt-2 items-center" class:justify-end={$MobileGUI}>
<CheckInput check={DBState.db.globalChatVariables[`toggle_${toggle.key}`] === '1'} reverse={reverse} name={toggle.value} onChange={() => { <CheckInput check={DBState.db.globalChatVariables[`toggle_${toggle.key}`] === '1'} reverse={reverse} name={toggle.value} onChange={() => {
DBState.db.globalChatVariables[`toggle_${toggle.key}`] = DBState.db.globalChatVariables[`toggle_${toggle.key}`] === '1' ? '0' : '1' DBState.db.globalChatVariables[`toggle_${toggle.key}`] = DBState.db.globalChatVariables[`toggle_${toggle.key}`] === '1' ? '0' : '1'
}} /> }} />