fix(dark): use correct hex order

Author: thetaPC

core/src/themes/base/dark.tokens.primitives.ts

@@ -0,0 +1,7 @@
+import { generateColorSteps } from '../../utils/theme';
+
+// TODO: ADD TYPE
+export const darkPrimitiveColors = {
+  // TODO: Update hex values to use the text color variable and background color variable
+  gray: generateColorSteps('#ffffff', '#000', true),
+};

core/src/themes/base/dark.tokens.ts

@@ -1,6 +1,8 @@
-import { mix, generateColorSteps } from '../../utils/theme';
+import { mix } from '../../utils/theme';
 import type { DarkTheme } from '../themes.interfaces';
 
+import { darkPrimitiveColors } from './dark.tokens.primitives';
+
 const colors = {
   primary: '#4d8dff',
   secondary: '#46b1ff',
@@ -11,7 +13,7 @@ const colors = {
   light: '#222428',
   medium: '#989aa2',
   dark: '#f4f5f8',
-  gray: generateColorSteps('#000000', '#ffffff', true),
+  ...darkPrimitiveColors,
 };
 
 export const darkTheme: DarkTheme = {
@@ -220,5 +222,8 @@ export const darkTheme: DarkTheme = {
     IonItem: {
       background: '#000000',
     },
+    IonBreadcrumb: {
+      separatorColor: colors.gray['550']!,
+    },
   },
 };

core/src/themes/base/light.tokens.ts

@@ -160,4 +160,9 @@ export const lightTheme: LightTheme = {
       },
     },
   },
+  components: {
+    IonBreadcrumb: {
+      separatorColor: '#73849a',
+    },
+  },
 };

core/src/themes/ios/dark.tokens.ts

@@ -1,8 +1,9 @@
 import { darkTheme as baseDarkTheme } from '../base/dark.tokens';
+import { darkPrimitiveColors as baseDarkPrimitiveColors } from '../base/dark.tokens.primitives';
 import type { DarkTheme } from '../themes.interfaces';
 
 const colors = {
-  gray: baseDarkTheme.color!.gray!,
+  gray: baseDarkPrimitiveColors.gray,
 };
 
 export const darkTheme: DarkTheme = {
@@ -56,7 +57,6 @@ export const darkTheme: DarkTheme = {
   },
 
   color: {
-    // TODO: Update hex values to use the text color variable and background color variable
     gray: colors.gray,
   },