53 lines
1.2 KiB
TypeScript
53 lines
1.2 KiB
TypeScript
import { StyleSheet, Dimensions } from 'react-native';
|
|
|
|
const { width, height } = Dimensions.get('window');
|
|
|
|
const guidelineBaseWidth = 350;
|
|
const guidelineBaseHeight = 680;
|
|
|
|
const horizontalScale = (size: number) => (width / guidelineBaseWidth) * size;
|
|
const verticalScale = (size: number) => (height / guidelineBaseHeight) * size;
|
|
const moderateScale = (size: number, factor = 0.5) =>
|
|
size + (horizontalScale(size) - size) * factor;
|
|
|
|
const styles = StyleSheet.create({
|
|
marginBottom: {
|
|
marginBottom: verticalScale(15),
|
|
},
|
|
bigMarginBottom: {
|
|
marginBottom: verticalScale(30),
|
|
},
|
|
extremeMarginBottom: {
|
|
marginBottom: verticalScale(100),
|
|
},
|
|
padding: {
|
|
padding: '5%',
|
|
},
|
|
smallPaddingHorizontal: {
|
|
paddingHorizontal: '2.5%',
|
|
},
|
|
centered: {
|
|
flex: 1,
|
|
justifyContent: 'center',
|
|
alignItems: 'center',
|
|
},
|
|
centeredVertical: {
|
|
alignItems: 'center',
|
|
},
|
|
centerText: {
|
|
textAlign: 'center',
|
|
},
|
|
flexRow: {
|
|
flexDirection: 'row',
|
|
},
|
|
flexRowSpaceBetween: {
|
|
flexDirection: 'row',
|
|
justifyContent: 'space-between',
|
|
},
|
|
flexRowReverse: {
|
|
flexDirection: 'row-reverse',
|
|
},
|
|
});
|
|
|
|
export { horizontalScale, verticalScale, moderateScale, styles as default };
|