mirror of
https://github.com/HeyPuter/puter.git
synced 2026-10-12 14:50:39 +00:00
Use the dashboard danger color for the toolbar sign-out confirmation
The hardcoded red had 3:1 contrast on the dark panel, below WCAG AA for 14px text. The dashboard's danger token is 4.8:1 in light and 6:1 in dark.
This commit is contained in:
1 parent
62ce691ac9
commit
26f7e8eb2e
2 files changed
+12
-3
No files matched your search
@@ -202,8 +202,8 @@ describe('embedded app browser', () => {
|
||||
|
||||
|
||||
describe('embedded toolbar', () => {
|
||||
async function openToolbar (viewport = { width: 1100, height: 720 }, token = sessionToken, storage = []) {
|
||||
const context = await browser.newContext({ viewport, storageState: {
|
||||
async function openToolbar (viewport = { width: 1100, height: 720 }, token = sessionToken, storage = [], contextOptions = {}) {
|
||||
const context = await browser.newContext({ viewport, ...contextOptions, storageState: {
|
||||
cookies: [], origins: [{ origin, localStorage: [
|
||||
...storage,
|
||||
{ name: 'auth_token_v2', value: token },
|
||||
@@ -303,6 +303,15 @@ describe('embedded toolbar', () => {
|
||||
} finally { await context.close(); }
|
||||
});
|
||||
|
||||
it('keeps the sign-out confirmation readable in dark mode', async () => {
|
||||
const { context, toolbar } = await openToolbar(undefined, sessionToken, [], { colorScheme: 'dark' });
|
||||
try {
|
||||
await toolbar.getByRole('button', { name: 'Account', exact: true }).click();
|
||||
await toolbar.locator('.toolbar-logout').click();
|
||||
expect(await toolbar.locator('.toolbar-confirm-logout').evaluate(el => getComputedStyle(el).color)).toBe('rgb(248, 113, 113)');
|
||||
} finally { await context.close(); }
|
||||
});
|
||||
|
||||
it('labels controls with translated text encoded once', async () => {
|
||||
const { context, toolbar } = await openToolbar(undefined, sessionToken, [{ name: 'user_preferences', value: '{"language":"de"}' }]);
|
||||
try {
|
||||
|
||||
@@ -35,4 +35,4 @@ html, body {
|
||||
#puter-toolbar [hidden] { display: none; }
|
||||
.toolbar-confirm { border-top: 1px solid var(--dashboard-border); }
|
||||
.toolbar-confirm p { margin: 12px 16px; font-size: 14px; line-height: 1.5; }
|
||||
.toolbar-confirm-logout { color: #c03535; }
|
||||
.toolbar-confirm-logout { color: var(--dashboard-danger-text); }
|
||||
Reference in new issue
Block a user