Common dimentions for React Native

dimentions.js

// Padding - 15
const padding15 = { padding: 15 };
const paddingTop15 = { padding: 15 };
const paddingRight15 = { paddingRight: 15 };
const paddingBottom15 = { paddingBottom: 15 };
const paddingLeft15 = { paddingLeft: 15 };
const paddingVeritacal15 = { paddingVertical: 15 };
const paddingHorizontal15 = { paddingHorizontal: 15 };
// Margin - 15
const margin15 = { margin: 15 };
const marginVeritacal15 = { marginVertical: 15 };
const marginHorizontal15 = { marginHorizontal: 15 };
const marginTop15 = { marginTop: 15 };
const marginBottom15 = { marginBottom: 15 };
// Padding - 10
const padding10 = { padding: 10 };
const paddingVeritacal10 = { paddingVertical: 10 };
const paddingHorizontal10 = { paddingHorizontal: 10 };
const paddingRight10 = { paddingRight: 10 };
const paddingLeft10 = { paddingRight: 10 };
const marginTop10 = { marginTop: 10 };
const marginBottom10 = { marginBottom: 10 };
// Margin - 5
const margin5 = { margin: 5 };
const marginRight5 = { marginRight: 5 };
const marginLeft5 = { marginLeft: 5 };
const marginVeritacal5 = { marginVertical: 5 };
const marginHorizontal5 = { marginHorizontal: 5 };
// Margin - 10
const margin10 = { margin: 10 };
const marginVeritacal10 = { marginVertical: 10 };
const marginHorizontal10 = { marginHorizontal: 10 };
// MarginTop - 20
const marginTop20 = { marginTop: 20 };
const marginBottom20 = { marginBottom: 20 };
// MarginTop - 20
const paddingVertical20 = { paddingVertical: 20 };
// Display
const row = { flexDirection: 'row' };
const column = { flexDirection: 'column' };
// JustifyContent
const jcCenter = { justifyContent: 'center' };
const jcSpaceAround = { justifyContent: 'space-around' };
const jcSpaceBetween = { justifyContent: 'space-between' };
const jcStart = { justifyContent: 'flex-start' };
const jcEnd = { justifyContent: 'flex-end' };
// AlignItems
const aiCenter = { alignItems: 'center' };
// AlignSelf
const asCenter = { alignSelf: 'center' };
const asStart = { alignSelf: 'flex-start' };
const asEnd = { alignSelf: 'flex-end' };
// Text Align
const taCenter = { textAlign: 'center' };
const taRight = { textAlign: 'right' };
const taLeft = { textAlign: 'left' };
// Flex
const flex1 = { flex: 1 };
const flex2 = { flex: 2 };
const flex3 = { flex: 3 };
const flex4 = { flex: 4 };

export {
  margin5,
  marginRight5,
  marginLeft5,
  marginVeritacal5,
  marginHorizontal5,
  padding15,
  paddingTop15,
  paddingBottom15,
  paddingRight15,
  paddingLeft15,
  paddingVeritacal15,
  paddingHorizontal15,
  padding10,
  paddingVeritacal10,
  paddingHorizontal10,
  paddingRight10,
  paddingLeft10,
  margin15,
  marginTop15,
  marginBottom15,
  marginVeritacal15,
  marginHorizontal15,
  margin10,
  marginTop10,
  marginBottom10,
  marginVeritacal10,
  marginHorizontal10,
  marginTop20,
  marginBottom20,
  paddingVertical20,
  row,
  column,
  flex1,
  flex2,
  flex3,
  flex4,
  jcCenter,
  jcSpaceAround,
  jcSpaceBetween,
  jcStart,
  jcEnd,
  aiCenter,
  asCenter,
  asStart,
  asEnd,
  taCenter,
  taRight,
  taLeft
};