[PM-15892] [PM-12250]Remove nord and remnants from solarizedark (#13449)

* Remove nord and remnants from solarizedark

* Update window reload color

* Remove extension-refresh feature flag from clients (#13450)

Co-authored-by: Daniel James Smith <djsmith85@users.noreply.github.com>

* Remove usage of nord and solarized themes within DarkImageDirective

---------

Co-authored-by: Daniel James Smith <2670567+djsmith85@users.noreply.github.com>
Co-authored-by: Daniel James Smith <djsmith85@users.noreply.github.com>

apps/desktop/src/app/accounts/settings.component.ts

@@ -36,7 +36,7 @@ import { LogService } from "@bitwarden/common/platform/abstractions/log.service"
 import { MessagingService } from "@bitwarden/common/platform/abstractions/messaging.service";
 import { PlatformUtilsService } from "@bitwarden/common/platform/abstractions/platform-utils.service";
 import { StateService } from "@bitwarden/common/platform/abstractions/state.service";
-import { ThemeType } from "@bitwarden/common/platform/enums/theme-type.enum";
+import { Theme, ThemeTypes } from "@bitwarden/common/platform/enums/theme-type.enum";
 import { Utils } from "@bitwarden/common/platform/misc/utils";
 import { ThemeStateService } from "@bitwarden/common/platform/theming/theme-state.service";
 import { UserId } from "@bitwarden/common/types/guid";
@@ -128,7 +128,7 @@ export class SettingsComponent implements OnInit, OnDestroy {
     enableSshAgent: false,
     allowScreenshots: false,
     enableDuckDuckGoBrowserIntegration: false,
-    theme: [null as ThemeType | null],
+    theme: [null as Theme | null],
     locale: [null as string | null],
   });
 
@@ -198,10 +198,9 @@ export class SettingsComponent implements OnInit, OnDestroy {
     this.localeOptions = localeOptions;
 
     this.themeOptions = [
-      { name: this.i18nService.t("default"), value: ThemeType.System },
-      { name: this.i18nService.t("light"), value: ThemeType.Light },
-      { name: this.i18nService.t("dark"), value: ThemeType.Dark },
-      { name: "Nord", value: ThemeType.Nord },
+      { name: this.i18nService.t("default"), value: ThemeTypes.System },
+      { name: this.i18nService.t("light"), value: ThemeTypes.Light },
+      { name: this.i18nService.t("dark"), value: ThemeTypes.Dark },
     ];
 
     this.clearClipboardOptions = [

apps/desktop/src/app/services/desktop-theme.service.ts

@@ -1,25 +0,0 @@
-import { map } from "rxjs";
-
-import { ThemeType } from "@bitwarden/common/platform/enums";
-import { GlobalStateProvider } from "@bitwarden/common/platform/state";
-import {
-  THEME_SELECTION,
-  ThemeStateService,
-} from "@bitwarden/common/platform/theming/theme-state.service";
-
-export class DesktopThemeStateService implements ThemeStateService {
-  private readonly selectedThemeState = this.globalStateProvider.get(THEME_SELECTION);
-
-  selectedTheme$ = this.selectedThemeState.state$.pipe(map((theme) => theme ?? this.defaultTheme));
-
-  constructor(
-    private globalStateProvider: GlobalStateProvider,
-    private defaultTheme: ThemeType = ThemeType.System,
-  ) {}
-
-  async setSelectedTheme(theme: ThemeType): Promise<void> {
-    await this.selectedThemeState.update(() => theme, {
-      shouldUpdate: (currentTheme) => currentTheme !== theme,
-    });
-  }
-}

apps/desktop/src/app/services/services.module.ts

@@ -91,7 +91,6 @@ import { GlobalStateProvider, StateProvider } from "@bitwarden/common/platform/s
 // eslint-disable-next-line import/no-restricted-paths -- Implementation for memory storage
 import { MemoryStorageService as MemoryStorageServiceForStateProviders } from "@bitwarden/common/platform/state/storage/memory-storage.service";
 import { SyncService } from "@bitwarden/common/platform/sync";
-import { ThemeStateService } from "@bitwarden/common/platform/theming/theme-state.service";
 import { CipherService as CipherServiceAbstraction } from "@bitwarden/common/vault/abstractions/cipher.service";
 import { DialogService, ToastService } from "@bitwarden/components";
 import { PasswordGenerationServiceAbstraction } from "@bitwarden/generator-legacy";
@@ -135,7 +134,6 @@ import { SearchBarService } from "../layout/search/search-bar.service";
 
 import { DesktopFileDownloadService } from "./desktop-file-download.service";
 import { DesktopSetPasswordJitService } from "./desktop-set-password-jit.service";
-import { DesktopThemeStateService } from "./desktop-theme.service";
 import { InitService } from "./init.service";
 import { NativeMessagingManifestService } from "./native-messaging-manifest.service";
 import { RendererCryptoFunctionService } from "./renderer-crypto-function.service";
@@ -268,11 +266,6 @@ const safeProviders: SafeProvider[] = [
     useFactory: () => fromIpcSystemTheme(),
     deps: [],
   }),
-  safeProvider({
-    provide: ThemeStateService,
-    useClass: DesktopThemeStateService,
-    deps: [GlobalStateProvider],
-  }),
   safeProvider({
     provide: EncryptedMessageHandlerService,
     deps: [

apps/desktop/src/main/window.main.ts

@@ -9,6 +9,7 @@ import { firstValueFrom } from "rxjs";
 
 import { LogService } from "@bitwarden/common/platform/abstractions/log.service";
 import { AbstractStorageService } from "@bitwarden/common/platform/abstractions/storage.service";
+import { ThemeTypes, Theme } from "@bitwarden/common/platform/enums";
 import { processisolations } from "@bitwarden/desktop-napi";
 import { BiometricStateService } from "@bitwarden/key-management";
 
@@ -297,11 +298,15 @@ export class WindowMain {
   }
 
   // Retrieve the background color
-  // Resolves background color missmatch when starting the application.
+  // Resolves background color mismatch when starting the application.
   async getBackgroundColor(): Promise<string> {
     let theme = await this.storageService.get("global_theming_selection");
 
-    if (theme == null || theme === "system") {
+    if (
+      theme == null ||
+      !Object.values(ThemeTypes).includes(theme as Theme) ||
+      theme === "system"
+    ) {
       theme = nativeTheme.shouldUseDarkColors ? "dark" : "light";
     }
 
@@ -310,8 +315,6 @@ export class WindowMain {
         return "#ededed";
       case "dark":
         return "#15181e";
-      case "nord":
-        return "#3b4252";
     }
   }
 

apps/desktop/src/scss/variables.scss

@@ -1,6 +1,4 @@
-@import "~nord/src/sass/nord.scss";
-
-$dark-icon-themes: "theme_dark", "theme_nord";
+$dark-icon-themes: "theme_dark";
 
 $font-family-sans-serif: "DM Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
 $font-family-monospace: Menlo, Monaco, Consolas, "Courier New", monospace;
@@ -166,65 +164,6 @@ $themes: (
     hrColor: #bac0ce,
     codeColor: $code-color-dark,
   ),
-  nord: (
-    textColor: $nord5,
-    borderColor: $nord0,
-    backgroundColor: $nord2,
-    borderColorAlt: $nord5,
-    backgroundColorAlt: $nord1,
-    // Ensure the `window.main.ts` is updated with this value
-    backgroundColorAlt2: $nord1,
-    scrollbarColor: $nord4,
-    scrollbarHoverColor: $nord6,
-    boxBackgroundColor: $nord2,
-    boxBackgroundHoverColor: $nord3,
-    boxBorderColor: $nord1,
-    headerBackgroundColor: $nord2,
-    headerBorderColor: $nord0,
-    headerInputBackgroundColor: $nord6,
-    headerInputBackgroundFocusColor: $nord5,
-    headerInputColor: $nord2,
-    headerInputPlaceholderColor: $nord3,
-    listItemBackgroundColor: $nord2,
-    listItemBackgroundHoverColor: $nord3,
-    listItemBorderColor: $nord1,
-    disabledIconColor: $nord5,
-    headingColor: $nord4,
-    headingButtonColor: $nord5,
-    headingButtonHoverColor: $nord6,
-    labelColor: $nord4,
-    mutedColor: $nord4,
-    totpStrokeColor: $nord4,
-    boxRowButtonColor: $nord4,
-    boxRowButtonHoverColor: $nord6,
-    inputBorderColor: $nord0,
-    inputBackgroundColor: $nord2,
-    inputPlaceholderColor: lighten($nord3, 20%),
-    buttonBackgroundColor: $nord3,
-    buttonBorderColor: $nord0,
-    buttonColor: $nord5,
-    buttonPrimaryColor: $nord8,
-    buttonDangerColor: $nord11,
-    primaryColor: $nord9,
-    primaryAccentColor: $nord8,
-    dangerColor: $nord11,
-    successColor: $nord14,
-    infoColor: $nord9,
-    warningColor: $nord12,
-    logoSuffix: "white",
-    mfaLogoSuffix: "-w.png",
-    passwordNumberColor: $nord8,
-    passwordSpecialColor: $nord12,
-    passwordCountText: $nord5,
-    calloutBorderColor: $nord1,
-    calloutBackgroundColor: $nord2,
-    toastTextColor: #000000,
-    accountSwitcherBackgroundColor: $nord0,
-    accountSwitcherTextColor: $nord5,
-    svgSuffix: "-dark.svg",
-    hrColor: $nord4,
-    codeColor: $code-color-nord,
-  ),
 );
 
 @mixin themify($themes: $themes) {