Ups

App.js

@@ -8,16 +8,16 @@ import RulingSystem from './src/lib/systems/RulingSystem.js';
 /*********** Custom View Tree ****/
 import { Tree } from './src/lib/helpers/tree';
 
-import FormComp from './modules/Form';
+import FormComp from './src/modules/Form';
 
-import  TextComp  from './modules/Text';
-import RootComp from './modules/RootComp';
-import ImageComp from './modules/Image';
-import ButtonComp from './modules/Button';
+import  TextComp  from './src/modules/Text';
+import RootComp from './src/modules/RootComp';
+import ImageComp from './src/modules/Image';
+import ButtonComp from './src/modules/Button';
 import Environment from './environment';
 import * as Font from 'expo-font';
-import Module from './modules';
-import BlogFeed from './modules/BlogFeed';
+import Module from './src/modules';
+import BlogFeed from './src/modules/BlogFeed';
 
 
 

dist/rules/Universal.css

@@ -1,8 +1,23 @@
 ROOT > * {
 	marginLeft: 24;
 	marginRight: 24;
-	paddingBottom: 12;
+	marginBottom: 8;
+	marginTop: 8;
 }
 ROOT > Badge {
 	marginLeft: 50;
 }
+
+ROOT > Image {
+	marginLeft: 0;
+	marginRight: 0;
+	marginTop: 0;
+}
+
+Image {
+	align-items: center;
+}
+Image > * {
+	justifyContent: center;
+	alignSelf: center;
+}

src/modules/BaseHolder/index.js

@@ -27,10 +27,16 @@ export default class BaseHolder extends React.Component {
 
 			width,
 			height,
+			minWidth,
+			minHeight,
 			paddingTop,
 			paddingBottom,
+			paddingLeft,
+			paddingRight,
 			marginLeft,
 			marginRight,
+			marginTop,
+			marginBottom,
 
 			overflow,
 			CoreSystem,
@@ -52,10 +58,16 @@ export default class BaseHolder extends React.Component {
 				flexBasis,
 				width,
 				height,
+				minWidth,
+				minHeight,
 				paddingTop,
 				paddingBottom,
+				paddingRight,
+				paddingLeft,
 				marginLeft,
 				marginRight,
+				marginTop,
+				marginBottom,
 				overflow,
 
 				pointerEvents: 'auto'
@@ -117,12 +129,21 @@ const styles = StyleSheet.create({
 });
 
 BaseHolder.Inputs = {
+	minWidth: new Types.Integer(),
+	minHeight: new Types.Integer(),
 	width: new Types.Integer(),
 	height: new Types.Integer(),
+
 	paddingTop: new Types.Integer(),
 	paddingBottom: new Types.Integer(),
-	marginLeft: new Types.Integer().default(0),
-	marginRight: new Types.Integer().default(0),
+	paddingLeft: new Types.Integer(),
+	paddingRight: new Types.Integer(),
+
+	marginTop: new Types.Integer(),
+	marginBottom: new Types.Integer(),
+	marginLeft: new Types.Integer(),
+	marginRight: new Types.Integer(),
+
 	stretchContainer: new Types.Bool().default(false),
 	overflow: new Types.Text().default('visible'),
 	justifyContent: new Types.Text().default("flex-start"),

src/modules/Text/index.js

@@ -24,13 +24,10 @@ export default class TextComp extends Module {
 			letterSpacing,
 			textAlign
 		} = this.props;
-		return 	(
-				<View>
-					<Text style={{color, fontSize,fontFamily,textAlign, lineHeight, letterSpacing}}>
-						{text}
-					</Text>
+		return 	<Text style={{color, fontSize,fontFamily,textAlign, lineHeight, letterSpacing}}>
+					{text}
 					{this.props.children}
-				</View>)
+				</Text>
 	}
 }
 

src/rules/Universal.css

@@ -1,8 +1,23 @@
 ROOT > * {
 	marginLeft: 24;
 	marginRight: 24;
-	paddingBottom: 12;
+	marginBottom: 8;
+	marginTop: 8;
 }
 ROOT > Badge {
 	marginLeft: 50;
 }
+
+ROOT > Image {
+	marginLeft: 0;
+	marginRight: 0;
+	marginTop: 0;
+}
+
+Image {
+	align-items: center;
+}
+Image > * {
+	justifyContent: center;
+	alignSelf: center;
+}