From 454aa3fc5c0d4cba13f48e9fc2c695d749a6c7ea Mon Sep 17 00:00:00 2001 From: Tim Glasgow Date: Sun, 24 Jul 2022 15:27:31 -0500 Subject: [PATCH] app stylesheet --- .../components/styles/AppStyles.js | 65 +++++++++++++++++++ 1 file changed, 65 insertions(+) create mode 100644 squarenotsquare/components/styles/AppStyles.js diff --git a/squarenotsquare/components/styles/AppStyles.js b/squarenotsquare/components/styles/AppStyles.js new file mode 100644 index 0000000..f90743a --- /dev/null +++ b/squarenotsquare/components/styles/AppStyles.js @@ -0,0 +1,65 @@ +import { StyleSheet } from "react-native"; +import * as colors from '../../themes/Colors'; +import * as fonts from '../../themes/Fonts'; +import * as metrics from '../../themes/Metrics'; + +export const styles = StyleSheet.create({ + flex: {flex: 1}, + flexDouble: {flex: 2}, + flexTriple: {flex: 3}, + flexHalf: {flex: 0.5}, + flexThird: {flex: 0.33}, + flexTwoThirds: {flex: 0.67}, + flexRow: {flexDirection: 'row'}, + flexColumn: {flexDirection: 'column'}, + flexWrap: {flexWrap: 'wrap'}, + flexShrink: {flexShrink: 1}, + + centeredJustify: {justifyContent: 'center'}, + centeredItems: {alignItems: 'center'}, + centeredContent: {alignContent: 'center'}, + centeredSelf: {alignSelf: 'center'}, + + startAlign: {alignSelf: 'flex-start'}, + endAlign: {alignSelf: 'flex-end'}, + startJustify: {justifyContent: 'flex-start'}, + endJustify: {justifyContent: 'flex-end'}, + + stretch: {alignSelf: 'stretch'}, + absolute: { + position: 'absolute', + top: metrics.screenSections.headerHeight, + bottom: 0, + left: 0, + right: 0, + }, + + spaceBetween: {justifyContent: 'space-between'}, + spaceEvenly: {justifyContent: 'space-evenly'}, + spaceAround: {justifyContent: 'space-around'}, + + centeredText: {textAlign: 'center'}, + rightText: {textAlign: 'right'}, + leftText: {textAlign: 'left'}, + + headerTitleFont: {fontSize: fonts.headerTitle.size}, + largeFont: {fontSize: fonts.large.size}, + mediumFont: {fontSize: fonts.medium.size}, + smallFont: {fontSize: fonts.small.size}, + tinyFont: {fontSize: fonts.tiny.size}, + subFont: {fontSize: fonts.subFont.size}, + tickFont: {fontSize: fonts.tickFont.size}, + + italic: {fontStyle: 'italic'}, + greyText: {color: colors.material.grey600}, + redText: {color: colors.material.red800}, + blueText: {color: colors.material.blue400}, + boldText: {fontWeight: 'bold'}, + + lightText: {color: colors.impulseColors.lightText}, + darkText: {color: colors.impulseColors.black}, + + body: { + backgroundColor: colors.material.light, + } +}) \ No newline at end of file