Text size setting for path bar + file list (Compact/Default/Large)

Segmented row in the options popover; applied via data-text on <html> driving
CSS variables (--list-font / --list-meta-font / --path-font), persisted in
settings.json like theme and speed unit.

Co-Authored-By: Claude Fable 5 <noreply@anthropic.com>
This commit is contained in:
Jokin
2026-07-11 17:30:12 +02:00
co-authored by Claude Fable 5
parent 6048d5c814
commit ff62c07f15
5 changed files with 70 additions and 7 deletions
+19
View File
@@ -9,6 +9,7 @@ const SPEED_UNITS = [
{ value: 'MBps', label: 'MB/s' },
{ value: 'Mbps', label: 'Mbps' },
] as const;
const TEXT_SIZES = ['compact', 'default', 'large'] as const;
@Component({
selector: 'app-tab-bar',
@@ -102,6 +103,23 @@ const SPEED_UNITS = [
</div>
</div>
<div class="mt-2.5 flex items-center justify-between gap-2">
<span class="text-xs text-muted-foreground">Text size</span>
<div class="flex rounded-md border border-border p-0.5">
@for (size of textSizes; track size) {
<button
(click)="settings.setTextSize(size)"
class="rounded px-2 py-0.5 text-[11px] capitalize"
[class.bg-accent]="settings.textSize() === size"
[class.text-foreground]="settings.textSize() === size"
[class.text-muted-foreground]="settings.textSize() !== size"
>
{{ size }}
</button>
}
</div>
</div>
<div class="mt-2.5 flex items-center justify-between gap-2">
<span class="text-xs text-muted-foreground">Speed unit</span>
<div class="flex rounded-md border border-border p-0.5">
@@ -130,6 +148,7 @@ export class TabBar {
readonly isMacChrome = IS_MAC_CHROME;
readonly themes = THEMES;
readonly speedUnits = SPEED_UNITS;
readonly textSizes = TEXT_SIZES;
close(event: MouseEvent, id: number): void {
event.stopPropagation();