Adds initial work on theme structure.

Adds initial work theme colors, spacing, radius and typography.

Author: eluciano11

theme/colors.ts

@@ -0,0 +1,64 @@
+import { ColorStates } from "./constants";
+
+interface ColorPalette extends ColorStates {
+  default: string;
+  hover: string;
+  pressed: string;
+}
+
+interface BackgroundPalette extends ColorStates {
+  default: string;
+  hover: string;
+  disabled: string;
+}
+
+interface Palette {
+  brand: string;
+  primary: ColorPalette;
+  secondary: ColorPalette;
+  success: string;
+  warning: string;
+  danger: string;
+  stroke: string;
+  background: BackgroundPalette;
+}
+
+const BRAND_COLOR = "";
+const PRIMARY_COLOR = "";
+const PRIMARY_COLOR_HOVER = "";
+const PRIMARY_COLOR_PRESSED = "";
+const SECONDARY_COLOR = "";
+const SECONDARY_COLOR_HOVER = "";
+const SECONDARY_COLOR_PRESSED = "";
+const BACKGROUND_COLOR = "";
+const BACKGROUND_COLOR_HOVER = "";
+const BACKGROUND_COLOR_DISABLED = "";
+const SUCCESS_COLOR = "";
+const WARNING_COLOR = "";
+const DANGER_COLOR = "";
+const STROKE_LINE_COLOR = "";
+
+const palette: Palette = {
+  brand: BRAND_COLOR,
+  primary: {
+    default: PRIMARY_COLOR,
+    hover: PRIMARY_COLOR_HOVER,
+    pressed: PRIMARY_COLOR_PRESSED
+  },
+  secondary: {
+    default: SECONDARY_COLOR,
+    hover: SECONDARY_COLOR_HOVER,
+    pressed: SECONDARY_COLOR_PRESSED
+  },
+  success: SUCCESS_COLOR,
+  warning: WARNING_COLOR,
+  danger: DANGER_COLOR,
+  stroke: STROKE_LINE_COLOR,
+  background: {
+    default: BACKGROUND_COLOR,
+    hover: BACKGROUND_COLOR_HOVER,
+    disabled: BACKGROUND_COLOR_DISABLED
+  }
+};
+
+export { Palette, palette };

theme/constants.ts

@@ -0,0 +1,7 @@
+interface ColorStates {
+  hover?: string;
+  pressed?: string;
+  disabled?: string;
+}
+
+export { ColorStates };

theme/index.ts

@@ -0,0 +1,20 @@
+import { Palette, palette } from "./colors";
+import { Shadows, shadows } from "./shadows";
+import { Units, units } from "./units";
+import { Typography, typography } from "./typography";
+
+interface Theme {
+  palette: Palette;
+  units: Units;
+  shadows: Shadows;
+  typography: Typography;
+}
+
+const theme: Theme = {
+  palette,
+  units,
+  shadows,
+  typography
+};
+
+export { Theme, theme };

theme/shadows.ts

@@ -0,0 +1,14 @@
+interface Shadows {
+  default: string;
+  hover: string;
+}
+
+const SHADOW_DEFAULT = "0px 1px 3px rgba(0, 0, 0, 0.07)";
+const SHADOW_HOVER = "0px 5px 10px rgba(0, 0, 0, 0.1)";
+
+const shadows: Shadows = {
+  default: SHADOW_DEFAULT,
+  hover: SHADOW_HOVER
+};
+
+export { Shadows, shadows };

theme/typography.ts

@@ -0,0 +1,28 @@
+import { ColorStates } from "./constants";
+
+interface TextPalette extends ColorStates {
+  primary: string;
+  secondary: string;
+  disabled: string;
+  pressed: string;
+}
+
+interface Typography {
+  palette: TextPalette;
+}
+
+const PRIMARY_TEXT_COLOR = "";
+const SECODARY_TEXT_COLOR = "";
+const PRESSED_TEXT_COLOR = "";
+const DISABLED_TEXT_COLOR = "";
+
+const typography: Typography = {
+  palette: {
+    primary: PRIMARY_TEXT_COLOR,
+    secondary: SECODARY_TEXT_COLOR,
+    disabled: DISABLED_TEXT_COLOR,
+    pressed: PRESSED_TEXT_COLOR
+  }
+};
+
+export { Typography, typography };

theme/units.ts

@@ -0,0 +1,14 @@
+interface Units {
+  spacing: number;
+  radius: number;
+}
+
+const SPACING_UNIT = 5;
+const BORDER_RADIUS_UNIT = 6;
+
+const units: Units = {
+  spacing: SPACING_UNIT,
+  radius: BORDER_RADIUS_UNIT
+};
+
+export { Units, units };