Refine admin PWA layout and tamagui usage

tamagui.config.ts

@@ -8,16 +8,16 @@ const tokens = {
   ...baseTokens,
   color: {
     ...baseTokens.color,
-    primary: '#FF5A5F',
-    accent: '#FFB6C1',
-    accentSoft: '#FFE5EC',
-    success: '#06D6A0',
-    warning: '#F5C542',
-    danger: '#E04848',
+    primary: '#FF5C5C',
+    accent: '#3D5AFE',
+    accentSoft: '#E8ECFF',
+    success: '#22C55E',
+    warning: '#FBBF24',
+    danger: '#EF4444',
     surface: '#ffffff',
-    muted: '#F4ECE8',
-    border: '#F2E4DA',
-    text: '#1F2937',
+    muted: '#FFF6F0',
+    border: '#F3D6C9',
+    text: '#0B132B',
   },
   radius: {
     ...baseTokens.radius,
@@ -37,53 +37,53 @@ const themes = {
     ...baseThemes.light,
     primary: tokens.color.primary,
     accent: tokens.color.accent,
-    background: '#FFF8F5',
-    backgroundHover: '#FFF1EC',
-    backgroundPress: '#FFE7E0',
+    background: '#FFF1E8',
+    backgroundHover: '#FFE8DD',
+    backgroundPress: '#FFE1D2',
     backgroundStrong: tokens.color.surface,
-    backgroundTransparent: 'rgba(255, 248, 245, 0)',
+    backgroundTransparent: 'rgba(255, 241, 232, 0)',
     color: tokens.color.text,
-    colorHover: '#111827',
-    colorPress: '#0F172A',
-    colorFocus: '#0F172A',
+    colorHover: '#091024',
+    colorPress: '#091024',
+    colorFocus: '#091024',
     borderColor: tokens.color.border,
-    borderColorHover: '#EAD5C9',
-    borderColorPress: '#E0C9BC',
-    shadowColor: 'rgba(31, 41, 55, 0.12)',
-    shadowColorPress: 'rgba(31, 41, 55, 0.16)',
-    shadowColorFocus: 'rgba(31, 41, 55, 0.18)',
+    borderColorHover: '#EBCABA',
+    borderColorPress: '#E1BFAE',
+    shadowColor: 'rgba(11, 19, 43, 0.16)',
+    shadowColorPress: 'rgba(11, 19, 43, 0.2)',
+    shadowColorFocus: 'rgba(11, 19, 43, 0.24)',
     surface: tokens.color.surface,
     muted: tokens.color.muted,
     blue3: tokens.color.accentSoft,
     blue6: tokens.color.accent,
     blue10: tokens.color.primary,
-    blue11: '#C2413B',
+    blue11: '#1E36F1',
   },
   dark: {
     ...baseThemes.dark,
     primary: tokens.color.primary,
     accent: tokens.color.accent,
-    background: '#171219',
-    backgroundHover: '#1F1A23',
-    backgroundPress: '#26212B',
-    backgroundStrong: '#1F1A23',
-    backgroundTransparent: 'rgba(23, 18, 25, 0)',
-    color: '#F8F6F2',
+    background: '#0B132B',
+    backgroundHover: '#101A36',
+    backgroundPress: '#132142',
+    backgroundStrong: '#101A36',
+    backgroundTransparent: 'rgba(11, 19, 43, 0)',
+    color: '#F8FAFF',
     colorHover: '#FFFFFF',
-    colorPress: '#FDF8F5',
+    colorPress: '#F2F6FF',
     colorFocus: '#FFFFFF',
-    borderColor: '#2C2531',
-    borderColorHover: '#3A3240',
-    borderColorPress: '#443C4A',
+    borderColor: '#1F2A4A',
+    borderColorHover: '#29345A',
+    borderColorPress: '#313D67',
     shadowColor: 'rgba(0, 0, 0, 0.55)',
     shadowColorPress: 'rgba(0, 0, 0, 0.65)',
     shadowColorFocus: 'rgba(0, 0, 0, 0.6)',
-    surface: '#1F1A23',
-    muted: '#241E28',
-    blue3: '#2B1D23',
-    blue6: '#5A2D34',
-    blue10: '#FF7A7F',
-    blue11: '#FFB3B6',
+    surface: '#0F1B36',
+    muted: '#121F3D',
+    blue3: '#1B2550',
+    blue6: '#3D5AFE',
+    blue10: '#FF5C5C',
+    blue11: '#FF8A8A',
   },
 };
 
@@ -105,12 +105,12 @@ const fonts = {
   },
   heading: {
     ...defaultConfig.fonts.heading,
-    family: 'Manrope',
+    family: 'Archivo Black',
     weight: sharedWeights,
   },
   display: {
     ...defaultConfig.fonts.heading,
-    family: 'Fraunces',
+    family: 'Archivo Black',
     weight: sharedWeights,
   },
 };