@mixin RV-FlexRow__Container { display: flex; flex-direction: row; justify-content: space-around; &--multiRow { flex-wrap: wrap; } } @mixin RV-FlexRow__Item { @include RV-Alignment; &,&--normal { flex-grow: 3; flex-shrink: 3; } &--narrower { flex-grow: 1; flex-shrink: 5; } &--narrow { flex-grow: 2; flex-shrink: 4; } &--wide { flex-grow: 4; flex-shrink: 2; } &--wider { flex-grow: 5; flex-shrink: 1; } &--fixedSize { flex-grow: 0; flex-shrink: 0; width: min-content; } } @mixin RV-FlexRow { &__Container { @include RV-FlexRow__Container; } &__Item { @include RV-FlexRow__Item; } } .RV-FlexRow{ @include RV-FlexRow; }