import {StyleSheet} from 'react-native';
import {SPACING} from '@shared/theme';
import {windowDimensions} from '@shared/constants';

export const SEARCH_HEIGHT = windowDimensions.height;

const CAMERA_ICON_SIZE = 128;

export const styles = StyleSheet.create({
  container: {
    flex: 1,
    paddingTop: SPACING.x2,
  },
  content: {flexGrow: 1},
  innerContent: {
    flex: 1,
    paddingHorizontal: SPACING.x2,
  },
  header: {
    borderBottomWidth: 1,
    height: 64,
    justifyContent: 'center',
    paddingHorizontal: SPACING.x2,
  },
  backButtonContainer: {
    left: SPACING.x2,
    position: 'absolute',
    zIndex: 1,
  },
  closeButtonContainer: {
    position: 'absolute',
    right: SPACING.x2,
    zIndex: 1,
  },
  nextButtonContainer: {
    borderWidth: 1,
    padding: SPACING.x2,
  },
  cameraContainer: {
    alignItems: 'center',
    alignSelf: 'center',
    justifyContent: 'center',
    marginTop: SPACING.x2,
  },
  selectedImage: {
    borderRadius: CAMERA_ICON_SIZE,
    height: CAMERA_ICON_SIZE,
    width: CAMERA_ICON_SIZE,
  },
  inputName: {marginTop: SPACING.x2},
  listContent: {
    flexGrow: 1,
    paddingBottom: SPACING.x2,
  },
  membersTitle: {
    marginBottom: SPACING.x2,
    marginTop: SPACING.x3,
  },
});
