fix(stage-ui,stage-tamagotchi): bring back i18n, improved settings data ui (#1525)

* fix(stage-ui,stage-tamagotchi): bring back i18n, improved settings data ui

* fix(stage-layouts): extra height / top
This commit is contained in:
Neko
2026-03-31 08:17:29 +08:00
committed by GitHub
parent 718e91a833
commit 447d718030
6 changed files with 27 additions and 11 deletions
@@ -31,13 +31,13 @@ async function triggerOpenDesktopUserDataFolder() {
</script>
<template>
<div :class="['border-2 border-sky-200/80 rounded-xl bg-sky-50/80 p-4 shadow-sm', 'dark:border-sky-500/40 dark:bg-sky-500/10']">
<div :class="['border-2 border-neutral-200/50 rounded-xl bg-white/70 p-4 shadow-sm', 'dark:border-neutral-800/60 dark:bg-neutral-900/60']">
<div :class="['grid grid-cols-1 items-start gap-3 md:grid-cols-[minmax(0,1fr)_auto]']">
<div :class="['flex flex-col gap-1 md:max-w-[560px]']">
<div :class="['text-lg text-sky-700 font-medium dark:text-sky-200']">
<div :class="['text-lg font-medium']">
{{ t('settings.pages.data.sections.desktop-folder.title') }}
</div>
<p :class="['text-sm text-sky-700/80 dark:text-sky-200/80']">
<p :class="['text-sm text-neutral-600 dark:text-neutral-400']">
{{ t('settings.pages.data.sections.desktop-folder.description') }}
</p>
</div>
@@ -23,7 +23,7 @@ async function resetDesktopState() {
</script>
<template>
<div :class="['border-2 border-amber-300/80 rounded-xl bg-amber-50/80 p-4 shadow-sm', 'dark:border-amber-500/60 dark:bg-amber-500/10']">
<div :class="['border-2 border-amber-300/10 rounded-xl bg-amber-50/80 p-4 shadow-sm', 'dark:border-amber-500/10 dark:bg-amber-500/10']">
<div :class="['grid grid-cols-1 items-start gap-3 md:grid-cols-[minmax(0,1fr)_auto]']">
<div :class="['flex flex-col gap-1 md:max-w-[560px]']">
<div :class="['text-lg text-amber-700 font-medium dark:text-amber-200']">
@@ -14,10 +14,10 @@ const { statusMessage, statusTone, handleStatus } = createDataSettingsStatusStat
<template>
<div :class="['flex flex-col gap-4 pb-4']">
<DesktopFolderSection @status="handleStatus" />
<StatusBanner v-if="statusMessage" :message="statusMessage" :tone="statusTone" />
<ChatsSection @status="handleStatus" />
<ModelsModulesSection @status="handleStatus" />
<DesktopFolderSection @status="handleStatus" />
<DesktopResetSection @status="handleStatus" />
<DangerSection @status="handleStatus" />
</div>
@@ -257,6 +257,10 @@ pages:
title: Delete all data
description: Wipe every local setting, provider config, and model.
delete: Delete all data
desktop-folder:
title: Open app data folder
description: Open AIRI's data folder in your file manager.
open: Open folder
desktop:
title: Reset desktop settings & states
description: Clear AIRI desktop settings and runtime state.
@@ -823,6 +827,9 @@ pages:
openai:
description: openai.com
title: OpenAI
azure-openai:
description: Azure OpenAI API
title: Azure OpenAI
openai-compatible:
description: OpenAI Compatible
title: OpenAI Compatible
@@ -835,6 +842,9 @@ pages:
openrouter:
description: openrouter.ai
title: OpenRouter
openrouter-audio-speech:
description: openrouter.ai
title: OpenRouter
perplexity:
description: perplexity.ai
title: Perplexity
@@ -90,7 +90,13 @@ onMounted(() => updateThemeColor())
<HeaderLink />
</div>
<!-- Content -->
<div class="max-h-[calc(100%-40px)] px-3 py-0 sm:max-h-[calc(100%-56px)] 2xl:max-w-screen-2xl md:py-0 xl:px-4" flex="~ col" mx-auto h-full min-h-0>
<div
:class="[
'px-3 py-0 2xl:max-w-screen-2xl md:py-0 xl:px-4',
isStageTamagotchi() ? 'sm:max-h-[calc(100%)] max-h-[calc(100%)]' : 'sm:max-h-[calc(100%-56px)] max-h-[calc(100%-40px)]',
'flex flex-col mx-auto h-full min-h-0',
]"
>
<PageHeader
:title="routeHeaderMetadata?.title || ''"
:subtitle="routeHeaderMetadata?.subtitle"
@@ -34,7 +34,7 @@ async function deleteAll() {
</script>
<template>
<div :class="['border-2 border-red-300/80 rounded-xl bg-red-50/80 p-4 shadow-sm', 'dark:border-red-500/60 dark:bg-red-500/10']">
<div :class="['border-2 border-red-300/10 rounded-xl bg-red-50/80 p-4 shadow-sm', 'dark:border-red-500/10 dark:bg-red-500/10']">
<div :class="['flex flex-col gap-3']">
<div>
<div :class="['text-lg text-red-600 font-semibold dark:text-red-300']">
@@ -45,9 +45,9 @@ async function deleteAll() {
</p>
</div>
<div :class="['flex flex-col gap-3']">
<div :class="['grid gap-3 md:grid-cols-2']">
<div :class="['grid grid-cols-1 items-start gap-2 p-3 md:grid-cols-[minmax(0,1fr)_auto]']">
<div :class="['flex flex-col gap-5']">
<div :class="['grid gap-5']">
<div :class="['grid grid-cols-1 items-start gap-2 md:grid-cols-[minmax(0,1fr)_auto]']">
<div :class="['flex flex-col gap-1 md:max-w-[560px]']">
<div :class="['text-sm text-red-700 font-medium dark:text-red-200']">
{{ t('settings.pages.data.sections.providers.title') }}
@@ -69,7 +69,7 @@ async function deleteAll() {
</div>
</div>
<div :class="['grid grid-cols-1 items-start gap-2 p-3 md:grid-cols-[minmax(0,1fr)_auto]']">
<div :class="['grid grid-cols-1 items-start gap-2 md:grid-cols-[minmax(0,1fr)_auto]']">
<div :class="['flex flex-col gap-1 md:max-w-[560px]']">
<div :class="['text-sm text-red-700 font-medium dark:text-red-200']">
{{ t('settings.pages.data.sections.all.title') }}