// @flow
import { Platform, StyleSheet } from 'react-native';
import { border, space } from '../Utils/Theme';

const { radius: BORDER_RADIUS } = border;

const styles = StyleSheet.create({
  button: {
    borderRadius: BORDER_RADIUS,
    overflow: 'hidden',
    ...Platform.select({
      web: {
        boxSizing: 'border-box',
        display: 'inline-block',
      },
    }),
  },
  normal: {
    height: 36,
    minWidth: 64,
    paddingTop: 10,
    paddingBottom: 10,
    paddingLeft: space.large,
    paddingRight: space.large,
    ...Platform.select({
      web: {
        userSelect: 'none',
        display: 'block',
      },
    }),
  },
  compact: {
    paddingLeft: space.regular,
    paddingRight: space.regular,
  },
  dense: {
    height: 32,
    paddingTop: space.regular,
    paddingBottom: space.regular,
  },
});

export default styles;
