mirror of
https://github.com/aljazceru/opencode.git
synced 2026-01-30 13:15:08 +01:00
wip(desktop): layout improvements
This commit is contained in:
@@ -40,14 +40,8 @@
|
||||
--container-6xl: 72rem;
|
||||
--container-7xl: 80rem;
|
||||
|
||||
--radius-xs: 0.125rem;
|
||||
--radius-sm: 0.25rem;
|
||||
--radius-md: 0.375rem;
|
||||
--radius-lg: 0.5rem;
|
||||
--radius-xl: 0.75rem;
|
||||
--radius-2xl: 1rem;
|
||||
--radius-3xl: 1.5rem;
|
||||
--radius-4xl: 2rem;
|
||||
|
||||
--shadow-xs:
|
||||
0 1px 2px -1px rgba(19, 16, 16, 0.04), 0 1px 2px 0 rgba(19, 16, 16, 0.06), 0 1px 3px 0 rgba(19, 16, 16, 0.08);
|
||||
@@ -65,19 +59,15 @@
|
||||
0 1px 2px 0 rgba(19, 16, 16, 0.08), 0 1px 3px 0 rgba(19, 16, 16, 0.12), 0 0 0 2px var(--background-weak, #f1f0f0),
|
||||
0 0 0 3px var(--border-selected, rgba(0, 74, 255, 0.99));
|
||||
|
||||
--text-mix-blend-mode: multiply;
|
||||
}
|
||||
|
||||
:root {
|
||||
/* OC-1-Light */
|
||||
--text-mix-blend-mode: multiply;
|
||||
|
||||
color-scheme: light;
|
||||
--text-mix-blend-mode: multiply;
|
||||
|
||||
/* OC-1-light */
|
||||
--background-base: #f8f7f7;
|
||||
--background-weak: var(--smoke-light-3);
|
||||
--background-strong: var(--smoke-light-1);
|
||||
--background-stronger: #fcfcfc;
|
||||
--surface-base: var(--smoke-light-3);
|
||||
--surface-base: var(--smoke-light-alpha-2);
|
||||
--base: var(--smoke-light-alpha-2);
|
||||
--surface-base-hover: #0500000f;
|
||||
--surface-base-active: var(--smoke-light-alpha-3);
|
||||
@@ -119,9 +109,9 @@
|
||||
--surface-info-base: var(--lilac-light-3);
|
||||
--surface-info-weak: var(--lilac-light-2);
|
||||
--surface-info-strong: var(--lilac-light-9);
|
||||
--surface-diff-unchanged-base: #ffffff00;
|
||||
--surface-diff-skip-base: var(--smoke-light-2);
|
||||
--surface-diff-hidden-base: var(--blue-light-3);
|
||||
--surface-diff-unchanged-base: #ffffff00;
|
||||
--surface-diff-hidden-weak: var(--blue-light-2);
|
||||
--surface-diff-hidden-weaker: var(--blue-light-1);
|
||||
--surface-diff-hidden-strong: var(--blue-light-5);
|
||||
@@ -170,7 +160,7 @@
|
||||
--text-on-brand-weaker: var(--smoke-light-alpha-8);
|
||||
--text-on-brand-strong: var(--smoke-light-alpha-12);
|
||||
--button-secondary-base: #fdfcfc;
|
||||
--button-secondary-hover: #fafafa;
|
||||
--button-secondary-hover: #faf9f9;
|
||||
--border-base: var(--smoke-light-alpha-7);
|
||||
--border-hover: var(--smoke-light-alpha-8);
|
||||
--border-active: var(--smoke-light-alpha-9);
|
||||
@@ -269,21 +259,21 @@
|
||||
--syntax-regexp: var(--text-base);
|
||||
--syntax-string: #007663;
|
||||
--syntax-keyword: var(--text-weak);
|
||||
--syntax-primitive: #f6916b;
|
||||
--syntax-primitive: #fb7f51;
|
||||
--syntax-operator: var(--text-weak);
|
||||
--syntax-variable: var(--text-strong);
|
||||
--syntax-property: #ed6dc8;
|
||||
--syntax-type: #b2cc00;
|
||||
--syntax-constant: #0092a8;
|
||||
--syntax-property: #ec6cc8;
|
||||
--syntax-type: #738400;
|
||||
--syntax-constant: #00b2b9;
|
||||
--syntax-punctuation: var(--text-weaker);
|
||||
--syntax-object: var(--text-strong);
|
||||
--syntax-success: var(--apple-dark-10);
|
||||
--syntax-warning: var(--amber-dark-10);
|
||||
--syntax-critical: var(--ember-dark-9);
|
||||
--syntax-info: #0092a8;
|
||||
--syntax-diff-add: var(--mint-light-alpha-8);
|
||||
--syntax-diff-delete: var(--ember-light-alpha-8);
|
||||
--syntax-unknown: var(--text-weak);
|
||||
--syntax-success: var(--apple-light-10);
|
||||
--syntax-warning: var(--amber-light-10);
|
||||
--syntax-critical: var(--ember-light-9);
|
||||
--syntax-info: #0091a7;
|
||||
--syntax-diff-add: var(--mint-light-11);
|
||||
--syntax-diff-delete: var(--ember-light-11);
|
||||
--syntax-diff-unknown: #ff0000;
|
||||
--markdown-heading: #d68c27;
|
||||
--markdown-text: #1a1a1a;
|
||||
--markdown-link: #3b7dd8;
|
||||
@@ -309,15 +299,15 @@
|
||||
--button-ghost-hover2: var(--smoke-light-alpha-3);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
color-scheme: dark;
|
||||
--text-mix-blend-mode: plus-lighter;
|
||||
|
||||
/* OC-1-Dark */
|
||||
color-scheme: dark;
|
||||
/* OC-1-dark */
|
||||
--background-base: var(--smoke-dark-1);
|
||||
--background-weak: #1b1818;
|
||||
--background-weak: #1c1717;
|
||||
--background-strong: #151313;
|
||||
--background-stronger: #191515;
|
||||
--surface-base: var(--smoke-dark-3);
|
||||
--surface-base: var(--smoke-dark-alpha-2);
|
||||
--base: var(--smoke-dark-alpha-2);
|
||||
--surface-base-hover: #e0b7b716;
|
||||
--surface-base-active: var(--smoke-dark-alpha-3);
|
||||
@@ -359,9 +349,9 @@
|
||||
--surface-info-base: var(--lilac-light-3);
|
||||
--surface-info-weak: var(--lilac-light-2);
|
||||
--surface-info-strong: var(--lilac-light-9);
|
||||
--surface-diff-unchanged-base: var(--smoke-dark-1);
|
||||
--surface-diff-skip-base: var(--smoke-dark-alpha-1);
|
||||
--surface-diff-hidden-base: var(--blue-dark-2);
|
||||
--surface-diff-unchanged-base: var(--smoke-dark-1);
|
||||
--surface-diff-hidden-weak: var(--blue-dark-1);
|
||||
--surface-diff-hidden-weaker: var(--blue-dark-3);
|
||||
--surface-diff-hidden-strong: var(--blue-dark-5);
|
||||
@@ -417,7 +407,7 @@
|
||||
--border-selected: var(--cobalt-dark-alpha-11);
|
||||
--border-disabled: var(--smoke-dark-alpha-8);
|
||||
--border-focus: var(--smoke-dark-alpha-9);
|
||||
--border-weak-base: var(--smoke-dark-alpha-4);
|
||||
--border-weak-base: var(--smoke-dark-alpha-6);
|
||||
--border-strong-base: var(--smoke-dark-alpha-8);
|
||||
--border-strong-hover: var(--smoke-dark-alpha-7);
|
||||
--border-strong-active: var(--smoke-dark-alpha-8);
|
||||
@@ -519,11 +509,11 @@
|
||||
--syntax-object: var(--text-strong);
|
||||
--syntax-success: var(--apple-dark-10);
|
||||
--syntax-warning: var(--amber-dark-10);
|
||||
--syntax-critical: var(--ember-dark-9);
|
||||
--syntax-info: #ff9ae2;
|
||||
--syntax-diff-add: var(--mint-dark-alpha-6);
|
||||
--syntax-diff-delete: var(--ember-dark-alpha-4);
|
||||
--syntax-unknown: var(--text-weak);
|
||||
--syntax-critical: var(--ember-dark-10);
|
||||
--syntax-info: #93e9f6;
|
||||
--syntax-diff-add: var(--mint-dark-11);
|
||||
--syntax-diff-delete: var(--ember-dark-11);
|
||||
--syntax-diff-unknown: #ff0000;
|
||||
--markdown-heading: #9d7cd8;
|
||||
--markdown-text: #eeeeee;
|
||||
--markdown-link: #fab283;
|
||||
@@ -549,3 +539,478 @@
|
||||
--button-ghost-hover2: var(--smoke-dark-alpha-3);
|
||||
}
|
||||
}
|
||||
|
||||
html[data-theme="oc-2-paper"] {
|
||||
/* OC-2-paper */
|
||||
--background-base: #f7f8f8;
|
||||
--background-weak: var(--ink-light-3);
|
||||
--background-strong: var(--ink-light-1);
|
||||
--background-stronger: #fcfcfc;
|
||||
--surface-base: var(--ink-light-alpha-2);
|
||||
--base: var(--ink-light-alpha-2);
|
||||
--surface-base-hover: #0005050f;
|
||||
--surface-base-active: var(--ink-light-alpha-3);
|
||||
--surface-base-interactive-active: var(--cobalt-light-alpha-3);
|
||||
--base2: var(--ink-light-alpha-2);
|
||||
--base3: var(--ink-light-alpha-2);
|
||||
--surface-inset-base: var(--ink-light-alpha-2);
|
||||
--surface-inset-base-hover: var(--ink-light-alpha-3);
|
||||
--surface-inset-strong: #001f1f17;
|
||||
--surface-inset-strong-hover: #001f1f17;
|
||||
--surface-raised-base: var(--ink-light-alpha-1);
|
||||
--surface-float-base: var(--ink-dark-1);
|
||||
--surface-float-base-hover: var(--ink-dark-2);
|
||||
--surface-raised-base-hover: var(--ink-light-alpha-2);
|
||||
--surface-raised-base-active: var(--ink-light-alpha-3);
|
||||
--surface-raised-strong: var(--ink-light-1);
|
||||
--surface-raised-strong-hover: var(--white);
|
||||
--surface-raised-stronger: var(--white);
|
||||
--surface-raised-stronger-hover: var(--white);
|
||||
--surface-weak: var(--ink-light-alpha-3);
|
||||
--surface-weaker: var(--ink-light-alpha-4);
|
||||
--surface-strong: #ffffff;
|
||||
--surface-raised-stronger-non-alpha: var(--white);
|
||||
--surface-brand-base: var(--yuzu-light-9);
|
||||
--surface-brand-hover: var(--yuzu-light-10);
|
||||
--surface-interactive-base: var(--cobalt-light-3);
|
||||
--surface-interactive-hover: var(--cobalt-light-4);
|
||||
--surface-interactive-weak: var(--cobalt-light-2);
|
||||
--surface-interactive-weak-hover: var(--cobalt-light-3);
|
||||
--surface-success-base: var(--apple-light-3);
|
||||
--surface-success-weak: var(--apple-light-2);
|
||||
--surface-success-strong: var(--apple-light-9);
|
||||
--surface-warning-base: var(--solaris-light-3);
|
||||
--surface-warning-weak: var(--solaris-light-2);
|
||||
--surface-warning-strong: var(--solaris-light-9);
|
||||
--surface-critical-base: var(--ember-light-3);
|
||||
--surface-critical-weak: var(--ember-light-2);
|
||||
--surface-critical-strong: var(--ember-light-9);
|
||||
--surface-info-base: var(--lilac-light-3);
|
||||
--surface-info-weak: var(--lilac-light-2);
|
||||
--surface-info-strong: var(--lilac-light-9);
|
||||
--surface-diff-unchanged-base: #ffffff00;
|
||||
--surface-diff-skip-base: var(--ink-light-2);
|
||||
--surface-diff-hidden-base: var(--blue-light-3);
|
||||
--surface-diff-hidden-weak: var(--blue-light-2);
|
||||
--surface-diff-hidden-weaker: var(--blue-light-1);
|
||||
--surface-diff-hidden-strong: var(--blue-light-5);
|
||||
--surface-diff-hidden-stronger: var(--blue-light-9);
|
||||
--surface-diff-add-base: var(--mint-light-3);
|
||||
--surface-diff-add-weak: var(--mint-light-2);
|
||||
--surface-diff-add-weaker: var(--mint-light-1);
|
||||
--surface-diff-add-strong: var(--mint-light-5);
|
||||
--surface-diff-add-stronger: var(--mint-light-9);
|
||||
--surface-diff-delete-base: var(--ember-light-3);
|
||||
--surface-diff-delete-weak: var(--ember-light-2);
|
||||
--surface-diff-delete-weaker: var(--ember-light-1);
|
||||
--surface-diff-delete-strong: var(--ember-light-6);
|
||||
--surface-diff-delete-stronger: var(--ember-light-9);
|
||||
--text-base: var(--ink-light-11);
|
||||
--input-base: var(--ink-light-1);
|
||||
--input-hover: var(--ink-light-2);
|
||||
--input-active: var(--cobalt-light-1);
|
||||
--input-selected: var(--cobalt-light-4);
|
||||
--input-focus: var(--cobalt-light-1);
|
||||
--input-disabled: var(--ink-light-4);
|
||||
--text-weak: var(--ink-light-9);
|
||||
--text-weaker: var(--ink-light-8);
|
||||
--text-strong: var(--ink-light-12);
|
||||
--text-interactive-base: var(--cobalt-light-9);
|
||||
--text-on-brand-base: var(--ink-light-alpha-11);
|
||||
--text-on-interactive-base: var(--ink-light-1);
|
||||
--text-on-interactive-weak: var(--ink-light-alpha-11);
|
||||
--text-on-success-base: var(--apple-light-10);
|
||||
--text-on-critical-base: var(--ember-light-10);
|
||||
--text-on-critical-weak: var(--ember-light-8);
|
||||
--text-on-critical-strong: var(--ember-light-12);
|
||||
--text-on-warning-base: var(--ink-dark-alpha-11);
|
||||
--text-on-info-base: var(--ink-dark-alpha-11);
|
||||
--text-diff-add-base: var(--mint-light-11);
|
||||
--text-diff-delete-base: var(--ember-light-10);
|
||||
--text-diff-delete-strong: var(--ember-light-12);
|
||||
--text-diff-add-strong: var(--mint-light-12);
|
||||
--text-on-info-weak: var(--ink-dark-alpha-9);
|
||||
--text-on-info-strong: var(--ink-dark-alpha-12);
|
||||
--text-on-warning-weak: var(--ink-dark-alpha-9);
|
||||
--text-on-warning-strong: var(--ink-dark-alpha-12);
|
||||
--text-on-success-weak: var(--apple-light-6);
|
||||
--text-on-success-strong: var(--apple-light-12);
|
||||
--text-on-brand-weak: var(--ink-light-alpha-9);
|
||||
--text-on-brand-weaker: var(--ink-light-alpha-8);
|
||||
--text-on-brand-strong: var(--ink-light-alpha-12);
|
||||
--button-secondary-base: #fcfdfd;
|
||||
--button-secondary-hover: #f9fafa;
|
||||
--border-base: var(--ink-light-alpha-7);
|
||||
--border-hover: var(--ink-light-alpha-8);
|
||||
--border-active: var(--ink-light-alpha-9);
|
||||
--border-selected: var(--cobalt-light-alpha-9);
|
||||
--border-disabled: var(--ink-light-alpha-8);
|
||||
--border-focus: var(--ink-light-alpha-9);
|
||||
--border-weak-base: var(--ink-light-alpha-5);
|
||||
--border-strong-base: var(--ink-light-alpha-7);
|
||||
--border-strong-hover: var(--ink-light-alpha-8);
|
||||
--border-strong-active: var(--ink-light-alpha-7);
|
||||
--border-strong-selected: var(--cobalt-light-alpha-6);
|
||||
--border-strong-disabled: var(--ink-light-alpha-6);
|
||||
--border-strong-focus: var(--ink-light-alpha-7);
|
||||
--border-weak-hover: var(--ink-light-alpha-6);
|
||||
--border-weak-active: var(--ink-light-alpha-7);
|
||||
--border-weak-selected: var(--cobalt-light-alpha-5);
|
||||
--border-weak-disabled: var(--ink-light-alpha-6);
|
||||
--border-weak-focus: var(--ink-light-alpha-7);
|
||||
--border-interactive-base: var(--cobalt-light-7);
|
||||
--border-interactive-hover: var(--cobalt-light-8);
|
||||
--border-interactive-active: var(--cobalt-light-9);
|
||||
--border-interactive-selected: var(--cobalt-light-9);
|
||||
--border-interactive-disabled: var(--ink-light-8);
|
||||
--border-interactive-focus: var(--cobalt-light-9);
|
||||
--border-success-base: var(--apple-light-6);
|
||||
--border-success-hover: var(--apple-light-7);
|
||||
--border-success-selected: var(--apple-light-9);
|
||||
--border-warning-base: var(--solaris-light-6);
|
||||
--border-warning-hover: var(--solaris-light-7);
|
||||
--border-warning-selected: var(--solaris-light-9);
|
||||
--border-critical-base: var(--ember-light-6);
|
||||
--border-critical-hover: var(--ember-light-7);
|
||||
--border-critical-selected: var(--ember-light-9);
|
||||
--border-info-base: var(--lilac-light-6);
|
||||
--border-info-hover: var(--lilac-light-7);
|
||||
--border-info-selected: var(--lilac-light-9);
|
||||
--icon-base: var(--ink-light-9);
|
||||
--icon-hover: var(--ink-light-11);
|
||||
--icon-active: var(--ink-light-12);
|
||||
--icon-selected: var(--ink-light-12);
|
||||
--icon-disabled: var(--ink-light-8);
|
||||
--icon-focus: var(--ink-light-12);
|
||||
--icon-invert-base: #ffffff;
|
||||
--icon-weak-base: var(--ink-light-7);
|
||||
--icon-weak-hover: var(--ink-light-8);
|
||||
--icon-weak-active: var(--ink-light-9);
|
||||
--icon-weak-selected: var(--ink-light-10);
|
||||
--icon-weak-disabled: var(--ink-light-6);
|
||||
--icon-weak-focus: var(--ink-light-9);
|
||||
--icon-strong-base: var(--ink-light-12);
|
||||
--icon-strong-hover: #131515;
|
||||
--icon-strong-active: #020202;
|
||||
--icon-strong-selected: #020202;
|
||||
--icon-strong-disabled: var(--ink-light-8);
|
||||
--icon-strong-focus: #020202;
|
||||
--icon-brand-base: var(--ink-light-12);
|
||||
--icon-interactive-base: var(--cobalt-light-9);
|
||||
--icon-success-base: var(--apple-light-7);
|
||||
--icon-success-hover: var(--apple-light-8);
|
||||
--icon-success-active: var(--apple-light-11);
|
||||
--icon-warning-base: var(--amber-light-7);
|
||||
--icon-warning-hover: var(--amber-light-8);
|
||||
--icon-warning-active: var(--amber-light-11);
|
||||
--icon-critical-base: var(--ember-light-10);
|
||||
--icon-critical-hover: var(--ember-light-11);
|
||||
--icon-critical-active: var(--ember-light-12);
|
||||
--icon-info-base: var(--lilac-light-7);
|
||||
--icon-info-hover: var(--lilac-light-8);
|
||||
--icon-info-active: var(--lilac-light-11);
|
||||
--icon-on-brand-base: var(--ink-light-alpha-11);
|
||||
--icon-on-brand-hover: var(--ink-light-alpha-12);
|
||||
--icon-on-brand-selected: var(--ink-light-alpha-12);
|
||||
--icon-on-interactive-base: var(--ink-light-1);
|
||||
--icon-agent-plan-base: var(--purple-light-9);
|
||||
--icon-agent-docs-base: var(--amber-light-9);
|
||||
--icon-agent-ask-base: var(--cyan-light-9);
|
||||
--icon-agent-build-base: var(--cobalt-light-9);
|
||||
--icon-on-success-base: var(--apple-light-alpha-9);
|
||||
--icon-on-success-hover: var(--apple-light-alpha-10);
|
||||
--icon-on-success-selected: var(--apple-light-alpha-11);
|
||||
--icon-on-warning-base: var(--amber-lightalpha-9);
|
||||
--icon-on-warning-hover: var(--amber-lightalpha-10);
|
||||
--icon-on-warning-selected: var(--amber-lightalpha-11);
|
||||
--icon-on-critical-base: var(--ember-light-alpha-9);
|
||||
--icon-on-critical-hover: var(--ember-light-alpha-10);
|
||||
--icon-on-critical-selected: var(--ember-light-alpha-11);
|
||||
--icon-on-info-base: var(--lilac-light-9);
|
||||
--icon-on-info-hover: var(--lilac-light-alpha-10);
|
||||
--icon-on-info-selected: var(--lilac-light-alpha-11);
|
||||
--icon-diff-add-base: var(--mint-light-11);
|
||||
--icon-diff-add-hover: var(--mint-light-12);
|
||||
--icon-diff-add-active: var(--mint-light-12);
|
||||
--icon-diff-delete-base: var(--ember-light-10);
|
||||
--icon-diff-delete-hover: var(--ember-light-11);
|
||||
--syntax-comment: var(--text-weaker);
|
||||
--syntax-regexp: var(--text-base);
|
||||
--syntax-string: #007663;
|
||||
--syntax-keyword: var(--text-weak);
|
||||
--syntax-primitive: #fb7f51;
|
||||
--syntax-operator: var(--text-weak);
|
||||
--syntax-variable: var(--text-strong);
|
||||
--syntax-property: #ec6cc8;
|
||||
--syntax-type: #738400;
|
||||
--syntax-constant: #00b2b9;
|
||||
--syntax-punctuation: var(--text-weaker);
|
||||
--syntax-object: var(--text-strong);
|
||||
--syntax-success: var(--apple-light-10);
|
||||
--syntax-warning: var(--amber-light-10);
|
||||
--syntax-critical: var(--ember-light-9);
|
||||
--syntax-info: #0091a7;
|
||||
--syntax-diff-add: var(--mint-light-11);
|
||||
--syntax-diff-delete: var(--ember-light-11);
|
||||
--syntax-diff-unknown: #ff0000;
|
||||
--markdown-heading: #d68c27;
|
||||
--markdown-text: #1a1a1a;
|
||||
--markdown-link: #3b7dd8;
|
||||
--markdown-link-text: #318795;
|
||||
--markdown-code: #3d9a57;
|
||||
--markdown-block-quote: #b0851f;
|
||||
--markdown-emph: #b0851f;
|
||||
--markdown-strong: #d68c27;
|
||||
--markdown-horizontal-rule: #8a8a8a;
|
||||
--markdown-list-item: #3b7dd8;
|
||||
--markdown-list-enumeration: #318795;
|
||||
--markdown-image: #3b7dd8;
|
||||
--markdown-image-text: #318795;
|
||||
--markdown-code-block: #1a1a1a;
|
||||
--border-color: #ffffff;
|
||||
--border-weaker-base: var(--ink-light-alpha-3);
|
||||
--border-weaker-hover: var(--ink-light-alpha-4);
|
||||
--border-weaker-active: var(--ink-light-alpha-6);
|
||||
--border-weaker-selected: var(--cobalt-light-alpha-4);
|
||||
--border-weaker-disabled: var(--ink-light-alpha-2);
|
||||
--border-weaker-focus: var(--ink-light-alpha-6);
|
||||
--button-ghost-hover: var(--ink-light-alpha-2);
|
||||
--button-ghost-hover2: var(--ink-light-alpha-3);
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
--background-base: var(--ink-dark-1);
|
||||
--background-weak: #171c1c;
|
||||
--background-strong: #131515;
|
||||
--background-stronger: #151919;
|
||||
--surface-base: var(--ink-dark-alpha-2);
|
||||
--base: var(--ink-dark-alpha-2);
|
||||
--surface-base-hover: #b8e0e00f;
|
||||
--surface-base-active: var(--ink-dark-alpha-3);
|
||||
--surface-base-interactive-active: var(--cobalt-light-alpha-3);
|
||||
--base2: var(--ink-dark-alpha-2);
|
||||
--base3: var(--ink-dark-alpha-2);
|
||||
--surface-inset-base: #0b0e0e7f;
|
||||
--surface-inset-base-hover: #0b0e0e7f;
|
||||
--surface-inset-strong: #050606cc;
|
||||
--surface-inset-strong-hover: #050606cc;
|
||||
--surface-raised-base: var(--ink-light-alpha-1);
|
||||
--surface-float-base: var(--ink-dark-1);
|
||||
--surface-float-base-hover: var(--ink-dark-2);
|
||||
--surface-raised-base-hover: var(--ink-light-alpha-2);
|
||||
--surface-raised-base-active: var(--ink-light-alpha-3);
|
||||
--surface-raised-strong: var(--ink-light-1);
|
||||
--surface-raised-strong-hover: var(--white);
|
||||
--surface-raised-stronger: var(--white);
|
||||
--surface-raised-stronger-hover: var(--white);
|
||||
--surface-weak: var(--ink-dark-alpha-4);
|
||||
--surface-weaker: var(--ink-dark-alpha-5);
|
||||
--surface-strong: var(--ink-dark-alpha-7);
|
||||
--surface-raised-stronger-non-alpha: var(--white);
|
||||
--surface-brand-base: var(--yuzu-light-9);
|
||||
--surface-brand-hover: var(--yuzu-light-10);
|
||||
--surface-interactive-base: var(--cobalt-light-3);
|
||||
--surface-interactive-hover: var(--cobalt-light-4);
|
||||
--surface-interactive-weak: var(--cobalt-light-2);
|
||||
--surface-interactive-weak-hover: var(--cobalt-light-3);
|
||||
--surface-success-base: var(--apple-light-3);
|
||||
--surface-success-weak: var(--apple-light-2);
|
||||
--surface-success-strong: var(--apple-light-9);
|
||||
--surface-warning-base: var(--solaris-light-3);
|
||||
--surface-warning-weak: var(--solaris-light-2);
|
||||
--surface-warning-strong: var(--solaris-light-9);
|
||||
--surface-critical-base: var(--ember-light-3);
|
||||
--surface-critical-weak: var(--ember-light-2);
|
||||
--surface-critical-strong: var(--ember-light-9);
|
||||
--surface-info-base: var(--lilac-light-3);
|
||||
--surface-info-weak: var(--lilac-light-2);
|
||||
--surface-info-strong: var(--lilac-light-9);
|
||||
--surface-diff-unchanged-base: #ffffff00;
|
||||
--surface-diff-skip-base: var(--ink-light-2);
|
||||
--surface-diff-hidden-base: var(--blue-light-3);
|
||||
--surface-diff-hidden-weak: var(--blue-light-2);
|
||||
--surface-diff-hidden-weaker: var(--blue-light-1);
|
||||
--surface-diff-hidden-strong: var(--blue-light-5);
|
||||
--surface-diff-hidden-stronger: var(--blue-light-9);
|
||||
--surface-diff-add-base: var(--mint-light-3);
|
||||
--surface-diff-add-weak: var(--mint-light-2);
|
||||
--surface-diff-add-weaker: var(--mint-light-1);
|
||||
--surface-diff-add-strong: var(--mint-light-5);
|
||||
--surface-diff-add-stronger: var(--mint-light-9);
|
||||
--surface-diff-delete-base: var(--ember-light-3);
|
||||
--surface-diff-delete-weak: var(--ember-light-2);
|
||||
--surface-diff-delete-weaker: var(--ember-light-1);
|
||||
--surface-diff-delete-strong: var(--ember-light-6);
|
||||
--surface-diff-delete-stronger: var(--ember-light-9);
|
||||
--text-base: var(--ink-light-11);
|
||||
--input-base: var(--ink-light-1);
|
||||
--input-hover: var(--ink-light-2);
|
||||
--input-active: var(--cobalt-light-1);
|
||||
--input-selected: var(--cobalt-light-4);
|
||||
--input-focus: var(--cobalt-light-1);
|
||||
--input-disabled: var(--ink-light-4);
|
||||
--text-weak: var(--ink-light-9);
|
||||
--text-weaker: var(--ink-light-8);
|
||||
--text-strong: var(--ink-light-12);
|
||||
--text-interactive-base: var(--cobalt-light-9);
|
||||
--text-on-brand-base: var(--ink-light-alpha-11);
|
||||
--text-on-interactive-base: var(--ink-light-1);
|
||||
--text-on-interactive-weak: var(--ink-light-alpha-11);
|
||||
--text-on-success-base: var(--apple-light-10);
|
||||
--text-on-critical-base: var(--ember-light-10);
|
||||
--text-on-critical-weak: var(--ember-light-8);
|
||||
--text-on-critical-strong: var(--ember-light-12);
|
||||
--text-on-warning-base: var(--ink-dark-alpha-11);
|
||||
--text-on-info-base: var(--ink-dark-alpha-11);
|
||||
--text-diff-add-base: var(--mint-light-11);
|
||||
--text-diff-delete-base: var(--ember-light-10);
|
||||
--text-diff-delete-strong: var(--ember-light-12);
|
||||
--text-diff-add-strong: var(--mint-light-12);
|
||||
--text-on-info-weak: var(--ink-dark-alpha-9);
|
||||
--text-on-info-strong: var(--ink-dark-alpha-12);
|
||||
--text-on-warning-weak: var(--ink-dark-alpha-9);
|
||||
--text-on-warning-strong: var(--ink-dark-alpha-12);
|
||||
--text-on-success-weak: var(--apple-light-6);
|
||||
--text-on-success-strong: var(--apple-light-12);
|
||||
--text-on-brand-weak: var(--ink-light-alpha-9);
|
||||
--text-on-brand-weaker: var(--ink-light-alpha-8);
|
||||
--text-on-brand-strong: var(--ink-light-alpha-12);
|
||||
--button-secondary-base: #fcfdfd;
|
||||
--button-secondary-hover: #f9fafa;
|
||||
--border-base: var(--ink-light-alpha-7);
|
||||
--border-hover: var(--ink-light-alpha-8);
|
||||
--border-active: var(--ink-light-alpha-9);
|
||||
--border-selected: var(--cobalt-light-alpha-9);
|
||||
--border-disabled: var(--ink-light-alpha-8);
|
||||
--border-focus: var(--ink-light-alpha-9);
|
||||
--border-weak-base: var(--ink-light-alpha-5);
|
||||
--border-strong-base: var(--ink-light-alpha-7);
|
||||
--border-strong-hover: var(--ink-light-alpha-8);
|
||||
--border-strong-active: var(--ink-light-alpha-7);
|
||||
--border-strong-selected: var(--cobalt-light-alpha-6);
|
||||
--border-strong-disabled: var(--ink-light-alpha-6);
|
||||
--border-strong-focus: var(--ink-light-alpha-7);
|
||||
--border-weak-hover: var(--ink-light-alpha-6);
|
||||
--border-weak-active: var(--ink-light-alpha-7);
|
||||
--border-weak-selected: var(--cobalt-light-alpha-5);
|
||||
--border-weak-disabled: var(--ink-light-alpha-6);
|
||||
--border-weak-focus: var(--ink-light-alpha-7);
|
||||
--border-interactive-base: var(--cobalt-light-7);
|
||||
--border-interactive-hover: var(--cobalt-light-8);
|
||||
--border-interactive-active: var(--cobalt-light-9);
|
||||
--border-interactive-selected: var(--cobalt-light-9);
|
||||
--border-interactive-disabled: var(--ink-light-8);
|
||||
--border-interactive-focus: var(--cobalt-light-9);
|
||||
--border-success-base: var(--apple-light-6);
|
||||
--border-success-hover: var(--apple-light-7);
|
||||
--border-success-selected: var(--apple-light-9);
|
||||
--border-warning-base: var(--solaris-light-6);
|
||||
--border-warning-hover: var(--solaris-light-7);
|
||||
--border-warning-selected: var(--solaris-light-9);
|
||||
--border-critical-base: var(--ember-light-6);
|
||||
--border-critical-hover: var(--ember-light-7);
|
||||
--border-critical-selected: var(--ember-light-9);
|
||||
--border-info-base: var(--lilac-light-6);
|
||||
--border-info-hover: var(--lilac-light-7);
|
||||
--border-info-selected: var(--lilac-light-9);
|
||||
--icon-base: var(--ink-light-9);
|
||||
--icon-hover: var(--ink-light-11);
|
||||
--icon-active: var(--ink-light-12);
|
||||
--icon-selected: var(--ink-light-12);
|
||||
--icon-disabled: var(--ink-light-8);
|
||||
--icon-focus: var(--ink-light-12);
|
||||
--icon-invert-base: #ffffff;
|
||||
--icon-weak-base: var(--ink-light-7);
|
||||
--icon-weak-hover: var(--ink-light-8);
|
||||
--icon-weak-active: var(--ink-light-9);
|
||||
--icon-weak-selected: var(--ink-light-10);
|
||||
--icon-weak-disabled: var(--ink-light-6);
|
||||
--icon-weak-focus: var(--ink-light-9);
|
||||
--icon-strong-base: var(--ink-light-12);
|
||||
--icon-strong-hover: #131515;
|
||||
--icon-strong-active: #020202;
|
||||
--icon-strong-selected: #020202;
|
||||
--icon-strong-disabled: var(--ink-light-8);
|
||||
--icon-strong-focus: #020202;
|
||||
--icon-brand-base: var(--ink-light-12);
|
||||
--icon-interactive-base: var(--cobalt-light-9);
|
||||
--icon-success-base: var(--apple-light-7);
|
||||
--icon-success-hover: var(--apple-light-8);
|
||||
--icon-success-active: var(--apple-light-11);
|
||||
--icon-warning-base: var(--amber-light-7);
|
||||
--icon-warning-hover: var(--amber-light-8);
|
||||
--icon-warning-active: var(--amber-light-11);
|
||||
--icon-critical-base: var(--ember-light-10);
|
||||
--icon-critical-hover: var(--ember-light-11);
|
||||
--icon-critical-active: var(--ember-light-12);
|
||||
--icon-info-base: var(--lilac-light-7);
|
||||
--icon-info-hover: var(--lilac-light-8);
|
||||
--icon-info-active: var(--lilac-light-11);
|
||||
--icon-on-brand-base: var(--ink-light-alpha-11);
|
||||
--icon-on-brand-hover: var(--ink-light-alpha-12);
|
||||
--icon-on-brand-selected: var(--ink-light-alpha-12);
|
||||
--icon-on-interactive-base: var(--ink-light-1);
|
||||
--icon-agent-plan-base: var(--purple-light-9);
|
||||
--icon-agent-docs-base: var(--amber-light-9);
|
||||
--icon-agent-ask-base: var(--cyan-light-9);
|
||||
--icon-agent-build-base: var(--cobalt-light-9);
|
||||
--icon-on-success-base: var(--apple-light-alpha-9);
|
||||
--icon-on-success-hover: var(--apple-light-alpha-10);
|
||||
--icon-on-success-selected: var(--apple-light-alpha-11);
|
||||
--icon-on-warning-base: var(--amber-lightalpha-9);
|
||||
--icon-on-warning-hover: var(--amber-lightalpha-10);
|
||||
--icon-on-warning-selected: var(--amber-lightalpha-11);
|
||||
--icon-on-critical-base: var(--ember-light-alpha-9);
|
||||
--icon-on-critical-hover: var(--ember-light-alpha-10);
|
||||
--icon-on-critical-selected: var(--ember-light-alpha-11);
|
||||
--icon-on-info-base: var(--lilac-light-9);
|
||||
--icon-on-info-hover: var(--lilac-light-alpha-10);
|
||||
--icon-on-info-selected: var(--lilac-light-alpha-11);
|
||||
--icon-diff-add-base: var(--mint-light-11);
|
||||
--icon-diff-add-hover: var(--mint-light-12);
|
||||
--icon-diff-add-active: var(--mint-light-12);
|
||||
--icon-diff-delete-base: var(--ember-light-10);
|
||||
--icon-diff-delete-hover: var(--ember-light-11);
|
||||
--syntax-comment: var(--text-weaker);
|
||||
--syntax-regexp: var(--text-base);
|
||||
--syntax-string: #007663;
|
||||
--syntax-keyword: var(--text-weak);
|
||||
--syntax-primitive: #fb7f51;
|
||||
--syntax-operator: var(--text-weak);
|
||||
--syntax-variable: var(--text-strong);
|
||||
--syntax-property: #ec6cc8;
|
||||
--syntax-type: #738400;
|
||||
--syntax-constant: #00b2b9;
|
||||
--syntax-punctuation: var(--text-weaker);
|
||||
--syntax-object: var(--text-strong);
|
||||
--syntax-success: var(--apple-light-10);
|
||||
--syntax-warning: var(--amber-light-10);
|
||||
--syntax-critical: var(--ember-light-9);
|
||||
--syntax-info: #0091a7;
|
||||
--syntax-diff-add: var(--mint-light-11);
|
||||
--syntax-diff-delete: var(--ember-light-11);
|
||||
--syntax-diff-unknown: #ff0000;
|
||||
--markdown-heading: #d68c27;
|
||||
--markdown-text: #1a1a1a;
|
||||
--markdown-link: #3b7dd8;
|
||||
--markdown-link-text: #318795;
|
||||
--markdown-code: #3d9a57;
|
||||
--markdown-block-quote: #b0851f;
|
||||
--markdown-emph: #b0851f;
|
||||
--markdown-strong: #d68c27;
|
||||
--markdown-horizontal-rule: #8a8a8a;
|
||||
--markdown-list-item: #3b7dd8;
|
||||
--markdown-list-enumeration: #318795;
|
||||
--markdown-image: #3b7dd8;
|
||||
--markdown-image-text: #318795;
|
||||
--markdown-code-block: #1a1a1a;
|
||||
--border-color: #ffffff;
|
||||
--border-weaker-base: var(--ink-light-alpha-3);
|
||||
--border-weaker-hover: var(--ink-light-alpha-4);
|
||||
--border-weaker-active: var(--ink-light-alpha-6);
|
||||
--border-weaker-selected: var(--cobalt-light-alpha-4);
|
||||
--border-weaker-disabled: var(--ink-light-alpha-2);
|
||||
--border-weaker-focus: var(--ink-light-alpha-6);
|
||||
--button-ghost-hover: var(--ink-light-alpha-2);
|
||||
--button-ghost-hover2: var(--ink-light-alpha-3);
|
||||
}
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user