?? GreyFile — Mystic File Browser

Current path: home/webdevt/www/wdp/wp-content/themes/quadric/assets/css/scss/



?? Go up: /home/webdevt/www/wdp/wp-content/themes/quadric/assets/css

?? Viewing: _mixins.scss

//layout mixins - start

@mixin edgtfTableLayout(){
    position: relative;
    display: table;
    table-layout: fixed;
    height: 100%;
    width: 100%;
}

@mixin edgtfTableCellLayout(){
    position: relative;
    display: table-cell;
    height: 100%;
    width: 100%;
    vertical-align: middle;
    text-align: center;
}

//layout mixins - end

//colors mixins - start

@mixin edgtfBackgroundColorOpacity($color, $opacity) {
    background-color: $color;
    background-color: rgba($color, $opacity);
}

//colors mixins end

//transition mixins - start

@mixin edgtfTransition($transition-param...) {
    -webkit-transition: $transition-param;
    transition: $transition-param;
}

@mixin edgtfTransform($transform-param...) {
    -webkit-transform: $transform-param;
    transform: $transform-param;
}

@mixin edgtfAnimation($animation-param...) {
	-webkit-animation: $animation-param;
	animation: $animation-param;
}

@mixin edgtfTransformOrigin($animation-param...) {
	-webkit-transform-origin: $animation-param;
    transform-origin: $animation-param;
}

@mixin edgtfBoxShadow($shadow-property...) {
    -webkit-box-shadow: $shadow-property;
    -moz-box-shadow: $shadow-property;
    box-shadow: $shadow-property;
}

@mixin edgtfBorderRadius($border-radius...) {
    -webkit-border-radius: $border-radius;
    -moz-border-radius: $border-radius;
    border-radius: $border-radius;
}

@mixin edgtfBoxSizing($box-sizing) {
    -webkit-box-sizing: $box-sizing;
    -moz-box-sizing: $box-sizing;
    box-sizing: $box-sizing;
}
//transition mixins - end

//media query mixins - start

@mixin laptop-landscape {
    @media only screen and (max-width: $laptop-landscape) {
        @content;
    }
}

@mixin ipad-landscape {
    @media only screen and (max-width: $ipad-landscape) {
        @content;
    }
}
@mixin ipad-landscape-min {
	@media only screen and (min-width: $ipad-landscape) {
		@content;
	}
}
@mixin ipad-portrait {
    @media only screen and (max-width: $ipad-portrait) {
        @content;
    }
}

@mixin phone-landscape {
    @media only screen and (max-width: $phone-landscape) {
        @content;
    }
}

@mixin phone-portrait {
    @media only screen and (max-width: $phone-portrait) {
        @content;
    }
}

@mixin smaller-phone-portrait {
    @media only screen and (max-width: $smaller-phone-portrait) {
        @content;
    }
}

//media query mixins - end

//animation mixin - start

@mixin keyframes($name) {
    @-webkit-keyframes #{$name} { @content };
    @keyframes #{$name} { @content };
}

@mixin animation ($name, $duration, $repeat, $timing, $delay) {
    -webkit-animation-name: $name;
    -webkit-animation-duration: $duration;
    -webkit-animation-iteration-count: $repeat;
    -webkit-animation-timing-function: $timing;
    -webkit-animation-delay: $delay;
    -webkit-animation-fill-mode: forwards; /* this prevents the animation from restarting! */

    animation-name: $name;
    animation-duration: $duration;
    animation-iteration-count: $repeat;
    animation-timing-function: $timing;
    animation-delay: $delay;
    animation-fill-mode: forwards; /* this prevents the animation from restarting! */
}

//animation mixin - end


??

??