chore(client): default new users to Nostalgia and teal

Give users without stored appearance choices the Nostalgia style and teal accent while preserving saved selections and BookOrbit styling on standalone pages.
This commit is contained in:
neon
2026-10-19 23:23:13 +00:00
parent 1a2ffb68c0
commit c01022aeb2
5 changed files with 17 additions and 12 deletions
+2 -2
View File
@@ -24,9 +24,9 @@
var root = document.documentElement
var theme = readStoredValue('theme', 'system')
var accent = readStoredValue('accent', 'blue')
var accent = readStoredValue('accent', 'teal')
var radius = readStoredValue('radius', 'default')
var style = readStoredValue('style', 'bookorbit')
var style = readStoredValue('style', 'nostalgia')
var surfacePalette = readStoredValue('surfacePalette', 'steel')
var rawReach = localStorage.getItem('glowReach')
var storedReach = rawReach === null ? 50 : Number(rawReach)
+1 -1
View File
@@ -99,7 +99,7 @@ const ACCENT_META_BY_ID: Record<Accent, AccentMetaDefinition> = {
blush: { label: 'Blush', tone: 'pastel', hue: 328, primary: [0.68, 0.13, 0.81, 0.12] },
}
export const DEFAULT_ACCENT: Accent = 'blue'
export const DEFAULT_ACCENT: Accent = 'teal'
export function resolveAccent(accent: string | null | undefined): Accent {
if (!accent) return DEFAULT_ACCENT
+11 -6
View File
@@ -176,6 +176,7 @@ describe('useThemeStore', () => {
beforeEach(() => {
const colorScheme = createColorSchemeQuery(false)
stubColorScheme(colorScheme.query)
localStorage.setItem('style', '"bookorbit"')
document.documentElement.style.removeProperty('--shell-surface-opacity')
})
@@ -229,13 +230,14 @@ describe('useThemeStore', () => {
document.documentElement.removeAttribute('data-surface')
})
it('starts on the BookOrbit style with the steel palette', () => {
it('starts on the Nostalgia style with the teal accent and steel palette', () => {
setActivePinia(createPinia())
const store = useThemeStore()
expect(store.style).toBe('bookorbit')
expect(store.style).toBe('nostalgia')
expect(store.accent).toBe('teal')
expect(store.surfacePalette).toBe('steel')
expect(document.documentElement.getAttribute('data-style')).toBe('bookorbit')
expect(document.documentElement.getAttribute('data-style')).toBe('nostalgia')
expect(document.documentElement.getAttribute('data-surface')).toBe('steel')
})
@@ -259,7 +261,7 @@ describe('useThemeStore', () => {
setActivePinia(createPinia())
const store = useThemeStore()
expect(store.style).toBe('bookorbit')
expect(store.style).toBe('nostalgia')
expect(store.surfacePalette).toBe('steel')
})
@@ -296,12 +298,13 @@ describe('useThemeStore', () => {
setActivePinia(createPinia())
const store = useThemeStore()
expect(store.styleDefinition.controls.surfacePalette).toBe(false)
store.setStyle('nostalgia')
expect(store.styleDefinition.controls.surfacePalette).toBe(true)
store.setStyle('bookorbit')
expect(store.styleDefinition.controls.surfacePalette).toBe(false)
})
it('changes the appearance key only for settings that change token values', () => {
localStorage.setItem('style', '"bookorbit"')
setActivePinia(createPinia())
const store = useThemeStore()
const initial = store.appearanceKey
@@ -322,6 +325,7 @@ describe('useThemeStore', () => {
})
it('paints the pinned brightness and opacity under Nostalgia and keeps the stored ones', async () => {
localStorage.setItem('style', '"bookorbit"')
localStorage.setItem('brightness', '80')
localStorage.setItem('surfaceOpacity', '85')
setActivePinia(createPinia())
@@ -362,6 +366,7 @@ describe('useThemeStore', () => {
})
it('drops the background pattern under Nostalgia and restores the stored one after', () => {
localStorage.setItem('style', '"bookorbit"')
localStorage.setItem('background', '"aurora"')
setActivePinia(createPinia())
const store = useThemeStore()
+1 -1
View File
@@ -143,7 +143,7 @@ export const useThemeStore = defineStore('theme', () => {
/** A style dresses the app shell only; sign-in pages and readers always paint as BookOrbit. */
const styleScopeActive = ref(isAppShellPath(window.location.pathname))
const appliedStyle = computed<Style>(() => (styleScopeActive.value ? style.value : DEFAULT_STYLE))
const appliedStyle = computed<Style>(() => (styleScopeActive.value ? style.value : 'bookorbit'))
const appliedStyleDefinition = computed(() => getThemeStyle(appliedStyle.value))
const styleDefinition = computed(() => getThemeStyle(style.value))
const appearanceControls = computed(() => getAppearanceControls(style.value))