diff options
Diffstat (limited to 'app_expo/components/text/text.presets.ts')
-rw-r--r-- | app_expo/components/text/text.presets.ts | 48 |
1 files changed, 48 insertions, 0 deletions
diff --git a/app_expo/components/text/text.presets.ts b/app_expo/components/text/text.presets.ts new file mode 100644 index 0000000..4693417 --- /dev/null +++ b/app_expo/components/text/text.presets.ts @@ -0,0 +1,48 @@ +import { TextStyle } from 'react-native' +import { color, typography } from '../../theme' + +/** + * All text will start off looking like this. + */ +const BASE: TextStyle = { + fontFamily: typography.primary, + color: color.text, + fontSize: 15, +} + +/** + * All the variations of text styling within the app. + * + * You want to customize these to whatever you need in your app. + */ +export const presets = { + /** + * The default text styles. + */ + default: BASE, + + /** + * A bold version of the default text. + */ + bold: { ...BASE, fontWeight: 'bold' } as TextStyle, + + /** + * Large headers. + */ + header: { ...BASE, fontSize: 24, fontWeight: 'bold' } as TextStyle, + + /** + * Field labels that appear on forms above the inputs. + */ + fieldLabel: { ...BASE, fontSize: 13, color: color.dim } as TextStyle, + + /** + * A smaller piece of secondard information. + */ + secondary: { ...BASE, fontSize: 9, color: color.dim } as TextStyle, +} + +/** + * A list of preset names. + */ +export type TextPresets = keyof typeof presets |