itcss/assets/tools/_flexbox.css

CSS starter boilerplate based on the ITCSS pattern

@define-mixin flex $align: stretch, $justify: flex-start, $wrap: nowrap, $direction: row, $display: flex {
	display: $display;
	flex-flow: $direction $wrap;
	align-items: $align;
	justify-content: $justify;
}

@define-mixin flex-row $wrap: nowrap, $align: stretch, $justify: flex-start {
	@mixin flex $align, $justify, $wrap;
}

@define-mixin flex-column $wrap: nowrap, $align: stretch, $justify: flex-start {
	@mixin flex $align, $justify, $wrap, column;
}

@define-mixin inline-flex-row $wrap: nowrap, $align: stretch, $justify: flex-start {
	@mixin flex $align, $justify, $wrap, row, inline-flex;
}

@define-mixin inline-flex-column $wrap: nowrap, $align: stretch, $justify: flex-start {
	@mixin flex $align, $justify, $wrap, column, inline-flex;
}

@define-mixin flex-row-center $wrap: nowrap {
	@mixin flex-row $wrap, center, center;
}

@define-mixin flex-column-center $wrap: nowrap {
	@mixin flex-column $wrap, center, center;
}