update button colors

This commit is contained in:
Mutasem 2021-10-18 16:00:38 +02:00
parent 571140deee
commit 3d6a47bc8d
4 changed files with 13 additions and 3 deletions

View file

@ -109,7 +109,7 @@ import ColorCircles from './ColorCircles.vue';
<Canvas> <Canvas>
<Story name="foreground"> <Story name="foreground">
{{ {{
template: `<color-circles :colors="['--color-foreground-dark', '--color-foreground-base', '--color-foreground-light', '--color-foreground-xlight']" />`, template: `<color-circles :colors="['--color-foreground-xdark', '--color-foreground-dark', '--color-foreground-base', '--color-foreground-light', '--color-foreground-xlight']" />`,
components: { components: {
ColorCircles, ColorCircles,
}, },

View file

@ -187,6 +187,15 @@
var(--color-text-xlight-l) var(--color-text-xlight-l)
); );
--color-foreground-xdark-h: 220;
--color-foreground-xdark-s: 7.4%;
--color-foreground-xdark-l: 52.5%;
--color-foreground-xdark: hsl(
var(--color-foreground-xdark-h),
var(--color-foreground-xdark-s),
var(--color-foreground-xdark-l)
);
--color-foreground-dark-h: 228; --color-foreground-dark-h: 228;
--color-foreground-dark-s: 9.6%; --color-foreground-dark-s: 9.6%;
--color-foreground-dark-l: 79.6%; --color-foreground-dark-l: 79.6%;

View file

@ -80,7 +80,7 @@ export default mixins(externalHooks, nodeBase, nodeHelpers, workflowHelpers).ext
nodeRunData(): ITaskData[] { nodeRunData(): ITaskData[] {
return this.$store.getters.getWorkflowResultDataByNodeName(this.data.name); return this.$store.getters.getWorkflowResultDataByNodeName(this.data.name);
}, },
workflowDataItems (): Number { workflowDataItems (): number {
const workflowResultDataNode = this.nodeRunData; const workflowResultDataNode = this.nodeRunData;
if (workflowResultDataNode === null) { if (workflowResultDataNode === null) {
return 0; return 0;

View file

@ -2605,7 +2605,8 @@ export default mixins(
} }
> div { > div {
border: 2px solid var(--color-text-base); color: var(--color-foreground-xdark);
border: 2px solid var(--color-foreground-xdark);
background-color: var(--color-background-xlight); background-color: var(--color-background-xlight);
border-radius: var(--border-radius-base); border-radius: var(--border-radius-base);
height: var(--spacing-l); height: var(--spacing-l);