import {StyleSheet} from 'react-native';
import {COLORS} from '@shared/colors';

const BOTTOM_LOGO_SIZE = 20;
const COMMON_MARGIN = 20;

export const styles = StyleSheet.create({
  itemContainer: {
    alignItems: 'center',
    backgroundColor: COLORS.WHITE,
    flexDirection: 'row',
    height: 85,
    justifyContent: 'space-between',
    paddingHorizontal: 16,
    paddingVertical: 20,
  },
  folderAndName: {
    alignItems: 'center',
    flexDirection: 'row',
  },
  text: {
    fontSize: 18,
    marginLeft: COMMON_MARGIN,
    marginRight: -COMMON_MARGIN,
  },
  grayText: {
    color: COLORS.DARK_GRAY,
    marginLeft: COMMON_MARGIN / 2,
  },
  arrowContainer: {
    alignItems: 'center',
    flexDirection: 'row',
  },
  bottomTextContainer: {
    alignItems: 'center',
    flexDirection: 'row',
    marginLeft: COMMON_MARGIN,
    marginTop: 3,
  },
  bottomTextLogo: {
    height: BOTTOM_LOGO_SIZE,
    marginRight: 5,
    width: BOTTOM_LOGO_SIZE,
  },
  marginRight: {marginRight: -16},
});
