opensource/cloudbeaver
3
0
Fork 0
mirror of https://github.com/dbeaver/cloudbeaver.git synced 2026-09-24 16:04:36 +08:00
Code Issues Packages Projects Releases Wiki Activity

dbeaver/pro#5968 refactor: update dark theme styles (#3639)

Browse Source 
* dbeaver/pro#5968 refactor: update dark theme styles

introduces new theme variable link-color which with a color which is used for coloring anchor elements in our app
adjust this color in dark theme to have better contrast with a background, use this color in secondary button for the same reasons

* dbeaver/pro#5968 fix: adjust dark theme color values for improved contrast

* dbeaver/pro#5968 fix: update negative color in dark theme

* dbeaver/pro#5968 fix: update negative color in dark theme

---------

Co-authored-by: Evgenia <139753579+EvgeniaBzzz@users.noreply.github.com>
This commit is contained in:
Sychev Andrey
2025-08-11 18:03:31 +08:00
committed by GitHub
co-authored by Evgenia
parent 7e0ad33fa4
commit 7acbbfe4ec
3 changed files with 11 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webapp/packages/core-blocks/src/Button.css
+4 -4
View File
@@ -24,10 +24,10 @@
--dbv-kit-btn-secondary-background: transparent;
--dbv-kit-btn-secondary-background-hover: color-mix(in srgb, transparent, var(--theme-primary) 5%);
--dbv-kit-btn-secondary-background-active: color-mix(in srgb, transparent, var(--theme-primary) 20%);
--dbv-kit-btn-secondary-foreground: var(--theme-primary);
--dbv-kit-btn-secondary-foreground-hover: var(--theme-primary);
--dbv-kit-btn-secondary-foreground-active: var(--theme-primary);
--dbv-kit-btn-secondary-border-color: var(--theme-primary);
--dbv-kit-btn-secondary-foreground: var(--theme-link-color);
--dbv-kit-btn-secondary-foreground-hover: var(--theme-link-color);
--dbv-kit-btn-secondary-foreground-active: var(--theme-link-color);
--dbv-kit-btn-secondary-border-color: var(--theme-link-color);
--dbv-kit-btn-danger-background: var(--theme-negative);
--dbv-kit-btn-danger-background-hover: color-mix(in srgb, var(--theme-negative), white 10%);
webapp/packages/core-theming/src/styles/_theme-dark.scss
+6 -6
View File
@@ -8,24 +8,24 @@
$mdc-theme-primary: #2a7cb4;
$mdc-theme-on-primary: #ffffff;
$mdc-theme-secondary: hsl(240deg, 10%, 15%);
$mdc-theme-secondary: hsl(240deg, 10%, 13%);
$mdc-theme-on-secondary: #cbcbcb;
$mdc-theme-sub-secondary: hsl(240deg, 10%, 20%);
$mdc-theme-sub-secondary: hsl(240deg, 10%, 18%);
$mdc-theme-on-sub-secondary: #cbcbcb;
$mdc-theme-surface: hsl(240deg, 10%, 18%);
$mdc-theme-surface: hsl(240deg, 10%, 16%);
$mdc-theme-on-surface: #ffffff;
$mdc-theme-background: hsl(240deg, 10%, 26%);
$mdc-theme-background: hsl(240deg, 10%, 25%);
$mdc-theme-error: #e94948;
$color-scheme: dark;
$color-positive: #52c41a;
$color-on-positive: #fff;
$color-negative: #e73e52;
$color-negative: hsl(0, 95%, 65%);
$color-status: #a08600;
$link-color: $mdc-theme-primary;
$link-color: lighten($mdc-theme-primary, 10%);
$link-color-focus: #3f96d1;
$input-color: $mdc-theme-on-secondary;
webapp/packages/core-theming/src/styles/_variables.scss
+1
View File
@@ -13,6 +13,7 @@ $mdc-theme-extra-property-values: (
on-positive: $color-on-positive,
negative: $color-negative,
status: $color-status,
link-color: $link-color,
input-color: $input-color,
input-color-disabled: $input-color-disabled,
input-color-readonly: $input-color-readonly,