42 lines
803 B
SCSS
42 lines
803 B
SCSS
|
/*!markdown
|
||
|
|
|
||
|
|
---
|
||
|
|
title: Flex Direction
|
||
|
|
---
|
||
|
|
|
||
|
|
| Class | Properties |
|
||
|
|
| ----------- | ------------------------ |
|
||
|
|
| flex-row | flex-direction: row |
|
||
|
|
| flex-row-reverse | flex-direction: row-reverse |
|
||
|
|
| flex-col | flex-direction: column |
|
||
|
|
| flex-col-reverse | flex-direction: column-reverse |
|
||
|
|
|
||
|
|
|
||
|
|
*/
|
||
|
|
|
||
|
|
@mixin make-flex-direction($prefix: '.') {
|
||
|
|
#{$prefix}flex-row {
|
||
|
|
flex-direction: row;
|
||
|
|
}
|
||
|
|
|
||
|
|
#{$prefix}flex-row-reverse {
|
||
|
|
flex-direction: row-reverse;
|
||
|
|
}
|
||
|
|
|
||
|
|
#{$prefix}flex-col {
|
||
|
|
flex-direction: column;
|
||
|
|
}
|
||
|
|
#{$prefix}flex-col-reverse {
|
||
|
|
flex-direction: column-reverse;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
@include make-flex-direction();
|
||
|
|
@each $deivce in map-keys($devices) {
|
||
|
|
@include media-device($deivce) {
|
||
|
|
@include make-flex-direction('.' + selector-escape($deivce + ':'));
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
// hover ?
|