feat(frontend): redesign the theme editor page

The editor's control panel is now a second ClickGui window skinned
live with the theme being edited, so every change shows in the tool
itself, not just the preview -- same "the section is a ClickGui
window" move the landing's ThemeStrip already uses, applied to a
working tool this time.

- Removed the three uppercase eyebrow-style section labels (the same
  generic-tell pattern already fixed on the landing page); colour
  slots are grouped into named fieldsets (Window/Modules/Text) instead
- Panel split into panel/{PanelHeader,PresetPicker,PaletteTabs,
  ExportActions}.tsx to stay under the file-size limit
- Preset chips got a real swatch (accent dot over a mini card
  gradient) -- previously same-hued presets like Classic/Blue/Azure
  all read as identical blue dots
- Copy/share buttons confirm inline ("Скопировано"/"Ссылка
  скопирована"); import/clipboard failures now surface a message
  instead of failing silently
- Rewrote themes copy to match the landing's voice

Claude-Session: https://claude.ai/code/session_01F1M1Jic1wTSn4igUENynmZ
This commit is contained in:
loki5512344 2026-09-30 10:28:59 +02:00
parent fb853a26f4
commit c2c7e8fa91
Signed by: boba
GPG key ID: 253067914055423B
13 changed files with 793 additions and 246 deletions

View file

@ -19,12 +19,20 @@ export const themesEn = {
},
editor: {
title: 'Theme editor',
lead: 'Build your own theme and bring it into the mod as a single file.',
lead: 'Start from any theme in the mod and change the colors: the menu and this panel repaint as you go.',
panel: 'Theme settings',
nameLabel: 'Theme name',
presets: 'Ready presets',
presets: 'Themes from the mod',
palette: 'What to edit',
colors: 'Colors',
gradients: 'Gradients',
enabled: 'Gradient',
group: {
window: 'Window',
modules: 'Modules',
text: 'Text and accent',
},
alpha: '{{name}}: opacity',
enabledFor: 'Gradient: {{name}}',
angle: 'Angle',
start: 'Start',
end: 'End',
@ -38,12 +46,14 @@ export const themesEn = {
copy: 'Copy for the mod',
copied: 'Copied',
download: 'Download .json',
import: 'Import from file',
share: 'Share link',
import: 'Load from file',
imported: 'Loaded the {{name}} theme',
share: 'Copy link',
shared: 'Link copied',
reset: 'Reset',
reset: 'Reset to {{name}}',
undo: 'Undo',
redo: 'Redo',
importError: 'Could not read the theme: the file is malformed.',
importError: "That isn't a LoVisual theme: the file can't be read. Use a .json downloaded from this editor.",
clipboardError: 'The browser blocked the clipboard. Download the .json and move the file instead.',
},
} satisfies Translation<typeof themesRu>