in projects/libs/flex-layout/flex/layout-align/layout-align.ts [29:97]
buildStyles(align: string, parent: LayoutAlignParent) {
const css: StyleDefinition = {}, [mainAxis, crossAxis] = align.split(' ');
// Main axis
switch (mainAxis) {
case 'center':
css['justify-content'] = 'center';
break;
case 'space-around':
css['justify-content'] = 'space-around';
break;
case 'space-between':
css['justify-content'] = 'space-between';
break;
case 'space-evenly':
css['justify-content'] = 'space-evenly';
break;
case 'end':
case 'flex-end':
css['justify-content'] = 'flex-end';
break;
case 'start':
case 'flex-start':
default :
css['justify-content'] = 'flex-start'; // default main axis
break;
}
// Cross-axis
switch (crossAxis) {
case 'start':
case 'flex-start':
css['align-items'] = css['align-content'] = 'flex-start';
break;
case 'center':
css['align-items'] = css['align-content'] = 'center';
break;
case 'end':
case 'flex-end':
css['align-items'] = css['align-content'] = 'flex-end';
break;
case 'space-between':
css['align-content'] = 'space-between';
css['align-items'] = 'stretch';
break;
case 'space-around':
css['align-content'] = 'space-around';
css['align-items'] = 'stretch';
break;
case 'baseline':
css['align-content'] = 'stretch';
css['align-items'] = 'baseline';
break;
case 'stretch':
default : // 'stretch'
css['align-items'] = css['align-content'] = 'stretch'; // default cross axis
break;
}
return extendObject(css, {
'display' : parent.inline ? 'inline-flex' : 'flex',
'flex-direction' : parent.layout,
'box-sizing' : 'border-box',
'max-width': crossAxis === 'stretch' ?
!isFlowHorizontal(parent.layout) ? '100%' : null : null,
'max-height': crossAxis === 'stretch' ?
isFlowHorizontal(parent.layout) ? '100%' : null : null,
}) as StyleDefinition;
}