Adapting Styles to new BEMGenerator

components/02_Styles/boxShadow/_boxShadow.styl

@@ -6,11 +6,11 @@
  * Just a simple box shadow, surrounding the box
  */
 RV-BoxShadow--simple(color)
-	+RV-Block__Modifier--name('simple')
+	+RV-Block--modifier()
 		box-shadow 0 0 10px 3px color
 
 RV-BoxShadow--solid(color)
-	+RV-Block__Modifier--name('solid')
+	+RV-Block--modifier()
 		border 8px solid color
 		border-radius 14px
 		padding 8px
@@ -21,7 +21,7 @@ RV-BoxShadow--solid(color)
  * box, which creates an levitation effect
  */
 RV-BoxShadow--levitating(color)
-	+RV-Block__Modifier--name('levitating')
+	+RV-Block--modifier()
 		box-shadow: color 0px 1px 1px 0px inset, color 0px 40px 80px -15px, color 0px 30px 60px -30px;
 
 /*
@@ -34,7 +34,7 @@ RV-BoxShadow--levitating(color)
  * if used in the same selector / var scope
  */
 RV-BoxShadow--stacked(color)
-	+RV-Block__Modifier--name('stacked')		
+	+RV-Block--modifier()	
 		--color red(@--color), green(@--color), blue(@--color)
 		box-shadow: 'rgba(%s, 0.4) 0px 5px, rgba(%s, 0.3) 0px 10px, rgba(%s, 0.2) 0px 15px, rgba(%s, 0.1) 0px 20px, rgba(%s, 0.05) 0px 25px' % (color color color color color)
 
@@ -44,7 +44,7 @@ RV-BoxShadow--stacked(color)
  * a piece of paper
  */
 RV-BoxShadow--liftedCorners(color)
-	+RV-Block__Modifier--name('liftedCorners')
+	+RV-Block--modifier()
 		&:before, &:after
 			bottom 15px
 			left 10px
@@ -62,7 +62,7 @@ RV-BoxShadow--liftedCorners(color)
  * A suttle drop shadow in the middle of the element
  */
 RV-BoxShadow--drop(color)
-	+RV-Block__Modifier--name('drop')
+	+RV-Block--modifier()
 		position relative
 		box-shadow 0 1px 4px color
 		
@@ -92,20 +92,9 @@ RV-BoxShadow()
 	
 	RV-BoxShadow()
 	
-	+RV-Block__Modifier()
+	RV-BoxShadow--simple(--color)
-		RV-BoxShadow--simple(--color)
+	RV-BoxShadow--liftedCorners(--color)
-		
+	RV-BoxShadow--levitating(--color)
-	+RV-Block__Modifier()
+	RV-BoxShadow--stacked(--color)
-		RV-BoxShadow--liftedCorners(--color)
+	RV-BoxShadow--drop(--color)
-	
+	RV-BoxShadow--solid(--color)
-	+RV-Block__Modifier()
-		RV-BoxShadow--levitating(--color)
-		
-	+RV-Block__Modifier()
-		RV-BoxShadow--stacked(--color)
-		
-	+RV-Block__Modifier()
-		RV-BoxShadow--drop(--color)
-		
-	+RV-Block__Modifier()
-		RV-BoxShadow--solid(--color)

components/02_Styles/elementList/_elementList.styl

@@ -1,5 +1,5 @@
 RV-ElementList__Item()
-	+RV-Element--name('Item')
+	+RV-Element()
 		RV-FlexRow__Item()
 
 RV-ElementList(break_width=500px)
@@ -11,5 +11,4 @@ RV-ElementList(break_width=500px)
 +RV-Block('RV-ElementList')
 	RV-ElementList()
 	
-	+RV-Element()
+	RV-ElementList__Item()
-		RV-ElementList__Item()

components/02_Styles/iconized/_iconized.styl

@@ -1,5 +1,5 @@
 RV-Iconized--extraSmall()
-	+RV-Block__Modifier--name('extraSmall')
+	+RV-Block--modifier()
 		+RV-Element('Icon')
 			width 1em
 			height 1em
@@ -7,7 +7,7 @@ RV-Iconized--extraSmall()
 			top .125em
 
 RV-Iconized--small()
-	+RV-Block__Modifier('small')
+	+RV-Block--modifier()
 		top -.25em
 		+RV-Element('Icon')
 			width 1.5em
@@ -16,7 +16,7 @@ RV-Iconized--small()
 			top .45em
 
 RV-Iconized--medium()
-	+RV-Block__Modifier--name('medium')
+	+RV-Block--modifier()
 		top -.5em
 		+RV-Element('Icon')
 			width 2em
@@ -25,7 +25,7 @@ RV-Iconized--medium()
 			top .625em
 
 RV-Iconized--large()
-	+RV-Block__Modifier--name('large')
+	+RV-Block--modifier()
 		top -1.03073em
 		+RV-Element('Icon')
 			width 3em
@@ -34,7 +34,7 @@ RV-Iconized--large()
 			top 1.15573em		
 
 RV-Iconized--huge()
-	+RV-Block__Modifier--name('huge')
+	+RV-Block--modifier()
 		top -2.05em
 		+RV-Element('Icon')
 			width 5em
@@ -43,7 +43,7 @@ RV-Iconized--huge()
 			top 2.175em
 
 RV-Iconized__Icon()
-	+RV-Element--name('Icon')
+	+RV-Element()
 		RV-Reset()
 
 RV-Iconized()
@@ -51,20 +51,12 @@ RV-Iconized()
 
 
 +RV-Block('RV-Iconized')
-	+RV-Element()
+	RV-Iconized()
-		RV-Iconized__Icon()
 	
-	+RV-Block__Modifier()
+	RV-Iconized__Icon()
-		RV-Iconized--extraSmall()
 		
-	+RV-Block__Modifier()
+	RV-Iconized--extraSmall()
-		RV-Iconized--small()
+	RV-Iconized--small()
-		
+	RV-Iconized--medium()
-	+RV-Block__Modifier()
+	RV-Iconized--large()
-		RV-Iconized--medium()
+	RV-Iconized--huge()
-		
-	+RV-Block__Modifier()
-		RV-Iconized--large()
-		
-	+RV-Block__Modifier()
-		RV-Iconized--huge()

components/02_Styles/spacing/_spacing.styl

@@ -1,5 +1,5 @@
 RV-Spacing__Outer--small()
-	+RV-Element__Modifier--name('small')
+	+RV-Element--modifier()
 		--outer-spacing spacing-small
 		margin var(--outer-spacing)
 		* > {
@@ -7,7 +7,7 @@ RV-Spacing__Outer--small()
 		}
 
 RV-Spacing__Outer--medium()
-	+RV-Element__Modifier--name('medium')
+	+RV-Element--modifier()
 		--outer-spacing spacing-medium
 		margin var(--outer-spacing)
 		* > {
@@ -15,14 +15,14 @@ RV-Spacing__Outer--medium()
 		}
 
 RV-Spacing__Outer--large()
-	+RV-Element__Modifier--name('large')		
+	+RV-Element--modifier()	
 		--outer-spacing spacing-large
 		margin var(--outer-spacing)
 		* > {
 			--outer-spacing 0
 		}
 RV-Spacing__Inner--small()
-	+RV-Element__Modifier--name('small')
+	+RV-Element--modifier()
 		--inner-spacing spacing-small
 		padding var(--inner-spacing)
 		gap var(--inner-spacing)
@@ -32,7 +32,7 @@ RV-Spacing__Inner--small()
 		}
 
 RV-Spacing__Inner--medium()
-	+RV-Element__Modifier--name('medium')
+	+RV-Element--modifier()
 		--inner-spacing spacing-medium
 		padding var(--inner-spacing)
 		gap var(--inner-spacing)
@@ -42,7 +42,7 @@ RV-Spacing__Inner--medium()
 		}
 
 RV-Spacing__Inner--large()
-	+RV-Element__Modifier--name('large')
+	+RV-Element--modifier()
 		--inner-spacing spacing-large
 		padding var(--inner-spacing)
 		gap var(--inner-spacing)
@@ -53,17 +53,11 @@ RV-Spacing__Inner--large()
 
 +RV-Block('RV-Spacing')
 	+RV-Element('Outer')
-		+RV-Element__Modifier()
+		RV-Spacing__Outer--small()
-			RV-Spacing__Outer--small()
+		RV-Spacing__Outer--medium()
-		+RV-Element__Modifier()
+		RV-Spacing__Outer--large()
-			RV-Spacing__Outer--medium()
-		+RV-Element__Modifier()	
-			RV-Spacing__Outer--large()
 
 	+RV-Element('Inner')
-		+RV-Element__Modifier()
+		RV-Spacing__Inner--small()
-			RV-Spacing__Inner--small()
+		RV-Spacing__Inner--medium()	
-		+RV-Element__Modifier()
+		RV-Spacing__Inner--large()
-			RV-Spacing__Inner--medium()
-		+RV-Element__Modifier()		
-			RV-Spacing__Inner--large()