mudhorn/n8n
1
0
Fork 0
mirror of https://github.com/n8n-io/n8n.git synced 2024-12-24 20:24:05 -08:00
Code Issues Actions 1 Packages Projects Releases Wiki Activity

fix(editor): Fix more dark mode issues (no-changelog) (#7578)

Browse source 
Github issue / Community forum post (link here to close automatically):

---------

Co-authored-by: कारतोफ्फेलस्क्रिप्ट™ <aditya@netroy.in>
Co-authored-by: Giulio Andreini <andreini@netseven.it>
This commit is contained in:
Jan Oberhauser 2023-11-02 10:57:08 +01:00 committed by GitHub
parent 721a36637c
commit be49778388
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 18 additions and 8 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

11
packages/design-system/src/css/_primitives.scss
View file

@ -30,6 +30,11 @@
--prim-color-primary-s: 100%;
--prim-color-primary-l: 68%;
--prim-color-primary-shade-300: hsl(
var(--prim-color-primary-h),
calc(var(--prim-color-primary-s) - 60%),
calc(var(--prim-color-primary-l) - 30%)
);
--prim-color-primary-shade-100: hsl(
var(--prim-color-primary-h),
calc(var(--prim-color-primary-s) - 15%),
@ -40,12 +45,6 @@
var(--prim-color-primary-s),
var(--prim-color-primary-l)
);
--prim-color-primary-alpha-04: hsla(
var(--prim-color-primary-h),
var(--prim-color-primary-s),
var(--prim-color-primary-l),
0.4
);
--prim-color-primary-tint-100: hsl(
var(--prim-color-primary-h),
var(--prim-color-primary-s),

11
packages/design-system/src/css/_tokens.dark.scss
View file

@ -37,7 +37,7 @@
--node-type-main-color: var(--prim-gray-420);
// Sticky
--color-sticky-code-background: var(--color-background-light);
--color-sticky-code-background: var(--prim-gray-40);
// Expressions
--color-valid-resolvable-foreground: var(--prim-color-alt-a-tint-300);
@ -81,7 +81,7 @@
// Button primary
--color-button-primary-disabled-font: var(--prim-gray-0-alpha-025);
--color-button-primary-disabled-border: transparent;
--color-button-primary-disabled-background: var(--prim-color-primary-alpha-04);
--color-button-primary-disabled-background: var(--prim-color-primary-shade-300);
// Button secondary
--color-button-secondary-border: var(--prim-gray-420);
@ -141,6 +141,13 @@
--border-color-light: var(--color-foreground-light);
--border-base: var(--border-width-base) var(--border-style-base) var(--color-foreground-base);
// Various
--color-info-tint-1: var(--prim-gray-420);
--color-info-tint-2: var(--prim-gray-740);
--node-type-supplemental-label-color-l: 100%;
--color-configurable-node-name: var(--color-text-lighter);
}
body[data-theme='dark'] {

1
packages/design-system/src/css/_tokens.scss
View file

@ -229,6 +229,7 @@
--color-light-grey: var(--prim-gray-120);
--color-neutral: var(--prim-gray-490);
--color-switch: var(--prim-color-alt-i);
--color-configurable-node-name: var(--color-text-dark);
// Generated Color Shades from 50 to 950
// Not yet used in design system

3
packages/editor-ui/src/components/Node.vue
View file

@ -1004,6 +1004,9 @@ export default defineComponent({
--configurable-node-icon-size
) - 2 * var(--spacing-s)
);
.node-name > p {
color: var(--color-configurable-node-name);
}
}
.node-default {