fix(launcher): border-2 on wallpaper chips/buttons for VNC readability

ring-1 uses CSS box-shadow which nearly disappears when the UI is scaled
down through VNC. Switched all preset chips and action buttons to border-2
so they remain clearly distinct at reduced resolution.
preset-tonal-surface + border-2 border-surface-400 for unselected chips;
disabled:opacity-60 (vs default 50) on Save & Apply so it is still
identifiable as a button when no URL is entered yet.

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
This commit is contained in:
Scott Idem
2026-05-20 15:22:22 -04:00
parent e63a17865c
commit 91f40c4a89

View File

@@ -238,7 +238,7 @@ const section_description = $derived(
type="button"
onclick={() => (url_input = preset.value)}
title={preset.value}
class="btn btn-sm h-8 px-3 text-xs ring-1 {url_input === preset.value ? 'preset-filled-primary ring-primary-500' : 'preset-tonal-surface ring-surface-500/50'}">
class="btn btn-sm h-8 px-3 text-xs border-2 {url_input === preset.value ? 'preset-filled-primary border-primary-500' : 'preset-tonal-surface border-surface-400'}">
{preset.label}
</button>
{/each}
@@ -265,7 +265,7 @@ const section_description = $derived(
type="button"
onclick={() => (url_external_input = preset.value)}
title={preset.value}
class="btn btn-sm h-8 px-3 text-xs ring-1 {url_external_input === preset.value ? 'preset-filled-primary ring-primary-500' : 'preset-tonal-surface ring-surface-500/50'}">
class="btn btn-sm h-8 px-3 text-xs border-2 {url_external_input === preset.value ? 'preset-filled-primary border-primary-500' : 'preset-tonal-surface border-surface-400'}">
{preset.label}
</button>
{/each}
@@ -283,7 +283,7 @@ const section_description = $derived(
type="button"
onclick={handle_save_and_apply}
disabled={!get_device_id() || (!url_input.trim() && !url_external_input.trim())}
class="btn preset-filled-primary h-10 flex-1 text-sm font-bold">
class="btn preset-filled-primary border-2 border-primary-600 h-10 flex-1 text-sm font-bold disabled:opacity-60">
<Save size={16} class="mr-1" />
<Zap size={16} class="mr-0.5" />
Save & Apply
@@ -293,7 +293,7 @@ const section_description = $derived(
type="button"
onclick={handle_restore_default}
title="Restore macOS default wallpaper"
class="btn preset-tonal-surface ring-surface-500/50 h-10 w-10 ring-1 opacity-75 hover:opacity-100">
class="btn preset-tonal-surface border-2 border-surface-400 h-10 w-10 opacity-75 hover:opacity-100">
<RotateCcw size={18} />
</button>
{/if}