From 09ce02cc7d56212d63dad1abd64e89eec0119538 Mon Sep 17 00:00:00 2001 From: Eric Bailey Date: Fri, 20 Oct 2023 16:07:09 -0400 Subject: [PATCH] Add docblocks --- src/view/nova/themes.ts | 47 +++++++++++++++++++++++++++++++++++++---- 1 file changed, 43 insertions(+), 4 deletions(-) diff --git a/src/view/nova/themes.ts b/src/view/nova/themes.ts index a4d586dc8c..1f60621b75 100644 --- a/src/view/nova/themes.ts +++ b/src/view/nova/themes.ts @@ -37,50 +37,87 @@ export const light = createTheme({ xxl: 26, }, lineHeight: { + xxs: 10, xs: 12, s: 14, m: 16, l: 18, xl: 22, + xxl: 26, }, }, properties: { + /** Alias for `width` */ w: ['width'], + /** Alias for `height` */ h: ['height'], + /** Alias for `color` */ c: ['color'], + /** Alias for `backgroundColor` */ bg: ['backgroundColor'], + /** Alias for all directional margin properties */ ma: ['marginTop', 'marginBottom', 'marginLeft', 'marginRight'], + /** Alias for `marginTop` */ mt: ['marginTop'], + /** Alias for `marginBottom` */ mb: ['marginBottom'], + /** Alias for `marginLeft` */ ml: ['marginLeft'], + /** Alias for `marginRight` */ mr: ['marginRight'], + /** Alias for `marginVertical` */ my: ['marginTop', 'marginBottom'], + /** Alias for `marginHorizontal` */ mx: ['marginLeft', 'marginRight'], - /** - * Alias for `padding`, maps to all padding properties e.g. `paddingTop`, - * `paddingBottom`, etc. - */ + /** Alias for all directional padding properties */ pa: ['paddingTop', 'paddingBottom', 'paddingLeft', 'paddingRight'], + /** Alias for `paddingTop` */ pt: ['paddingTop'], + /** Alias for `paddingBottom` */ pb: ['paddingBottom'], + /** Alias for `paddingLeft` */ pl: ['paddingLeft'], + /** Alias for `paddingRight` */ pr: ['paddingRight'], + /** Alias for `paddingVertical` */ py: ['paddingTop', 'paddingBottom'], + /** Alias for `paddingHorizontal` */ px: ['paddingLeft', 'paddingRight'], + /** Alias for `zIndex` */ z: ['zIndex'], + /** Alias for `borderRadius` */ radius: ['borderRadius'], }, macros: { + /** Shorthand for `flexDirection: 'row'` */ row: (_: boolean) => ({flexDirection: 'row'}), + /** + * Shorthand for `flex: 1`. + * + * Semantically this is helpful as a direct child of `` + * + * @example + * + * + * Hello + * + * + */ column: (_: boolean) => ({flex: 1}), + /** Shorthand for `position: 'absolute'` */ abs: (_: boolean) => ({position: 'absolute'}), + /** Shorthand for `StyleSheet.absoluteFillObject` */ cover: (_: boolean) => ({ top: 0, bottom: 0, left: 0, right: 0, }), + /** Shorthand for `textTransform: 'uppercase'` */ caps: (_: boolean) => ({textTransform: 'uppercase'}), + /** + * Shorthand for applying `fontSize` and `fontHeight`, according to our type scale. + */ fontSize(value: 'xs' | 's' | 'm' | 'l' | 'xl', tokens) { return { fontSize: tokens.fontSize[value], @@ -89,7 +126,9 @@ export const light = createTheme({ }, }, breakpoints: { + /** Greater than 800 */ gtMobile: 800, + /** Greater than 1300 */ gtTablet: 1300, }, })