chore: add mobile app

mobile/src/theme/colors.ts

@@ -0,0 +1,94 @@
+export const darkColors = {
+    // Backgrounds
+    bgPrimary: "#0a0a0a",
+    bgSecondary: "#1a1a1a",
+    bgCard: "#1e1e1e",
+    bgInput: "#2a2a2a",
+    bgModal: "rgba(0,0,0,0.95)",
+
+    // Text
+    textPrimary: "rgba(255, 255, 255, 0.87)",
+    textSecondary: "rgba(255, 255, 255, 0.6)",
+    textMuted: "rgba(255, 255, 255, 0.4)",
+    textWhite: "#ffffff",
+
+    // Accent
+    accent: "#7c3aed",
+    accentDark: "#6d28d9",
+    accentLight: "#8b5cf6",
+
+    // Status
+    success: "#4ade80",
+    successDark: "#22c55e",
+    successDarker: "#16a34a",
+    danger: "#ef4444",
+    dangerDark: "#dc2626",
+    warning: "#f59e0b",
+    info: "#3b82f6",
+
+    // Category colors
+    categoryWeedHash: "#10b981",
+    categoryTous: "#9333ea",
+    categoryZipette: "#f5f5f0",
+    categoryGros: "#3dc2f7",
+
+    // Borders
+    border: "#333333",
+    borderLight: "#222222",
+    borderSubtle: "rgba(255, 255, 255, 0.1)",
+
+    // Misc
+    overlay: "rgba(0, 0, 0, 0.5)",
+    transparent: "transparent",
+    white: "#ffffff",
+    black: "#000000",
+} as const;
+
+export const lightColors: Colors = {
+    // Backgrounds
+    bgPrimary: "#f2f2f7",
+    bgSecondary: "#ffffff",
+    bgCard: "#ffffff",
+    bgInput: "#e5e5ea",
+    bgModal: "rgba(255,255,255,0.95)",
+
+    // Text
+    textPrimary: "rgba(0, 0, 0, 0.87)",
+    textSecondary: "rgba(0, 0, 0, 0.6)",
+    textMuted: "rgba(0, 0, 0, 0.4)",
+    textWhite: "#000000",
+
+    // Accent
+    accent: "#7c3aed",
+    accentDark: "#6d28d9",
+    accentLight: "#8b5cf6",
+
+    // Status
+    success: "#16a34a",
+    successDark: "#15803d",
+    successDarker: "#166534",
+    danger: "#dc2626",
+    dangerDark: "#b91c1c",
+    warning: "#d97706",
+    info: "#2563eb",
+
+    // Category colors
+    categoryWeedHash: "#10b981",
+    categoryTous: "#9333ea",
+    categoryZipette: "#1a1a1a",
+    categoryGros: "#0ea5e9",
+
+    // Borders
+    border: "#d1d5db",
+    borderLight: "#e5e7eb",
+    borderSubtle: "rgba(0, 0, 0, 0.08)",
+
+    // Misc
+    overlay: "rgba(0, 0, 0, 0.3)",
+    transparent: "transparent",
+    white: "#ffffff",
+    black: "#000000",
+};
+
+export type Colors = { [K in keyof typeof darkColors]: string };
+export type ColorName = keyof Colors;

mobile/src/theme/index.ts

@@ -0,0 +1,5 @@
+export { darkColors, lightColors, darkColors as colors } from "./colors";
+export type { Colors } from "./colors";
+export { spacing, borderRadius } from "./spacing";
+export { fontSize, fontWeight, fontFamily } from "./typography";
+export { shadows } from "./shadows";

mobile/src/theme/shadows.ts

@@ -0,0 +1,40 @@
+import { Platform } from 'react-native';
+
+export const shadows = {
+  sm: Platform.select({
+    ios: {
+      shadowColor: '#000',
+      shadowOffset: { width: 0, height: 1 },
+      shadowOpacity: 0.2,
+      shadowRadius: 2,
+    },
+    android: {
+      elevation: 2,
+    },
+    default: {},
+  }),
+  md: Platform.select({
+    ios: {
+      shadowColor: '#000',
+      shadowOffset: { width: 0, height: 2 },
+      shadowOpacity: 0.3,
+      shadowRadius: 4,
+    },
+    android: {
+      elevation: 4,
+    },
+    default: {},
+  }),
+  lg: Platform.select({
+    ios: {
+      shadowColor: '#000',
+      shadowOffset: { width: 0, height: 4 },
+      shadowOpacity: 0.4,
+      shadowRadius: 8,
+    },
+    android: {
+      elevation: 8,
+    },
+    default: {},
+  }),
+} as const;

mobile/src/theme/spacing.ts

@@ -0,0 +1,17 @@
+export const spacing = {
+  xs: 4,
+  s: 8,
+  m: 12,
+  l: 16,
+  xl: 24,
+  xxl: 32,
+  xxxl: 48,
+} as const;
+
+export const borderRadius = {
+  sm: 8,
+  md: 12,
+  lg: 16,
+  xl: 25,
+  full: 9999,
+} as const;

mobile/src/theme/typography.ts

@@ -0,0 +1,24 @@
+import { Platform } from 'react-native';
+
+export const fontFamily = Platform.select({
+  ios: 'System',
+  android: 'Roboto',
+  default: 'System',
+});
+
+export const fontSize = {
+  xs: 11,
+  sm: 13,
+  md: 15,
+  lg: 17,
+  xl: 20,
+  xxl: 28,
+  title: 34,
+} as const;
+
+export const fontWeight = {
+  regular: '400' as const,
+  medium: '500' as const,
+  semibold: '600' as const,
+  bold: '700' as const,
+};