(Re)Moving Sizes/Add Dummy sizes

components/01_Layouts/_layouts.styl

@@ -1,7 +1,7 @@
-@import 'sizes/_sizes'
 @import 'contentCrop/_contentCrop'
 @import 'fullWidthContent/_fullWidthContent'
 @import 'flexRow/_flexRow'
 @import 'flexGrid/_flexGrid'
 @import 'fan/_fan'
 @import 'alignment/_alignment'
+@import 'dummy/_dummy'

components/01_Layouts/dummy/_dummy.styl

@@ -0,0 +1,15 @@
++RV-Block('RV-Dummy')
+	+RV-Block__Modifier('square')
+		height 350px
+		width 350px
+		
+	+RV-Block__Modifier('portrait')
+		height 350px
+		width 150px
+		
+	+RV-Block__Modifier('landscape')
+		width 350px
+		height 150px
+		
+	+RV-Block__Modifier('red')
+		background-color #d8583e

components/01_Layouts/flexRow/_flexRow.styl

@@ -90,19 +90,27 @@ RV-FlexRow__Item--fixedSize(width)
  */
 RV-FlexRow__Item--half()
 	+RV-Element__Modifier--name('half')
-		RV-Sizes--half()
+		flex-grow 0
+		flex-shrink 0
+		flex-basis 50%
 
 RV-FlexRow__Item--third()
 	+RV-Element__Modifier--name('third')
-		RV-Sizes--third()
+		flex-grow 0
+		flex-shrink 0
+		flex-basis (100/3)%		
 
 RV-FlexRow__Item--quarter()
 	+RV-Element__Modifier--name('quarter')
-		RV-Sizes--quarter()
+		flex-grow 0
+		flex-shrink 0
+		flex-basis 25%
 	
 RV-FlexRow__Item--content()
 	+RV-Element__Modifier--name('content')
-		RV-Sizes--content()
+		flex-grow 0
+		flex-shrink 0
+		flex-basis max-content
 
 /* ##########
  * Block

components/01_Layouts/sizes/_sizes.styl

@@ -1,51 +0,0 @@
-RV-Sizes--half()
-	+RV-Block__Modifier--name('half')
-		flex-grow 0
-		flex-shrink 0
-		flex-basis 50%
-		width 50%
-	
-RV-Sizes--third()
-	+RV-Block__Modifier--name('third')
-		flex-grow 0
-		flex-shrink 0
-		flex-basis (100/3)%
-		width (100/3)%
-	
-RV-Sizes--quarter()
-	+RV-Block__Modifier--name('quarter')
-		flex-grow 0
-		flex-shrink 0
-		flex-basis 25%
-		width 25%
-	
-RV-Sizes--fixedSize(width=100px)
-	+RV-Block__Modifier--name('fixedSize')
-		flex-grow 0
-		flex-shrink 0
-		width min-content
-		flex-basis width
-	
-RV-Sizes--content()
-	+RV-Block__Modifier--name('content')
-		flex-grow 0
-		flex-shrink 0
-		width max-content
-		flex-basis max-content
-
-+RV-Block('RV-Sizes')
-
-	+RV-Block__Modifier()
-		RV-Sizes--half()
-
-	+RV-Block__Modifier()
-		RV-Sizes--third()
-
-	+RV-Block__Modifier()
-		RV-Sizes--quarter()
-
-	+RV-Block__Modifier()
-		RV-Sizes--fixedSize()
-
-	+RV-Block__Modifier()
-		RV-Sizes--content()

components/01_Layouts/sizes/sizes.hbs

@@ -1,96 +0,0 @@
-<div class="grid">
-	<div>
-		<div class="red RV-Sizes--half">
-			non flexbox, half size
-		</div>
-		<inline class="green">
-			other, no class
-		</inline>
-	</div>
-	<br>
-	<div>
-		<div class="red RV-Sizes--third">
-			non flexbox, third size
-		</div>
-		<inline class="green">
-			other, no class
-		</inline>
-	</div>
-	<br>
-	<div>
-		<div class="red RV-Sizes--quarter">
-			non flexbox, quarter size
-		</div>
-		<inline class="green">
-			other, no class
-		</inline>
-	</div>
-	<br>
-	<div>
-		<div class="red RV-Sizes--fixedSize" style="width: 150px;">
-			non flexbox, fixed size
-		</div>
-		<inline class="green">
-			other, no class
-		</inline>
-	</div>
-	<br>
-	<div>
-		<div class="red RV-Sizes--content">
-			non flexbox, content size
-		</div>
-		<inline class="green">
-			other, no class
-		</inline>
-	</div>
-	<br><br>
-	using flexbox<br>
-	<div class="RV-FlexRow__Container">
-		<div class="red RV-Sizes--half">
-			non flexbox, half size
-		</div>
-		<div class="green RV-Sizes--quarter">
-			non flexbox, quarter size
-		</div>
-		<inline class="red">
-			other, no class
-		</inline>
-	</div>
-	<br>
-	<div class="RV-FlexRow__Container">
-		<div class="red RV-Sizes--third">
-			non flexbox, third size
-		</div>
-		<inline class="green">
-			other, no class
-		</inline>
-	</div>
-	<br>
-	<div class="RV-FlexRow__Container">
-		<div class="red RV-Sizes--quarter">
-			non flexbox, quarter size
-		</div>
-		<inline class="green">
-			other, no class
-		</inline>
-	</div>
-	<br>
-	<div class="RV-FlexRow__Container">
-		<div class="red RV-Sizes--fixedSize" style="width: 150px;">
-			non flexbox, fixed size
-		</div>
-		<inline class="green">
-			other, no class
-		</inline>
-	</div>
-	<br>
-	<div class="RV-FlexRow__Container">
-		<div class="red RV-Sizes--content">
-			non flexbox, content size
-		</div>
-		<inline class="green">
-			other, no class
-		</inline>
-	</div>
-</div>
-