More mixins

components/01_Layouts/flexRow/_flexRow.scss

@@ -1,45 +1,85 @@
+
+@mixin RV-FlexRow__Container--column {
+	display: flex;
+	flex-direction: column;
+}
+
+@mixin RV-FlexRow__Container--multiRow {
+	flex-wrap: wrap;
+}
+
 @mixin RV-FlexRow__Container {
 	display: flex;
 	flex-direction: row;
 	justify-content: space-around;
 
 	&--multiRow {
-		flex-wrap: wrap;
+		@include RV-FlexRow__Container--multiRow;
 	}
+
+	&--column {
+		@include RV-FlexRow__Container--column;
+	}
+}
+
+@mixin RV-FlexRow__Item--normal {
+	flex-grow: 3;
+	flex-shrink: 3;
+}
+
+@mixin RV-FlexRow__Item--narrower {
+	flex-grow: 1;
+	flex-shrink: 5;
+}
+
+@mixin RV-FlexRow__Item--narrow {
+	flex-grow: 2;
+	flex-shrink: 4;
+}
+
+@mixin RV-FlexRow__Item--wide {
+	flex-grow: 4;
+	flex-shrink: 2;
+}
+@mixin RV-FlexRow__Item--wider {
+	flex-grow: 5;
+	flex-shrink: 1;
+}
+@mixin RV-FlexRow__Item--fixedSize($-width: 100px) {
+	flex-grow: 0;
+	flex-shrink: 0;
+	width: min-content;
+	flex-basis: $-width;
 }
 
 @mixin RV-FlexRow__Item {
 	@include RV-Alignment;
 
+	min-width: 0;
+	width: 100%;
+
 	&,&--normal {
-		flex-grow: 3;
-		flex-shrink: 3;
+		@include RV-FlexRow__Item--normal;
 	}
 
 	&--narrower {
-		flex-grow: 1;
-		flex-shrink: 5;
+		@include RV-FlexRow__Item--narrower;
 	}
 
 	&--narrow {
-		flex-grow: 2;
-		flex-shrink: 4;
+		@include RV-FlexRow__Item--narrow;
 	}
 
 	&--wide {
-		flex-grow: 4;
-		flex-shrink: 2;
+		@include RV-FlexRow__Item--wide;
 	}
 
 	&--wider {
-		flex-grow: 5;
-		flex-shrink: 1;
+		@include RV-FlexRow__Item--wider;
 	}
 
 	&--fixedSize {
-		flex-grow: 0;
-		flex-shrink: 0;
-		width: min-content;
+		@include RV-FlexRow__Item--fixedSize;
 	}
 }
 

components/01_Layouts/fullWidthContent/_fullWidthContent.scss

@@ -1,11 +1,19 @@
+@mixin RV-FullWidthContent__Container {
+	width: 100%;
+}
+
+@mixin RV-FullWidthContent__Item {
+	width: 100%;
+        @include RV-ContentCrop;
+}
+
 @mixin RV-FullWidthContent {
     &__Container {
-        width: 100%;
+        @include RV-FullWidthContent__Container;
     }
 
     &__Item {
-        width: 100%;
-        @include RV-ContentCrop;
+		@include RV-FullWidthContent__Item;
     }
 }