mirror of
https://github.com/zhigang1992/react-native-web.git
synced 2026-03-26 01:04:13 +08:00
50 lines
831 B
JavaScript
50 lines
831 B
JavaScript
/* eslint-disable react/prop-types */
|
|
import Radium from 'radium';
|
|
import React from 'react';
|
|
import View from '../View/radium';
|
|
|
|
const Box = ({ color, fixed = false, layout = 'column', outer = false, ...other }) => (
|
|
<View
|
|
{...other}
|
|
style={[
|
|
styles[`color${color}`],
|
|
fixed && styles.fixed,
|
|
layout === 'row' && styles.row,
|
|
outer && styles.outer
|
|
]}
|
|
/>
|
|
);
|
|
|
|
const styles = {
|
|
outer: {
|
|
padding: 4
|
|
},
|
|
row: {
|
|
flexDirection: 'row'
|
|
},
|
|
color0: {
|
|
backgroundColor: '#222'
|
|
},
|
|
color1: {
|
|
backgroundColor: '#666'
|
|
},
|
|
color2: {
|
|
backgroundColor: '#999'
|
|
},
|
|
color3: {
|
|
backgroundColor: 'blue'
|
|
},
|
|
color4: {
|
|
backgroundColor: 'orange'
|
|
},
|
|
color5: {
|
|
backgroundColor: 'red'
|
|
},
|
|
fixed: {
|
|
width: 20,
|
|
height: 20
|
|
}
|
|
};
|
|
|
|
export default Radium(Box);
|