If you come up with the Atom IDE, that will a great help to use "atom-react-native-css" then you can code by SCSS and it will generate the JS stylesheet without wory about learning new style language from Ract Native .
Example from SCSS file:
.buttonRound {
background-color: #fff;
padding: 12px;
border-color: #ddd;
border-width: 1;
align-self: center;
border-radius: 20px;
margin-top: 12px;
margin-left: 10px;
margin-right: 10px;
width: "JS(width-30)";
}
and the output JS will be:
import React, {StyleSheet, Dimensions, PixelRatio} from "react-native";
const {width, height, scale} = Dimensions.get("window"),
vw = width / 100,
vh = height / 100,
vmin = Math.min(vw, vh),
vmax = Math.max(vw, vh);
export default StyleSheet.create({
"buttonRound": {
"backgroundColor": "#fff",
"paddingTop": 12,
"paddingRight": 12,
"paddingBottom": 12,
"paddingLeft": 12,
"borderColor": "#ddd",
"borderWidth": 1,
"alignSelf": "center",
"borderRadius": 20,
"marginTop": 12,
"marginLeft": 10,
"marginRight": 10,
"width": width-30
},
});