diff --git a/web/src/routes/settings/storage.test.tsx b/web/src/routes/settings/storage.test.tsx
new file mode 100644
index 00000000..a1c0e2e8
--- /dev/null
+++ b/web/src/routes/settings/storage.test.tsx
@@ -0,0 +1,35 @@
+import { render, screen } from '@testing-library/react'
+import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
+import { describe, expect, it, vi } from 'vitest'
+import { I18nProvider } from '@/lib/i18n-context'
+import SettingsStoragePage from './storage'
+
+const getSqliteStorageUsage = vi.fn().mockResolvedValue({
+ path: 'C:\\hapi\\hapi.db',
+ databaseBytes: 1,
+ walBytes: 2,
+ shmBytes: 3,
+ totalBytes: 6,
+})
+
+vi.mock('@/lib/app-context', () => ({
+ useAppContext: () => ({ api: { getSqliteStorageUsage } }),
+}))
+
+describe('SettingsStoragePage', () => {
+ it('uses paired button theme colors for the refresh action', () => {
+ const queryClient = new QueryClient({ defaultOptions: { queries: { retry: false } } })
+ render(
+
+
+
+
+ ,
+ )
+
+ const refreshButton = screen.getByRole('button')
+ expect(refreshButton).toHaveClass('bg-[var(--app-button)]')
+ expect(refreshButton).toHaveClass('text-[var(--app-button-text)]')
+ expect(refreshButton).not.toHaveClass('text-white')
+ })
+})
diff --git a/web/src/routes/settings/storage.tsx b/web/src/routes/settings/storage.tsx
index cc8f8174..dd715e32 100644
--- a/web/src/routes/settings/storage.tsx
+++ b/web/src/routes/settings/storage.tsx
@@ -44,7 +44,7 @@ export default function SettingsStoragePage() {
type="button"
onClick={() => void query.refetch()}
disabled={query.isFetching}
- className="rounded-lg bg-[var(--app-link)] px-3 py-2 text-sm font-medium text-white disabled:opacity-50"
+ className="rounded-lg bg-[var(--app-button)] px-3 py-2 text-sm font-medium text-[var(--app-button-text)] disabled:opacity-50"
>
{query.isFetching ? t('settings.storage.refreshing') : t('settings.storage.refresh')}
diff --git a/web/src/routes/share/index.test.tsx b/web/src/routes/share/index.test.tsx
new file mode 100644
index 00000000..d2692195
--- /dev/null
+++ b/web/src/routes/share/index.test.tsx
@@ -0,0 +1,31 @@
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it, vi } from 'vitest'
+import SharePage from './index'
+
+vi.mock('@tanstack/react-router', () => ({
+ useNavigate: () => vi.fn(),
+ useSearch: () => ({}),
+}))
+
+vi.mock('@/lib/app-context', () => ({
+ useAppContext: () => ({ api: {} }),
+}))
+
+vi.mock('@/hooks/queries/useSessions', () => ({
+ useSessions: () => ({ sessions: [], isLoading: false }),
+}))
+
+vi.mock('@/lib/use-translation', () => ({
+ useTranslation: () => ({ t: (key: string) => key }),
+}))
+
+describe('SharePage', () => {
+ it('uses paired button theme colors for the missing-share action', async () => {
+ render()
+
+ const backButton = await screen.findByRole('button', { name: 'share.backToSessions' })
+ expect(backButton).toHaveClass('bg-[var(--app-button)]')
+ expect(backButton).toHaveClass('text-[var(--app-button-text)]')
+ expect(backButton).not.toHaveClass('text-white')
+ })
+})
diff --git a/web/src/routes/share/index.tsx b/web/src/routes/share/index.tsx
index 741ac082..637c7a90 100644
--- a/web/src/routes/share/index.tsx
+++ b/web/src/routes/share/index.tsx
@@ -203,7 +203,7 @@ export default function SharePage() {