dark theme adjustments

This commit is contained in:
lindsaym-fa
2024-01-08 23:19:14 -05:00
parent 9987ce8d4f
commit f2bb9fefee
8 changed files with 43 additions and 53 deletions

View File

@@ -5,7 +5,7 @@ export default css`
${componentStyles}
:host {
--background: var(--wa-color-surface-raised);
--background: var(--wa-color-surface-default);
--border-color: var(--wa-color-surface-border);
--border-radius: var(--wa-panel-corners);
--border-style: var(--wa-panel-border-style);

View File

@@ -32,7 +32,7 @@ export default css`
width: var(--width);
max-width: calc(100% - var(--wa-space-2xl));
max-height: calc(100% - var(--wa-space-2xl));
background-color: var(--wa-color-surface-raised);
background-color: var(--wa-color-surface-default);
border-radius: var(--wa-panel-corners);
box-shadow: var(--wa-shadow-level-3);
}

View File

@@ -336,7 +336,7 @@
--wa-color-surface-raised: var(--wa-color-base-10);
--wa-color-surface-default: var(--wa-color-base-05);
--wa-color-surface-lowered: black;
--wa-color-surface-border: var(--wa-color-base-20);
--wa-color-surface-border: var(--wa-color-base-10);
--wa-color-text-normal: var(--wa-color-base-95);
--wa-color-text-quiet: var(--wa-color-base-60);

View File

@@ -333,7 +333,7 @@
--wa-color-surface-raised: var(--wa-color-base-10);
--wa-color-surface-default: var(--wa-color-base-05);
--wa-color-surface-lowered: black;
--wa-color-surface-border: var(--wa-color-base-20);
--wa-color-surface-border: var(--wa-color-base-10);
--wa-color-text-normal: var(--wa-color-base-95);
--wa-color-text-quiet: var(--wa-color-base-60);
@@ -354,64 +354,54 @@
/**
* Semantic theme colors
*/
--wa-color-brand-fill-accent: var(--wa-color-blue-50);
--wa-color-brand-fill-accent: var(--wa-color-blue-30);
--wa-color-brand-surface: var(--wa-color-blue-10);
--wa-color-brand-fill-subtle: var(--wa-color-blue-20);
--wa-color-brand-border-accent: var(--wa-color-blue-50);
--wa-color-brand-border-accent: var(--wa-color-blue-40);
--wa-color-brand-spot: var(--wa-color-blue-50);
--wa-color-brand-spot-darker: var(--wa-color-blue-40);
--wa-color-brand-fill-subtle: var(--wa-color-blue-10);
--wa-color-brand-fill-highlight: var(--wa-color-blue-20);
--wa-color-brand-border-subtle: var(--wa-color-blue-20);
--wa-color-brand-border-subtle: var(--wa-color-blue-30);
--wa-color-brand-text-on-accent: white;
--wa-color-brand-text-on-subtle: var(--wa-color-blue-70);
--wa-color-brand-border-highlight: var(--wa-color-blue-30);
--wa-color-brand-text-on-spot: white;
--wa-color-brand-text-on-fill: var(--wa-color-blue-70);
--wa-color-brand-text-on-surface: var(--wa-color-blue-60);
--wa-color-success-fill-accent: var(--wa-color-green-50);
--wa-color-success-fill-accent: var(--wa-color-green-30);
--wa-color-success-surface: var(--wa-color-green-10);
--wa-color-success-fill-subtle: var(--wa-color-green-20);
--wa-color-success-border-accent: var(--wa-color-green-50);
--wa-color-success-border-accent: var(--wa-color-green-40);
--wa-color-success-spot: var(--wa-color-green-50);
--wa-color-success-spot-darker: var(--wa-color-green-40);
--wa-color-success-fill-subtle: var(--wa-color-green-10);
--wa-color-success-fill-highlight: var(--wa-color-green-20);
--wa-color-success-border-subtle: var(--wa-color-green-20);
--wa-color-success-border-subtle: var(--wa-color-green-30);
--wa-color-success-text-on-accent: white;
--wa-color-success-text-on-subtle: var(--wa-color-green-70);
--wa-color-success-border-highlight: var(--wa-color-green-30);
--wa-color-success-text-on-spot: white;
--wa-color-success-text-on-fill: var(--wa-color-green-70);
--wa-color-success-text-on-surface: var(--wa-color-green-60);
--wa-color-warning-fill-accent: var(--wa-color-yellow-50);
--wa-color-warning-fill-accent: var(--wa-color-yellow-30);
--wa-color-warning-surface: var(--wa-color-yellow-10);
--wa-color-warning-fill-subtle: var(--wa-color-yellow-20);
--wa-color-warning-border-accent: var(--wa-color-yellow-50);
--wa-color-warning-border-accent: var(--wa-color-yellow-40);
--wa-color-warning-spot: var(--wa-color-yellow-50);
--wa-color-warning-spot-darker: var(--wa-color-yellow-40);
--wa-color-warning-fill-subtle: var(--wa-color-yellow-10);
--wa-color-warning-fill-highlight: var(--wa-color-yellow-20);
--wa-color-warning-border-subtle: var(--wa-color-yellow-20);
--wa-color-warning-border-subtle: var(--wa-color-yellow-30);
--wa-color-warning-text-on-accent: white;
--wa-color-warning-text-on-subtle: var(--wa-color-yellow-70);
--wa-color-warning-border-highlight: var(--wa-color-yellow-30);
--wa-color-warning-text-on-spot: white;
--wa-color-warning-text-on-fill: var(--wa-color-yellow-70);
--wa-color-warning-text-on-surface: var(--wa-color-yellow-60);
--wa-color-danger-fill-accent: var(--wa-color-red-50);
--wa-color-danger-fill-accent: var(--wa-color-red-30);
--wa-color-danger-surface: var(--wa-color-red-10);
--wa-color-danger-fill-subtle: var(--wa-color-red-20);
--wa-color-danger-border-accent: var(--wa-color-red-50);
--wa-color-danger-border-accent: var(--wa-color-red-40);
--wa-color-danger-spot: var(--wa-color-red-50);
--wa-color-danger-spot-darker: var(--wa-color-red-40);
--wa-color-danger-fill-subtle: var(--wa-color-red-10);
--wa-color-danger-fill-highlight: var(--wa-color-red-20);
--wa-color-danger-border-subtle: var(--wa-color-red-20);
--wa-color-danger-border-subtle: var(--wa-color-red-30);
--wa-color-danger-text-on-accent: white;
--wa-color-danger-text-on-subtle: var(--wa-color-red-70);
--wa-color-danger-border-highlight: var(--wa-color-red-30);
--wa-color-danger-text-on-spot: white;
--wa-color-danger-text-on-fill: var(--wa-color-red-70);
--wa-color-danger-text-on-surface: var(--wa-color-red-60);
--wa-color-neutral-fill-accent: var(--wa-color-base-50);
--wa-color-neutral-fill-accent: var(--wa-color-base-30);
--wa-color-neutral-surface: var(--wa-color-base-10);
--wa-color-neutral-fill-subtle: var(--wa-color-base-20);
--wa-color-neutral-border-accent: var(--wa-color-base-50);
--wa-color-neutral-border-accent: var(--wa-color-base-40);
--wa-color-neutral-spot: var(--wa-color-base-50);
--wa-color-neutral-spot-darker: var(--wa-color-base-40);
--wa-color-neutral-fill-subtle: var(--wa-color-base-10);
--wa-color-neutral-fill-highlight: var(--wa-color-base-20);
--wa-color-neutral-border-subtle: var(--wa-color-base-20);
--wa-color-neutral-border-subtle: var(--wa-color-base-30);
--wa-color-neutral-text-on-accent: white;
--wa-color-neutral-text-on-subtle: var(--wa-color-base-70);
--wa-color-neutral-border-highlight: var(--wa-color-base-30);
--wa-color-neutral-text-on-spot: white;
--wa-color-neutral-text-on-fill: var(--wa-color-base-70);
--wa-color-neutral-text-on-surface: var(--wa-color-base-60);
}

View File

@@ -336,7 +336,7 @@
--wa-color-surface-raised: var(--wa-color-base-10);
--wa-color-surface-default: var(--wa-color-base-05);
--wa-color-surface-lowered: black;
--wa-color-surface-border: var(--wa-color-base-20);
--wa-color-surface-border: var(--wa-color-base-10);
--wa-color-text-normal: var(--wa-color-base-95);
--wa-color-text-quiet: var(--wa-color-base-60);

View File

@@ -336,7 +336,7 @@
--wa-color-surface-raised: var(--wa-color-base-10);
--wa-color-surface-default: var(--wa-color-base-05);
--wa-color-surface-lowered: black;
--wa-color-surface-border: var(--wa-color-base-20);
--wa-color-surface-border: var(--wa-color-base-10);
--wa-color-text-normal: var(--wa-color-base-95);
--wa-color-text-quiet: var(--wa-color-base-60);

View File

@@ -336,7 +336,7 @@
--wa-color-surface-raised: var(--wa-color-base-10);
--wa-color-surface-default: var(--wa-color-base-05);
--wa-color-surface-lowered: black;
--wa-color-surface-border: var(--wa-color-base-20);
--wa-color-surface-border: var(--wa-color-base-10);
--wa-color-text-normal: var(--wa-color-base-80);
--wa-color-text-quiet: var(--wa-color-base-60);

View File

@@ -336,7 +336,7 @@
--wa-color-surface-raised: var(--wa-color-base-10);
--wa-color-surface-default: var(--wa-color-base-05);
--wa-color-surface-lowered: black;
--wa-color-surface-border: var(--wa-color-base-20);
--wa-color-surface-border: var(--wa-color-base-10);
--wa-color-text-normal: var(--wa-color-base-95);
--wa-color-text-quiet: var(--wa-color-base-60);