nanakura/moeka-project
0
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat(stage): custom primary colors (#53)

Browse Source 
* feat(stage-ui): allow disable transitions
* fix(stage-web): apply motion map from file
* chore(stage-web): change icon
* feat(stage): custom primary colors
This commit is contained in:
LemonNeko
2025-03-08 16:51:48 +08:00
committed by GitHub
parent 8b824e8ccf
commit 25e06085f3
23 changed files with 402 additions and 215 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/stage-tamagotchi/src/renderer/src/components/ChatHistory.vue
+5 -5
View File
@@ -36,7 +36,7 @@ onTokenLiteral(async () => {
<div flex-1 /> <!-- spacer -->
<div
ref="chatHistoryRef" v-auto-animate max-h="30vh" flex="~ col"
scrollbar="~ w-2 track-color-transparent thumb-color-pink-300 rounded" h-full w-full overflow-scroll
scrollbar="~ w-2 track-color-transparent thumb-color-primary-300 rounded" h-full w-full overflow-scroll
>
<div flex-1 /> <!-- spacer -->
<div v-for="(message, index) in messages" :key="index" mb-2>
@@ -61,14 +61,14 @@ onTokenLiteral(async () => {
</div>
<div v-if="message.role === 'assistant'" flex mr="12">
<div
flex="~ col" border="4 solid pink-200" shadow="md pink-200/50" min-w-20 rounded-lg px-2 py-1 h="fit"
bg="pink-100"
flex="~ col" border="4 solid primary-200" shadow="md primary-200/50" min-w-20 rounded-lg px-2 py-1 h="fit"
bg="primary-100"
>
<div>
<span text-xs text="pink-400/90" font-semibold class="inline hidden">Airi</span>
<span text-xs text="primary-400/90" font-semibold class="inline hidden">Airi</span>
</div>
<div
v-if="message.content" class="markdown-content" text="xs pink-400"
v-if="message.content" class="markdown-content" text="xs primary-400"
v-html="process(message.content as string)"
/>
<div v-else i-eos-icons:three-dots-loading />
apps/stage-tamagotchi/src/renderer/src/components/InteractiveArea.vue
+6 -6
View File
@@ -104,9 +104,9 @@ onMounted(() => {
<BasicTextarea
v-model="messageInput"
:placeholder="t('stage.message')"
border="solid 2 pink-100"
text="pink-400 hover:pink-600 placeholder:pink-400 placeholder:hover:pink-600"
bg="pink-50 dark:[#3c2632]" max-h="[10lh]" min-h="[1lh]"
border="solid 2 primary-100"
text="primary-400 hover:primary-600 placeholder:primary-400 placeholder:hover:primary-600"
bg="primary-50 dark:[#3c2632]" max-h="[10lh]" min-h="[1lh]"
w-full resize-none overflow-y-scroll rounded-l-xl p-2 font-medium outline-none
transition="all duration-250 ease-in-out placeholder:all placeholder:duration-250 placeholder:ease-in-out"
@submit="handleSend"
@@ -114,9 +114,9 @@ onMounted(() => {
</div>
<div
class="px-4 py-2.5"
border="solid 2 pink-100 "
text="lg pink-400 hover:pink-600 placeholder:pink-400 placeholder:hover:pink-600"
bg="pink-50 dark:[#3c2632]" max-h="[10lh]" min-h="[1lh]"
border="solid 2 primary-100 "
text="lg primary-400 hover:primary-600 placeholder:primary-400 placeholder:hover:primary-600"
bg="primary-50 dark:[#3c2632]" max-h="[10lh]" min-h="[1lh]"
flex items-center justify-center rounded-r-xl
@click="openSettings"
>
apps/stage-tamagotchi/src/renderer/src/pages/index.vue
+2 -2
View File
@@ -64,7 +64,7 @@ const modeIndicatorClass = computed(() => {
>
<div class="absolute h-32 w-full flex items-center justify-center b-2 b-pink bg-white">
<div class="wall absolute top-0 h-8" />
<div class="absolute left-0 top-0 h-full w-full flex animate-flash animate-duration-5s animate-count-infinite items-center justify-center text-1.5rem text-pink-300 font-bold">
<div class="text-primary-300 absolute left-0 top-0 h-full w-full flex animate-flash animate-duration-5s animate-count-infinite items-center justify-center text-1.5rem font-bold">
DRAG HERE TO MOVE
</div>
<div class="wall absolute bottom-0 h-8" />
@@ -113,7 +113,7 @@ const modeIndicatorClass = computed(() => {
}
.wall {
@apply text-pink-200;
@apply text-primary-200;
--wall-width: 8px;
animation: wall-move 1s linear infinite;
apps/stage-tamagotchi/src/renderer/src/pages/settings.vue
+16 -16
View File
@@ -153,9 +153,9 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
<div>
<div
grid="~ cols-[140px_1fr]" my-2 items-center gap-1.5 rounded-lg
bg="[#fff6fc]" px-2 py-1 text="pink-400"
bg="[#fff6fc]" px-2 py-1 text="primary-400"
>
<div text="xs pink-500">
<div text="xs primary-500">
<span>{{ t('settings.openai-base-url.label') }}</span>
</div>
<div flex="~ row" w-full text="xs">
@@ -166,7 +166,7 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
h-6 w-full rounded-md bg-transparent px-2 py-1 text-right font-mono outline-none
>
</div>
<div text="xs pink-500">
<div text="xs primary-500">
<span>{{ t('settings.openai-api-key.label') }}</span>
</div>
<div flex="~ row" w-full text="xs">
@@ -177,7 +177,7 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
h-6 w-full rounded-md bg-transparent px-2 py-1 text-right font-mono outline-none
>
</div>
<div text="xs pink-500">
<div text="xs primary-500">
<span>{{ t('settings.elevenlabs-api-key.label') }}</span>
</div>
<div flex="~ row" w-full text="xs">
@@ -188,7 +188,7 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
h-6 w-full rounded-md bg-transparent px-2 py-1 text-right font-mono outline-none
>
</div>
<div text="xs pink-500">
<div text="xs primary-500">
<span>{{ t('settings.language.title') }}</span>
</div>
<div flex="~ row" w-full text="xs">
@@ -204,7 +204,7 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
</option>
</select>
</div>
<div text="xs pink-500">
<div text="xs primary-500">
<span>{{ t('settings.models') }}</span>
</div>
<div flex="~ row" w-full text="xs">
@@ -223,7 +223,7 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
</option>
</select>
</div>
<div text="xs pink-500">
<div text="xs primary-500">
<span>{{ t('settings.voices') }}</span>
</div>
<div flex="~ row" w-full text="xs">
@@ -257,9 +257,9 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
<div>
<div
grid="~ cols-[140px_1fr]" my-2 items-center gap-1.5 rounded-lg
bg="[#fff6fc]" px-2 py-1 text="pink-400"
bg="[#fff6fc]" px-2 py-1 text="primary-400"
>
<div text="xs pink-500">
<div text="xs primary-500">
<span>{{ t('settings.viewer') }}</span>
</div>
<select
@@ -281,16 +281,16 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
<div pb-2>
<div
grid="~ cols-[140px_1fr]" my-2 items-center gap-1.5 rounded-lg
bg="[#fff6fc]" p-2 text="pink-400"
bg="[#fff6fc]" p-2 text="primary-400"
>
<template v-for="shortcut in shortcuts" :key="shortcut.type">
<span text="xs pink-500">
<span text="xs primary-500">
{{ t(shortcut.name) }}
</span>
<div
class="shortcut-item flex items-center justify-end gap-x-2 px-2 py-0.5"
:class="{ recording: recordingFor === shortcut.type }"
text="xs pink-500"
text="xs primary-500"
cursor-pointer
@click="startRecording(shortcut)"
>
@@ -300,7 +300,7 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
<div v-else class="pointer-events-none">
{{ shortcut.shortcut }}
</div>
<div v-if="isConflict(shortcut)" text="xs pink-500" i-solar:danger-square-bold w-4 />
<div v-if="isConflict(shortcut)" text="xs primary-500" i-solar:danger-square-bold w-4 />
</div>
</template>
</div>
@@ -311,14 +311,14 @@ function isConflict(shortcut: typeof shortcuts.value[0]) {
<div pb-2>
<div
grid="~ cols-[140px_1fr]" my-2 items-center gap-1.5 rounded-lg
bg="[#fff6fc]" p-2 text="pink-400" @click="handleQuit"
bg="[#fff6fc]" p-2 text="primary-400" @click="handleQuit"
>
<div text="xs pink-500">
<div text="xs primary-500">
<span>
{{ t('settings.quit') }}
</span>
</div>
<div text="sm pink-500" text-right>
<div text="sm primary-500" text-right>
<div i-solar:exit-bold-duotone ml-auto />
</div>
</div>