fix colorSchemeType
This commit is contained in:
@@ -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
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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}
|
||||||
|
|||||||
@@ -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}
|
||||||
|
|||||||
@@ -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(){
|
||||||
|
|||||||
Reference in New Issue
Block a user