diff --git a/apps/desktop/src/main/window.main.ts b/apps/desktop/src/main/window.main.ts index 6faac0c684c..4ea28c74c5f 100644 --- a/apps/desktop/src/main/window.main.ts +++ b/apps/desktop/src/main/window.main.ts @@ -236,7 +236,7 @@ export class WindowMain { case "light": return "#ededed"; case "dark": - return "#222222"; + return "#15181e"; case "nord": return "#3b4252"; } diff --git a/apps/desktop/src/scss/plugins.scss b/apps/desktop/src/scss/plugins.scss index 1bb171bb804..aed093d53be 100644 --- a/apps/desktop/src/scss/plugins.scss +++ b/apps/desktop/src/scss/plugins.scss @@ -5,11 +5,17 @@ .toast-container { .toast-close-button { + @include themify($themes) { + color: themed("toastTextColor"); + } font-size: 18px; margin-right: 4px; } .ngx-toastr { + @include themify($themes) { + color: themed("toastTextColor"); + } align-items: center; background-image: none !important; border-radius: $border-radius; diff --git a/apps/desktop/src/scss/variables.scss b/apps/desktop/src/scss/variables.scss index 439eff2f2f0..b99881134d5 100644 --- a/apps/desktop/src/scss/variables.scss +++ b/apps/desktop/src/scss/variables.scss @@ -66,7 +66,6 @@ $themes: ( listItemBackgroundColor: $background-color, listItemBackgroundHoverColor: $list-item-hover, listItemBorderColor: $border-color, - groupingsActiveColor: darken($background-color-alt, 5%), disabledIconColor: $list-icon-color, headingColor: $gray-light, headingButtonColor: lighten($gray-light, 30%), @@ -96,6 +95,7 @@ $themes: ( passwordCountText: #212529, calloutBorderColor: $border-color-dark, calloutBackgroundColor: $background-color, + toastTextColor: #ffffff, accountSwitcherBackgroundColor: $background-color, accountSwitcherTextColor: #ffffff, svgSuffix: "-light.svg", @@ -104,60 +104,60 @@ $themes: ( ), dark: ( textColor: #ffffff, - borderColor: #2f2f2f, - backgroundColor: #363636, + borderColor: #15181e, + backgroundColor: #1f242e, borderColorAlt: #6e788a, - backgroundColorAlt: #3d3d3d, + backgroundColorAlt: #2f343d, // Ensure the `window.main.ts` is updated with this value - backgroundColorAlt2: #222222, - scrollbarColor: #4d4d4d, - scrollbarHoverColor: #5f5f5f, - boxBackgroundColor: #363636, - boxBackgroundHoverColor: #3f3f3f, - boxBorderColor: #2f2f2f, - headerBackgroundColor: #363636, - headerBorderColor: #272727, - headerInputBackgroundColor: #222222, - headerInputBackgroundFocusColor: #1d1d1d, + backgroundColorAlt2: #15181e, + scrollbarColor: #6e788a, + scrollbarHoverColor: #8d94a5, + boxBackgroundColor: #2f343d, + boxBackgroundHoverColor: #3c424e, + boxBorderColor: #4c525f, + headerBackgroundColor: #2f343d, + headerBorderColor: #15181e, + headerInputBackgroundColor: #3c424e, + headerInputBackgroundFocusColor: #4c525f, headerInputColor: #ffffff, - headerInputPlaceholderColor: #707070, - listItemBackgroundColor: #363636, - listItemBackgroundHoverColor: #3c3c3c, - listItemBorderColor: #2f2f2f, - groupingsActiveColor: #292929, - disabledIconColor: #c7c7cd, - headingColor: #a3a3a3, - headingButtonColor: #a3a3a3, + headerInputPlaceholderColor: #bac0ce, + listItemBackgroundColor: #1f242e, + listItemBackgroundHoverColor: #2f343d, + listItemBorderColor: #4c525f, + disabledIconColor: #6e7689, + headingColor: #bac0ce, + headingButtonColor: #bac0ce, headingButtonHoverColor: #ffffff, - labelColor: #a3a3a3, - mutedColor: #a3a3a3, - totpStrokeColor: #cacaca, - boxRowButtonColor: #cacaca, + labelColor: #bac0ce, + mutedColor: #bac0ce, + totpStrokeColor: #4c525f, + boxRowButtonColor: #bac0ce, boxRowButtonHoverColor: #ffffff, - inputBorderColor: #222222, - inputBackgroundColor: #363636, - inputPlaceholderColor: #707070, - buttonBackgroundColor: #363636, - buttonBorderColor: #1f1f1f, - buttonColor: #e0e0e0, - buttonPrimaryColor: #46ace7, - buttonDangerColor: #ff3e24, - primaryColor: #52bdfb, - primaryAccentColor: #3ea1da, - dangerColor: #ff3e24, - successColor: $brand-success, - infoColor: $brand-info, - warningColor: $brand-warning, + inputBorderColor: #4c525f, + inputBackgroundColor: #2f343d, + inputPlaceholderColor: #bac0ce, + buttonBackgroundColor: #272b32, + buttonBorderColor: #4c525f, + buttonColor: #bac0ce, + buttonPrimaryColor: #6f9df1, + buttonDangerColor: #ff8d85, + primaryColor: #6f9df1, + primaryAccentColor: #6f9df1, + dangerColor: #ff8d85, + successColor: #52e07c, + infoColor: #a4b0c6, + warningColor: #ffeb66, logoSuffix: "white", - passwordNumberColor: #52bdfb, - passwordSpecialColor: #ff7c70, + passwordNumberColor: #6f9df1, + passwordSpecialColor: #ff8d85, passwordCountText: #ffffff, - calloutBorderColor: #2f2f2f, - calloutBackgroundColor: #363636, - accountSwitcherBackgroundColor: #2f2f2f, + calloutBorderColor: #4c525f, + calloutBackgroundColor: #3c424e, + toastTextColor: #1f242e, + accountSwitcherBackgroundColor: #2f343d, accountSwitcherTextColor: #ffffff, svgSuffix: "-dark.svg", - hrColor: #a3a3a3, + hrColor: #bac0ce, codeColor: $code-color, ), nord: ( @@ -182,7 +182,6 @@ $themes: ( listItemBackgroundColor: $nord2, listItemBackgroundHoverColor: $nord3, listItemBorderColor: $nord1, - groupingsActiveColor: $nord3, disabledIconColor: $nord5, headingColor: $nord4, headingButtonColor: $nord5, @@ -212,6 +211,7 @@ $themes: ( passwordCountText: $nord5, calloutBorderColor: $nord1, calloutBackgroundColor: $nord2, + toastTextColor: #ffffff, accountSwitcherBackgroundColor: $nord0, accountSwitcherTextColor: $nord5, svgSuffix: "-dark.svg",