Removing new color and using old grey provided by theme service

src/app/pages/sharing/components/shares-dashboard/shares-dashboard.component.ts

@@ -610,7 +610,7 @@ export class SharesDashboardComponent implements AfterViewInit {
       case ServiceStatus.Running:
         return 'fn-theme-primary';
       case ServiceStatus.Stopped:
-        return count > 0 ? 'fn-theme-red' : 'fn-theme-grey2';
+        return count > 0 ? 'fn-theme-red' : 'fn-theme-grey';
       default:
         return 'fn-theme-orange';
     }

src/app/services/theme/theme.service.ts

@@ -10,7 +10,7 @@ export const DefaultTheme = {
   label: 'iX Dark',
   labelSwatch: 'blue',
   description: 'TrueNAS 12 default theme',
-  accentColors: ['blue', 'magenta', 'orange', 'cyan', 'yellow', 'violet', 'red', 'green', 'grey2'],
+  accentColors: ['blue', 'magenta', 'orange', 'cyan', 'yellow', 'violet', 'red', 'green'],
   primary: 'var(--blue)',
   topbar: '#111111',
   'topbar-txt': 'var(--fg2)',
@@ -31,7 +31,6 @@ export const DefaultTheme = {
   blue: '#0095D5',
   cyan: '#00d0d6',
   green: '#71BF44',
-  grey2: '#a8a8a8',
 };
 
 export interface Theme {
@@ -64,7 +63,6 @@ export interface Theme {
   blue: string;
   cyan: string;
   green: string;
-  grey2: string;
 }
 
 @UntilDestroy()
@@ -88,7 +86,7 @@ export class ThemeService {
       label: 'iX Blue',
       labelSwatch: 'blue',
       description: 'Official iX System Colors on light',
-      accentColors: ['blue', 'orange', 'cyan', 'violet', 'yellow', 'magenta', 'red', 'green', 'grey2'],
+      accentColors: ['blue', 'orange', 'cyan', 'violet', 'yellow', 'magenta', 'red', 'green'],
       primary: 'var(--blue)',
       topbar: 'var(--blue)',
       accent: 'var(--yellow)',
@@ -108,14 +106,13 @@ export class ThemeService {
       blue: '#0095D5',
       cyan: '#00d0d6',
       green: '#71BF44',
-      grey2: '#a8a8a8',
     },
     {
       name: 'dracula',
       label: 'Dracula',
       labelSwatch: 'blue',
       description: 'Dracula color theme',
-      accentColors: ['violet', 'orange', 'cyan', 'blue', 'yellow', 'magenta', 'red', 'green', 'grey2'],
+      accentColors: ['violet', 'orange', 'cyan', 'blue', 'yellow', 'magenta', 'red', 'green'],
       primary: 'var(--blue)',
       topbar: 'var(--blue)',
       'topbar-txt': 'var(--fg1)',
@@ -136,14 +133,13 @@ export class ThemeService {
       blue: '#6272a4',
       cyan: '#8be9fd',
       green: '#50fa7b',
-      grey2: '#a8a8a8',
     },
     {
       name: 'nord',
       label: 'Nord',
       labelSwatch: 'blue',
       description: 'Unofficial nord color theme based on https://www.nordtheme.com/',
-      accentColors: ['violet', 'orange', 'cyan', 'blue', 'yellow', 'magenta', 'red', 'green', 'grey2'],
+      accentColors: ['violet', 'orange', 'cyan', 'blue', 'yellow', 'magenta', 'red', 'green'],
       primary: 'var(--cyan)',
       topbar: 'var(--alt-bg2)',
       'topbar-txt': 'var(--fg2)',
@@ -164,14 +160,13 @@ export class ThemeService {
       blue: '#5e81aC',
       cyan: '#88c0d0',
       green: '#a3be8c',
-      grey2: '#a8a8a8',
     },
     {
       name: 'paper',
       label: 'Paper',
       labelSwatch: 'blue',
       description: 'FreeNAS 11.2 default theme',
-      accentColors: ['violet', 'orange', 'cyan', 'blue', 'yellow', 'magenta', 'red', 'green', 'grey2'],
+      accentColors: ['violet', 'orange', 'cyan', 'blue', 'yellow', 'magenta', 'red', 'green'],
       primary: 'var(--blue)',
       topbar: 'var(--blue)',
       accent: 'var(--yellow)',
@@ -191,14 +186,13 @@ export class ThemeService {
       blue: '#0D5687',
       cyan: '#00d0d6',
       green: '#1F9642',
-      grey2: '#a8a8a8',
     },
     {
       name: 'solarized-dark',
       label: 'Solarized Dark',
       labelSwatch: 'bg2',
       description: 'Solarized dark color scheme',
-      accentColors: ['blue', 'magenta', 'cyan', 'violet', 'green', 'orange', 'yellow', 'red', 'grey2'],
+      accentColors: ['blue', 'magenta', 'cyan', 'violet', 'green', 'orange', 'yellow', 'red'],
       primary: 'var(--fg1)',
       topbar: 'var(--fg1)',
       'topbar-txt': '#cdcdcd',
@@ -219,14 +213,13 @@ export class ThemeService {
       blue: '#268bd2',
       cyan: '#2aa198',
       green: '#859900',
-      grey2: '#a8a8a8',
     },
     {
       name: 'midnight',
       label: 'Midnight',
       labelSwatch: 'blue',
       description: 'Dark theme with blues and greys',
-      accentColors: ['violet', 'orange', 'cyan', 'blue', 'yellow', 'magenta', 'red', 'green', 'grey2'],
+      accentColors: ['violet', 'orange', 'cyan', 'blue', 'yellow', 'magenta', 'red', 'green'],
       primary: 'var(--blue)',
       topbar: 'var(--blue)',
       'topbar-txt': 'var(--fg2)',
@@ -247,14 +240,13 @@ export class ThemeService {
       blue: '#1274b5',
       cyan: '#00d0d6',
       green: '#1F9642',
-      grey2: '#a8a8a8',
     },
     {
       name: 'high-contrast',
       label: 'High Contrast',
       labelSwatch: 'fg1',
       description: 'High contrast theme based on Legacy UI color scheme',
-      accentColors: ['green', 'violet', 'orange', 'cyan', 'magenta', 'red', 'yellow', 'blue', 'grey2'],
+      accentColors: ['green', 'violet', 'orange', 'cyan', 'magenta', 'red', 'yellow', 'blue'],
       primary: 'var(--blue)',
       topbar: 'var(--black)',
       accent: 'var(--magenta)',
@@ -274,7 +266,6 @@ export class ThemeService {
       blue: '#4784ac',
       cyan: '#00d0d6',
       green: '#59d600',
-      grey2: '#a8a8a8',
     },
   ];
 

src/assets/styles/other/_tn-styles.scss

@@ -860,9 +860,9 @@ $primary-dark: darken(map-get($md-primary, 500), 8%);
     @include variable(color, --blue-txt, $blue-txt);
   }
 
-  .fn-theme-grey2 {
-    @include variable(background-color, --grey2, $grey2);
-    @include variable(color, --grey2-txt, $grey2-txt);
+  .fn-theme-grey {
+    @include variable(background-color, --grey, --grey);
+    @include variable(color, --grey, --grey);
   }
 
   .fn-theme-green {
@@ -927,8 +927,8 @@ $primary-dark: darken(map-get($md-primary, 500), 8%);
       @include variable(color, --primary, $primary);
     }
 
-    &.fn-theme-grey2 {
-      @include variable(color, --grey2, $grey2);
+    &.fn-theme-grey {
+      @include variable(color, --grey, --grey);
     }
 
     &.fn-theme-red {

src/assets/styles/scss-imports/cssvars.scss

@@ -23,7 +23,6 @@ $violet: #c17ecc;
 $blue: #0d5788;
 $cyan: #00d0d6;
 $green: #1f9642;
-$grey2: #a8a8a8;
 
 // Generated txt colors
 $yellow-txt: #333;
@@ -36,7 +35,6 @@ $cyan-txt: #333;
 $green-txt: #fff;
 $primary-txt: #fff;
 $accent-txt: #333;
-$grey2-txt: #a8a8a8;
 
 $primary: $blue;
 $accent: $yellow;