app/assets/stylesheets/flex_box.css.scss
.flex {
display: flex;
}
.full-width {
width: 100%;
}
.full-height {
height: 100%;
}
.full-v-width {
width: 100vw;
}
.full-v-height {
height: 100vh;
}
.column {
flex-direction: column;
}
.row {
flex-direction: row;
}
.wrap {
flex-wrap: wrap;
}
.relative {
position: relative;
}
.absolute {
position: absolute;
}
.top-0 {
top: 0
}
.left-0 {
left: 0;
}
.grow-1 {
flex-grow: 1;
}
.grow-2 {
flex-grow: 2;
}
.grow-3 {
flex-grow: 3;
}
.grow-4 {
flex-grow: 4;
}
.grow-5 {
flex-grow: 5;
}
.flex-1-0-auto {
flex: 1 0 auto;
}
.flex-0-1-auto {
flex: 0 1 auto;
}
.justify-content-center {
justify-content: center;
}
.justify-content-space-around {
justify-content: space-around;
}
.align-items-center {
align-items: center;
}
.flex-start {
align-items: flex-start;
}
.flex-end {
align-items: flex-end;
}
.baseline {
align-items: baseline;
}
.space-around {
justify-content: space-around;
}
.justify-flex-end {
justify-content: flex-end;
}
.auto-scroll-x {
overflow-x: auto;
}
.auto-scroll-y {
overflow-y: auto;
}
.row-reverse {
flex-direction: row-reverse;
}
.margin-0 {
margin: 0;
}
.display-none {
display: none;
}