import React from 'react'
import {Dimensions, StyleSheet,} from 'react-native'

const {width} = Dimensions.get('window');
export const ComponentsStyles = StyleSheet.create({
    leftMobile: {
        color: '#999',
        width: 120,
        justifyContent: 'flex-end',
        textAlign: 'left'
    },
    rightMobile: {
        color: '#999',
        width: 120,
        justifyContent: 'flex-end',
        textAlign: 'right'
    },
    iconAmount: {
        padding: 3,
        paddingTop: 0,
        borderRadius: 2,
        backgroundColor: 'red',
        color: '#fff',
        height: 12,
        fontSize: 8,
        marginTop: 4,
        marginLeft: 2,
        overflow: 'hidden'
    },
    nameFontSize16: {
        fontSize: 16,
        color: '#333',
        paddingLeft: 2
    },
    nameFontSize14: {
        fontSize: 14,
        color: '#333',
        paddingLeft: 2
    },
    requiredText: {
        color: 'red',
        fontSize: 14,
    },
    container: {
        flex: 1
    },
    containerBackGroundColor: {
        flex: 1,
        backgroundColor: '#f8f8f8'
    },
    cellContainer: {
        flex: 1,
        paddingLeft: 5,
        paddingRight: 5,
        borderWidth: 1,
        borderColor: '#eee',
        borderRadius: 3,
        backgroundColor: '#fff',
        marginLeft: 5,
        marginRight: 5,
        overflow: 'hidden'
        //marginTop:1,
        //marginBottom:1,
    },
    rowPadding3: {
        flexDirection: 'row',
        flex: 1,
        padding: 3,
    },
    rowPadding5: {
        flexDirection: 'row',
        flex: 1,
        padding: 5,
    },
    rowWidth: {
        padding: 10,
        height: 50,
        width,
        backgroundColor: '#fff',
        marginBottom: -1,
        borderBottomColor: '#eee',
        borderBottomWidth: 1,
    },
    left: {
        flex: 3,
        flexDirection: 'row',
    },
    leftAmount: {
        width: 120,
        flexDirection: 'row',
    },
    iconFont16: {
        fontFamily: 'iconfont',
        fontSize: 16,
        color: '#5eafe4',
        marginTop: 1,
    },
    statusDefault: {
        padding: 2,
        borderRadius: 2,
        backgroundColor: '#aaa',
        color: '#fff',
        height: 16,
        fontSize: 8,
        marginTop: 4,
        marginLeft: 4,
        overflow: 'hidden'
    },
    statusPass: {
        padding: 2,
        borderRadius: 2,
        backgroundColor: '#00b300',
        color: '#fff',
        height: 16,
        fontSize: 8,
        marginTop: 4,
        marginLeft: 4,
        overflow: 'hidden'
    },
    rightText: {
        flexDirection: 'row',
        flex: 1,
        justifyContent: 'flex-end',
        textAlign: 'right'
    },
    iconBlue: {
        padding: 2,
        borderRadius: 2,
        backgroundColor: '#5eafe4',
        color: '#fff',
        height: 16,
        fontSize: 8,
        marginTop: 4,
        marginLeft: 4,
        overflow: 'hidden'
    },
    button: {
        borderRadius: 5,
        margin: 10,
        marginTop: 5,
        borderWidth: 0,
        // color: '#fff',
        backgroundColor: "#2b90ea"
    },
    radioStyle: {
        flex: 1,
        flexDirection: 'row',
        justifyContent: 'flex-end',
        backgroundColor: '#ffffff',
        marginVertical: 5
    },
    iconYellow: {
        padding: 2,
        borderRadius: 2,
        backgroundColor: '#f0c11c',
        color: '#fff',
        height: 16,
        fontSize: 8,
        marginTop: 2,
        marginRight: 2,
        overflow: 'hidden'
    },
    checkShow: {
        flexDirection: 'row',
        height: 40,
    },
    checkHide: {
        flexDirection: 'row',
        height: 40,
        display: 'none'
    },
});

export default ComponentsStyles
