From a83264c77d7266ceaf8051884d52f50a7858c99c Mon Sep 17 00:00:00 2001 From: Jokin Date: Wed, 23 Sep 2026 16:30:55 +0200 Subject: [PATCH] Rename the darker tone to AMOLED; file icons are always colored MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - Tone: the "darker" option is labelled "AMOLED" in all 7 locales — it is the true-black AMOLED palette. The persisted value stays "darker", so no settings migration. - File icons: the Plain/Multi option is gone and the per-category glyphs + colors are always on. Removed the iconColors setting (type, default, signal, setter, options row, strings) and the plain branch in file-icons.ts. A stale "iconColors" key in settings.json is carried harmlessly and dropped on the next save. Co-Authored-By: Claude --- docs/architecture.md | 4 ++-- docs/gotchas.md | 5 +++-- src/shared/i18n/de.ts | 3 +-- src/shared/i18n/en.ts | 3 +-- src/shared/i18n/es.ts | 3 +-- src/shared/i18n/eu.ts | 3 +-- src/shared/i18n/fr.ts | 3 +-- src/shared/i18n/ja.ts | 3 +-- src/shared/i18n/zh.ts | 3 +-- src/shared/types.ts | 3 --- ui/src/app/core/file-icons.ts | 10 +++------- ui/src/app/core/settings.service.ts | 9 --------- .../skins/shadlike/file-panel/file-panel.ts | 4 ++-- ui/src/app/skins/shadlike/tab-bar/tab-bar.ts | 19 ------------------- ui/src/styles.css | 2 +- 15 files changed, 18 insertions(+), 59 deletions(-) diff --git a/docs/architecture.md b/docs/architecture.md index fd75a8f..96dfa43 100644 --- a/docs/architecture.md +++ b/docs/architecture.md @@ -234,8 +234,8 @@ component; tokens → `ui/src/styles.css`. (dotted lookup, `{param}` interpolation, `{one,other}` plural maps via `Intl.PluralRules`); missing keys fall back to English then the raw key. **Reactive by design**: `t()` reads the `locale` signal, so every template - binding that calls it re-renders live on a language switch (same call-stack - tracking as `iconClass`) — no pipe. Also exposes locale-aware `date()`/`size()` + binding that calls it re-renders live on a language switch (call-stack + tracking, see gotchas.md) — no pipe. Also exposes locale-aware `date()`/`size()` /`speed()` so the file list reformats on switch. `SettingsService.applyLocale` resolves the `locale` setting (`system` → `navigator.language`) into it, on boot and on the `settingsChanged` broadcast (so editor/manager windows follow). diff --git a/docs/gotchas.md b/docs/gotchas.md index 68d29a6..c38be7d 100644 --- a/docs/gotchas.md +++ b/docs/gotchas.md @@ -20,8 +20,9 @@ touching the adjacent code. `[class.shadow-[...]]` (brackets) does NOT parse — use `[style.box-shadow]`. Static class attributes may use arbitrary values freely. - Functions called from templates ARE reactive: signals read inside them - register on the view's consumer (call-stack-based tracking). That's why - `iconClass(entry)` reacting to `settings.iconColors()` works. + register on the view's consumer (call-stack-based tracking). That's why a + template calling `i18n.t()` re-renders on a language switch — `t()` reads + the `locale` signal. - Dedicated tools > shell: IDE diagnostics between paired template/class edits are often stale mid-sequence — trust `bun run build:ui` (full AOT type-check), not the first red squiggle. diff --git a/src/shared/i18n/de.ts b/src/shared/i18n/de.ts index 905b274..001265f 100644 --- a/src/shared/i18n/de.ts +++ b/src/shared/i18n/de.ts @@ -34,7 +34,7 @@ export const de = { language: "Sprache", system: "System", theme: { label: "Design", system: "System", light: "Hell", dark: "Dunkel" }, - tone: { label: "Ton", dark: "Dunkel", darker: "Dunkler" }, + tone: { label: "Ton", dark: "Dunkel", darker: "AMOLED" }, accent: { label: "Akzent" }, accentNames: { graphite: "Graphit", @@ -46,7 +46,6 @@ export const de = { green: "Grün", teal: "Petrol", }, - fileIcons: { label: "Datei-Symbole", plain: "Einfach", multi: "Farbig" }, interface: { label: "Oberfläche", smaller: "Kleiner", larger: "Größer", reset: "Auf 100% zurücksetzen" }, speedUnit: { label: "Geschwindigkeitseinheit" }, transfers: { label: "Übertragungen", single: "Einzeln", multi: "Mehrere" }, diff --git a/src/shared/i18n/en.ts b/src/shared/i18n/en.ts index b708df9..1256ae6 100644 --- a/src/shared/i18n/en.ts +++ b/src/shared/i18n/en.ts @@ -38,7 +38,7 @@ export const en = { language: "Language", system: "System", theme: { label: "Theme", system: "System", light: "Light", dark: "Dark" }, - tone: { label: "Tone", dark: "Dark", darker: "Darker" }, + tone: { label: "Tone", dark: "Dark", darker: "AMOLED" }, accent: { label: "Accent" }, accentNames: { graphite: "Graphite", @@ -50,7 +50,6 @@ export const en = { green: "Green", teal: "Teal", }, - fileIcons: { label: "File icons", plain: "Plain", multi: "Multi" }, interface: { label: "Interface", smaller: "Smaller", larger: "Larger", reset: "Reset to 100%" }, speedUnit: { label: "Speed unit" }, transfers: { label: "Transfers", single: "Single", multi: "Multi" }, diff --git a/src/shared/i18n/es.ts b/src/shared/i18n/es.ts index 264a82a..41d02a7 100644 --- a/src/shared/i18n/es.ts +++ b/src/shared/i18n/es.ts @@ -34,7 +34,7 @@ export const es = { language: "Idioma", system: "Sistema", theme: { label: "Tema", system: "Sistema", light: "Claro", dark: "Oscuro" }, - tone: { label: "Tono", dark: "Oscuro", darker: "Más oscuro" }, + tone: { label: "Tono", dark: "Oscuro", darker: "AMOLED" }, accent: { label: "Acento" }, accentNames: { graphite: "Grafito", @@ -46,7 +46,6 @@ export const es = { green: "Verde", teal: "Turquesa", }, - fileIcons: { label: "Iconos", plain: "Simple", multi: "Color" }, interface: { label: "Interfaz", smaller: "Más pequeña", larger: "Más grande", reset: "Restablecer al 100%" }, speedUnit: { label: "Unidad de velocidad" }, transfers: { label: "Transferencias", single: "Una", multi: "Varias" }, diff --git a/src/shared/i18n/eu.ts b/src/shared/i18n/eu.ts index 39a43d9..52df458 100644 --- a/src/shared/i18n/eu.ts +++ b/src/shared/i18n/eu.ts @@ -36,7 +36,7 @@ export const eu = { language: "Hizkuntza", system: "Sistema", theme: { label: "Gaia", system: "Sistema", light: "Argia", dark: "Iluna" }, - tone: { label: "Tonua", dark: "Iluna", darker: "Ilunagoa" }, + tone: { label: "Tonua", dark: "Iluna", darker: "AMOLED" }, accent: { label: "Azentua" }, accentNames: { graphite: "Grafitoa", @@ -48,7 +48,6 @@ export const eu = { green: "Berdea", teal: "Turkesa", }, - fileIcons: { label: "Fitxategi-ikonoak", plain: "Soila", multi: "Koloretsua" }, interface: { label: "Interfazea", smaller: "Txikiagoa", larger: "Handiagoa", reset: "Berrezarri %100era" }, speedUnit: { label: "Abiadura-unitatea" }, transfers: { label: "Transferentziak", single: "Banaka", multi: "Anitz" }, diff --git a/src/shared/i18n/fr.ts b/src/shared/i18n/fr.ts index fa1d380..e8f6845 100644 --- a/src/shared/i18n/fr.ts +++ b/src/shared/i18n/fr.ts @@ -34,7 +34,7 @@ export const fr = { language: "Langue", system: "Système", theme: { label: "Thème", system: "Système", light: "Clair", dark: "Sombre" }, - tone: { label: "Ton", dark: "Sombre", darker: "Plus sombre" }, + tone: { label: "Ton", dark: "Sombre", darker: "AMOLED" }, accent: { label: "Accent" }, accentNames: { graphite: "Graphite", @@ -46,7 +46,6 @@ export const fr = { green: "Vert", teal: "Sarcelle", }, - fileIcons: { label: "Icônes", plain: "Simple", multi: "Couleur" }, interface: { label: "Interface", smaller: "Plus petite", larger: "Plus grande", reset: "Réinitialiser à 100%" }, speedUnit: { label: "Unité de vitesse" }, transfers: { label: "Transferts", single: "Un", multi: "Plusieurs" }, diff --git a/src/shared/i18n/ja.ts b/src/shared/i18n/ja.ts index a6bfa46..76fedf4 100644 --- a/src/shared/i18n/ja.ts +++ b/src/shared/i18n/ja.ts @@ -35,7 +35,7 @@ export const ja = { language: "言語", system: "システム", theme: { label: "テーマ", system: "システム", light: "ライト", dark: "ダーク" }, - tone: { label: "トーン", dark: "ダーク", darker: "より暗く" }, + tone: { label: "トーン", dark: "ダーク", darker: "AMOLED" }, accent: { label: "アクセント" }, accentNames: { graphite: "グラファイト", @@ -47,7 +47,6 @@ export const ja = { green: "グリーン", teal: "ティール", }, - fileIcons: { label: "ファイルアイコン", plain: "シンプル", multi: "カラー" }, interface: { label: "インターフェース", smaller: "縮小", larger: "拡大", reset: "100%に戻す" }, speedUnit: { label: "速度の単位" }, transfers: { label: "転送", single: "1件ずつ", multi: "複数" }, diff --git a/src/shared/i18n/zh.ts b/src/shared/i18n/zh.ts index b2d8bad..a6dd65b 100644 --- a/src/shared/i18n/zh.ts +++ b/src/shared/i18n/zh.ts @@ -35,7 +35,7 @@ export const zh = { language: "语言", system: "系统", theme: { label: "主题", system: "系统", light: "浅色", dark: "深色" }, - tone: { label: "色调", dark: "深色", darker: "更深" }, + tone: { label: "色调", dark: "深色", darker: "AMOLED" }, accent: { label: "强调色" }, accentNames: { graphite: "石墨", @@ -47,7 +47,6 @@ export const zh = { green: "绿色", teal: "青色", }, - fileIcons: { label: "文件图标", plain: "简约", multi: "彩色" }, interface: { label: "界面", smaller: "缩小", larger: "放大", reset: "重置为100%" }, speedUnit: { label: "速度单位" }, transfers: { label: "传输", single: "单个", multi: "多个" }, diff --git a/src/shared/types.ts b/src/shared/types.ts index 064e822..297588a 100644 --- a/src/shared/types.ts +++ b/src/shared/types.ts @@ -83,8 +83,6 @@ export interface AppSettings { darkTone: "dark" | "darker"; /** Accent tone for chrome and selection tint; graphite = neutral zinc. */ accent: AccentTone; - /** File-list icons: plain neutral glyphs, or per-category glyphs and colors. */ - iconColors: "plain" | "multi"; /** Visible optional file-list columns (both panels; Name always shows). */ columns: ColumnKey[]; speedUnit: "MBps" | "Mbps"; @@ -116,7 +114,6 @@ export const DEFAULT_SETTINGS: AppSettings = { theme: "system", darkTone: "dark", accent: "blue", - iconColors: "multi", columns: ["size", "mtime"], speedUnit: "MBps", uiScale: 1, diff --git a/ui/src/app/core/file-icons.ts b/ui/src/app/core/file-icons.ts index e5605ed..996cfb1 100644 --- a/ui/src/app/core/file-icons.ts +++ b/ui/src/app/core/file-icons.ts @@ -1,4 +1,4 @@ -// File-list glyphs + per-category colors ("Multi" icon mode). Category colors +// File-list glyphs + per-category colors. Category colors // are fixed tokens (never follow the accent) so a folder is always folder-blue. // Only the icon glyph is colored; row text stays neutral. Docs and unknown // files stay muted on purpose — sparing color is what keeps it scannable. @@ -8,7 +8,6 @@ type Category = 'image' | 'audio' | 'video' | 'archive' | 'code' | 'doc'; // Class strings are literals so the Tailwind scanner picks them up. const MUTED = 'shrink-0 text-muted-foreground'; -const PRIMARY = 'shrink-0 text-primary'; const FOLDER = 'shrink-0 text-icon-folder'; const LINK = 'shrink-0 text-icon-link'; @@ -85,18 +84,15 @@ export function fileKindKey(entry: FileEntry): string { return category ? KIND_KEYS[category] : 'file'; } -export function fileGlyph(entry: FileEntry, multi: boolean): string { +export function fileGlyph(entry: FileEntry): string { if (entry.name === '..') return 'mynaArrowUp'; if (entry.type === 'dir') return 'mynaFolder'; - if (!multi) return 'mynaFile'; if (entry.type === 'symlink') return 'mynaLink'; const category = categoryOf(entry.name); return category ? CATEGORIES[category].glyph : 'mynaFile'; } -export function fileIconClass(entry: FileEntry, multi: boolean): string { - // plain mode: exactly the pre-color look ('..' has type 'dir' -> primary) - if (!multi) return entry.type === 'dir' ? PRIMARY : MUTED; +export function fileIconClass(entry: FileEntry): string { if (entry.name === '..') return MUTED; if (entry.type === 'dir') return FOLDER; if (entry.type === 'symlink') return LINK; diff --git a/ui/src/app/core/settings.service.ts b/ui/src/app/core/settings.service.ts index 8824353..a30e4f8 100644 --- a/ui/src/app/core/settings.service.ts +++ b/ui/src/app/core/settings.service.ts @@ -10,7 +10,6 @@ export class SettingsService { readonly theme = signal(DEFAULT_SETTINGS.theme); readonly darkTone = signal(DEFAULT_SETTINGS.darkTone); readonly accent = signal(DEFAULT_SETTINGS.accent); - readonly iconColors = signal(DEFAULT_SETTINGS.iconColors); readonly columns = signal(DEFAULT_SETTINGS.columns); readonly speedUnit = signal(DEFAULT_SETTINGS.speedUnit); readonly uiScale = signal(DEFAULT_SETTINGS.uiScale); @@ -53,7 +52,6 @@ export class SettingsService { this.theme.set(settings.theme); this.darkTone.set(settings.darkTone); this.accent.set(settings.accent); - this.iconColors.set(settings.iconColors); this.columns.set(settings.columns); this.speedUnit.set(settings.speedUnit); this.uiScale.set(settings.uiScale); @@ -93,12 +91,6 @@ export class SettingsService { void this.persist(); } - setIconColors(mode: AppSettings['iconColors']): void { - // no apply step — the file panels read the signal reactively - this.iconColors.set(mode); - void this.persist(); - } - toggleColumn(key: ColumnKey): void { this.columns.update((list) => list.includes(key) ? list.filter((c) => c !== key) : [...list, key], @@ -193,7 +185,6 @@ export class SettingsService { theme: this.theme(), darkTone: this.darkTone(), accent: this.accent(), - iconColors: this.iconColors(), columns: this.columns(), speedUnit: this.speedUnit(), uiScale: this.uiScale(), diff --git a/ui/src/app/skins/shadlike/file-panel/file-panel.ts b/ui/src/app/skins/shadlike/file-panel/file-panel.ts index 422ada1..0fbecb0 100644 --- a/ui/src/app/skins/shadlike/file-panel/file-panel.ts +++ b/ui/src/app/skins/shadlike/file-panel/file-panel.ts @@ -177,11 +177,11 @@ export class FilePanel { } iconFor(entry: FileEntry): string { - return fileGlyph(entry, this.settings.iconColors() === 'multi'); + return fileGlyph(entry); } iconClass(entry: FileEntry): string { - return fileIconClass(entry, this.settings.iconColors() === 'multi'); + return fileIconClass(entry); } isSelected(entry: FileEntry): boolean { diff --git a/ui/src/app/skins/shadlike/tab-bar/tab-bar.ts b/ui/src/app/skins/shadlike/tab-bar/tab-bar.ts index a7938c3..106d8d3 100644 --- a/ui/src/app/skins/shadlike/tab-bar/tab-bar.ts +++ b/ui/src/app/skins/shadlike/tab-bar/tab-bar.ts @@ -30,7 +30,6 @@ const SPEED_UNITS = [ { value: 'MBps', label: 'MB/s' }, { value: 'Mbps', label: 'Mbps' }, ] as const; -const ICON_COLOR_MODES = ['plain', 'multi'] as const; const TRANSFER_MODES = ['single', 'multi'] as const; const CONCURRENCY_CHOICES = [2, 3, 4, 6, 8] as const; @@ -242,23 +241,6 @@ const CONCURRENCY_CHOICES = [2, 3, 4, 6, 8] as const; -
- {{ i18n.t('options.fileIcons.label') }} -
- @for (mode of iconColorModes; track mode) { - - } -
-
- @@ -463,7 +445,6 @@ export class TabBar { readonly themes = THEMES; readonly darkTones = DARK_TONES; readonly accents = ACCENTS; - readonly iconColorModes = ICON_COLOR_MODES; readonly speedUnits = SPEED_UNITS; /** "100%" for the stepper readout; the value itself lives in settings. */ readonly scalePercent = computed(() => `${Math.round(this.settings.uiScale() * 100)}%`); diff --git a/ui/src/styles.css b/ui/src/styles.css index a6c7faa..c4594bc 100644 --- a/ui/src/styles.css +++ b/ui/src/styles.css @@ -30,7 +30,7 @@ --input: oklch(0.92 0.004 286.32); --ring: oklch(0.705 0.015 286.067); --radius: 0.5rem; - /* file-type icon colors ("Multi" mode) — fixed category hues, muted chroma */ + /* file-type icon colors — fixed category hues, muted chroma */ --icon-folder: oklch(0.58 0.13 250); --icon-link: oklch(0.56 0.1 190); --icon-image: oklch(0.58 0.13 295);