76 lines
1.8 KiB
TypeScript
76 lines
1.8 KiB
TypeScript
import React from 'react';
|
|
import { View, Text, TouchableOpacity, StyleSheet, Image } from 'react-native';
|
|
|
|
import PopUpModal from '../Components/PopUpModal';
|
|
import { ReadyToPostModalProps } from './interfaces';
|
|
import { getIcon, getColor } from '../helpers';
|
|
import { withTheme } from '../../../theme';
|
|
|
|
const BoardDropdownModal: React.FC<ReadyToPostModalProps> = props => {
|
|
const { show, close, onPost } = props;
|
|
|
|
return (
|
|
<PopUpModal show={show} close={close} darkBackground>
|
|
<View style={styles.container}>
|
|
<View style={styles.header}>
|
|
<Image source={getIcon('save')} style={styles.icon} resizeMode='contain' />
|
|
<Text style={styles.headerText}>Ready to post?</Text>
|
|
</View>
|
|
<TouchableOpacity style={{ ...styles.button, ...styles.primaryButton }} onPress={onPost}>
|
|
<Text style={{ ...styles.buttonText, ...styles.primaryButtonText }}>Post</Text>
|
|
</TouchableOpacity>
|
|
<TouchableOpacity style={styles.button} onPress={close}>
|
|
<Text style={styles.buttonText}>Make changes</Text>
|
|
</TouchableOpacity>
|
|
</View>
|
|
</PopUpModal>
|
|
);
|
|
};
|
|
|
|
export default withTheme(BoardDropdownModal);
|
|
|
|
const styles = StyleSheet.create({
|
|
container: {
|
|
paddingHorizontal: 20,
|
|
width: '100%',
|
|
alignItems: 'center'
|
|
},
|
|
header: {
|
|
flexDirection: 'row',
|
|
alignItems: 'center',
|
|
marginBottom: 24
|
|
},
|
|
icon: {
|
|
height: 24,
|
|
width: 24,
|
|
marginRight: 16
|
|
},
|
|
headerText: {
|
|
fontSize: 24,
|
|
fontWeight: '600',
|
|
lineHeight: 29
|
|
},
|
|
button: {
|
|
backgroundColor: '#fff',
|
|
width: '100%',
|
|
alignItems: 'center',
|
|
height: 54,
|
|
borderRadius: 30,
|
|
borderWidth: 1,
|
|
borderColor: getColor('mossGreen'),
|
|
justifyContent: 'center',
|
|
marginBottom: 16
|
|
},
|
|
buttonText: {
|
|
fontSize: 16,
|
|
fontWeight: '600',
|
|
color: getColor('black')
|
|
},
|
|
primaryButton: {
|
|
backgroundColor: getColor('mossGreen')
|
|
},
|
|
primaryButtonText: {
|
|
color: '#fff'
|
|
}
|
|
});
|