smart_campus_uni/assets/styles/content/layout/flex.scss

@include b('flex') {
	display: flex;
	
	@include m('row') {
		flex-direction: row;
	}
	
	@include m('row-reverse') {
		flex-direction: row-reverse;
	}
	
	@include m('column') {
		flex-direction: column;
	}
	
	@include m('column-reverse') {
		flex-direction: column-reverse;
	}
	
	@include m('wrap') {
		flex-wrap: wrap;
	}
	
	@include m('wrap-reverse') {
		flex-wrap: wrap-reverse;
	}
	
	@each $a in ['between', 'around', 'center', 'start', 'end	'] {
		@if $a == 'between' or $a == 'around' {
			@include m('justify-#{$a}') {
				justify-content: space-#{$a};
			}
		} @else {
			@include m('justify-#{$a}') {
				justify-content: #{$a};
			}
		}
	}
	
	@each $a in ['stretch', 'center', 'start', 'end	', 'baseline'] {
		@if $a == 'start' or $a == 'end' {
			@include m('items-#{$a}') {
				align-items: flex-#{$a};
			}
		} @else {
			@include m('items-#{$a}') {
				align-items: #{$a};
			}
		}
	}
	
	@each $a in ['stretch', 'center', 'start', 'end	', 'between', 'around'] {
		@if $a == 'start' or $a == 'end' {
			@include m('align-#{$a}') {
				align-content: flex-#{$a};
			}
		} @else if $a == 'between' or $a == 'around'{
			@include m('align-#{$a}') {
				align-content: space-#{$a};
			}
		} @else {
			@include m('align-#{$a}') {
				align-content: #{$a};
			}
		}
	}
	
	@for $i from 1 through 24 {
		@include m(#{$i}) {
			flex: #{$i};
		}
	}
}