fix colorSchemeType

This commit is contained in:
kwaroran
2024-07-06 00:47:13 +09:00
parent 42ae85fe52
commit c2d4da73f0
4 changed files with 12 additions and 6 deletions

View File

@@ -14,6 +14,7 @@
import { getModelShortName } from "src/ts/model/names"; import { getModelShortName } from "src/ts/model/names";
import { capitalize } from "src/ts/util"; import { capitalize } from "src/ts/util";
import { longpress } from "src/ts/gui/longtouch"; import { longpress } from "src/ts/gui/longtouch";
import { ColorSchemeTypeStore } from "src/ts/gui/colorscheme";
export let message = '' export let message = ''
export let name = '' export let name = ''
export let largePortrait = false export let largePortrait = false
@@ -267,7 +268,7 @@
</div> </div>
{:else} {:else}
<!-- svelte-ignore a11y-click-events-have-key-events --> <!-- svelte-ignore a11y-click-events-have-key-events -->
<span class="text chat chattext prose prose-invert minw-0" on:click={() => { <span class="text chat chattext prose minw-0" class:prose-invert={$ColorSchemeTypeStore} on:click={() => {
if($DataBase.clickToEdit && idx > -1){ if($DataBase.clickToEdit && idx > -1){
editMode = true editMode = true
} }

View File

@@ -18,6 +18,7 @@
import { tokenize } from "src/ts/tokenizer"; import { tokenize } from "src/ts/tokenizer";
import TextAreaInput from "../UI/GUI/TextAreaInput.svelte"; import TextAreaInput from "../UI/GUI/TextAreaInput.svelte";
import ModuleChatMenu from "../Setting/Pages/Module/ModuleChatMenu.svelte"; import ModuleChatMenu from "../Setting/Pages/Module/ModuleChatMenu.svelte";
import { ColorSchemeTypeStore } from "src/ts/gui/colorscheme";
let btn let btn
let input = '' let input = ''
let cardExportType = 'realm' let cardExportType = 'realm'
@@ -71,7 +72,7 @@
<h2 class="text-green-700 mt-0 mb-2 w-40 max-w-full">Input</h2> <h2 class="text-green-700 mt-0 mb-2 w-40 max-w-full">Input</h2>
{/if} {/if}
{#if $alertStore.type === 'markdown'} {#if $alertStore.type === 'markdown'}
<span class="text-gray-300 chattext prose prose-invert chattext2"> <span class="text-gray-300 chattext prose chattext2" class:prose-invert={$ColorSchemeTypeStore}>
{#await ParseMarkdown($alertStore.msg) then msg} {#await ParseMarkdown($alertStore.msg) then msg}
{@html msg} {@html msg}
{/await} {/await}

View File

@@ -1,4 +1,5 @@
<script lang="ts"> <script lang="ts">
import { ColorSchemeTypeStore } from "src/ts/gui/colorscheme";
import { ParseMarkdown } from "src/ts/parser"; import { ParseMarkdown } from "src/ts/parser";
import { parseMultilangString, toLangName } from "src/ts/util"; import { parseMultilangString, toLangName } from "src/ts/util";
@@ -23,13 +24,13 @@
{/each} {/each}
</div> </div>
{#if markdown} {#if markdown}
<div class="ml-2 max-w-full break-words text chat chattext prose prose-invert"> <div class="ml-2 max-w-full break-words text chat chattext prose" class:prose-invert={$ColorSchemeTypeStore}>
{#await ParseMarkdown(valueObject[selectedLang]) then md} {#await ParseMarkdown(valueObject[selectedLang]) then md}
{@html md} {@html md}
{/await} {/await}
</div> </div>
{:else} {:else}
<div class="ml-2 max-w-full break-words text chat chattext prose prose-invert"> <div class="ml-2 max-w-full break-words text chat chattext prose" class:prose-invert={$ColorSchemeTypeStore}>
{valueObject[selectedLang]} {valueObject[selectedLang]}
</div> </div>
{/if} {/if}

View File

@@ -1,4 +1,4 @@
import { get } from "svelte/store"; import { get, writable } from "svelte/store";
import { DataBase, setDatabase } from "../storage/database"; import { DataBase, setDatabase } from "../storage/database";
import { downloadFile } from "../storage/globalApi"; import { downloadFile } from "../storage/globalApi";
import { BufferToText, selectSingleFile } from "../util"; import { BufferToText, selectSingleFile } from "../util";
@@ -96,6 +96,8 @@ const colorShemes = {
} as const } as const
export const ColorSchemeTypeStore = writable('dark' as 'dark'|'light')
export const colorSchemeList = Object.keys(colorShemes) as (keyof typeof colorShemes)[] export const colorSchemeList = Object.keys(colorShemes) as (keyof typeof colorShemes)[]
export function changeColorScheme(colorScheme: string){ export function changeColorScheme(colorScheme: string){
@@ -114,7 +116,7 @@ export function updateColorScheme(){
let colorScheme = db.colorScheme let colorScheme = db.colorScheme
if(colorScheme == null){ if(colorScheme == null){
colorScheme = defaultColorScheme colorScheme = structuredClone(defaultColorScheme)
} }
//set css variables //set css variables
@@ -127,6 +129,7 @@ export function updateColorScheme(){
document.documentElement.style.setProperty("--risu-theme-textcolor2", colorScheme.textcolor2); document.documentElement.style.setProperty("--risu-theme-textcolor2", colorScheme.textcolor2);
document.documentElement.style.setProperty("--risu-theme-darkborderc", colorScheme.darkBorderc); document.documentElement.style.setProperty("--risu-theme-darkborderc", colorScheme.darkBorderc);
document.documentElement.style.setProperty("--risu-theme-darkbutton", colorScheme.darkbutton); document.documentElement.style.setProperty("--risu-theme-darkbutton", colorScheme.darkbutton);
ColorSchemeTypeStore.set(colorScheme.type)
} }
export function exportColorScheme(){ export function exportColorScheme(){