eletrotupi / tcc/ commit / 1180f89

frontend: introduce spacing and border constants

Pedro Lucas Porcellis porcellis@eletrotupi.com · 5 months ago 1180f89b2b7144177e9d52ec64e26ee1bc4485d0 Browse files
Parents 51a7c2b
Changed files
1
Additions
+20
Deletions
-5
frontend/constants/theme.ts modified+20 -5
frontend/constants/theme.ts
1 1 
/**
2 2 
 * Below are the colors that are used in the app. The colors are defined in the light and dark mode.
3 3 
 * There are many other ways to style your app. For example, [Nativewind](https://www.nativewind.dev/), [Tamagui](https://tamagui.dev/), [unistyles](https://reactnativeunistyles.vercel.app), etc.
4 4 
 */
5 5
63 63 
    activeBackground: STATUS_ACTIVE_BG,
64 64 
    inactiveOpacity: 0.7,
65 65
66 66 
    // Semantic Accents (for categorization)
67 67 
    accentBlue: PILL_BLUE,
68 - 
  accentIndigo: PILL_INDIGO,
69 - 
  accentPurple: PILL_PURPLE,
68 + 
    accentIndigo: PILL_INDIGO,
69 + 
    accentPurple: PILL_PURPLE,
70 70
71 - 
  // Disabled / Secondary
72 - 
  disabled: '#cbd5e1',
73 - 
  divider: BORDER_SUBTLE,
71 + 
    // Disabled / Secondary
72 + 
    disabled: '#cbd5e1',
73 + 
    divider: BORDER_SUBTLE,
74 74 
  },
75 75 
};
76 76
77 77 
export const Typography = {
78 78 
  // Headlines
125 125 
    fontSize: 12,
126 126 
    fontWeight: '600' as const,
127 127 
    lineHeight: 16,
128 128 
    letterSpacing: 0.05,
129 129 
  },
130 + 
};
131 +
132 + 
export const Spacing = {
133 + 
  containerPadding: 16, // 1rem
134 + 
  sectionGap: 32, // 2rem
135 + 
  inlineGapSm: 8, // 0.5rem
136 + 
};
137 +
138 + 
export const BorderRadius = {
139 + 
  sm: 4, // 0.25rem
140 + 
  default: 8, // 0.5rem
141 + 
  md: 12, // 0.75rem
142 + 
  lg: 16, // 1rem
143 + 
  xl: 24, // 1.5rem
144 + 
  full: 9999, // pill-shaped
130 145 
};
131 146
132 147 
export const Fonts = Platform.select({
133 148 
  default: {
134 149 
    sans: 'Inter',
135 150 
    serif: 'serif',
136 151 
    rounded: 'Inter',
137 152 
    mono: 'monospace',
138 153 
  },
139 154 
});