57 lines
1.5 KiB
SCSS
57 lines
1.5 KiB
SCSS
@mixin ellipsis($width: 100px) {
|
|
max-width: $width;
|
|
white-space: nowrap;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
}
|
|
|
|
@mixin background-opacity($color: $white, $opacity: .3) {
|
|
background: rgba($color, $opacity);
|
|
}
|
|
|
|
// Table Flex - http://devbryce.com/site/flexbox/
|
|
@mixin table-flex($align-content: stretch, $align-items: stretch, $display: flex, $flex-direction: row, $flex-wrap: wrap, $justify-content: flex-start) {
|
|
align-content: $align-content;
|
|
align-items: $align-items;
|
|
display: $display;
|
|
flex-direction: $flex-direction;
|
|
flex-wrap: $flex-wrap;
|
|
justify-content: $justify-content;
|
|
}
|
|
|
|
@mixin table-flex-child($flex-grow: 1, $flex-basis: 300px, $flex-shrink: 0, $width:'') {
|
|
flex-basis: $flex-basis;
|
|
flex-grow: $flex-grow;
|
|
flex-shrink: $flex-shrink;
|
|
width: $flex-basis;
|
|
@if #{$width} != null {
|
|
width: #{$width};
|
|
}
|
|
}
|
|
|
|
@mixin box-shadow($h-shadow: 1px, $v-shadow: 1px, $blur: 15px, $spread: 6px, $color: rgba(0, 0, 0, .1)) {
|
|
box-shadow: $h-shadow $v-shadow $blur $spread $color;
|
|
}
|
|
|
|
@mixin clearfix {
|
|
&:after {
|
|
clear: both;
|
|
content: '';
|
|
display: table;
|
|
}
|
|
}
|
|
|
|
@mixin slide($max, $overflow, $min: 0) {
|
|
@include transition(max-height .5s ease-in);
|
|
max-height: $min;
|
|
#{$overflow}: hidden;
|
|
&.open {
|
|
@include transition(max-height .5s ease-in);
|
|
max-height: $max;
|
|
}
|
|
}
|
|
|
|
@mixin background($red: 255, $green: 255, $blue: 255, $opacity: 1) {
|
|
background: rgba($red, $green, $blue, $opacity);
|
|
}
|