Server : Apache System : Linux server2.corals.io 4.18.0-348.2.1.el8_5.x86_64 #1 SMP Mon Nov 15 09:17:08 EST 2021 x86_64 User : corals ( 1002) PHP Version : 7.4.33 Disable Function : exec,passthru,shell_exec,system Directory : /home/corals/www/wp-content/themes/dt-the7/css/ |
//vertical centering mixin
.vertical-centering {
top: 50%;
transform: translateY(-50%);
}
//horizontal centering mixin
.horizontal-centering {
left: 50%;
transform: translateX(-50%);
}
//horizontal & vertical centering mixin
.centering-mixin {
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
}
//border radius mixin
.static-border-radius (@radius: 50%) {
border-radius: @radius;
}
//box sizing mixin
.box-sizing (@string) {
box-sizing: @string;
}
// --------------------------------------------------
// Flexbox LESS mixins
// The spec: http://www.w3.org/TR/css3-flexbox
// --------------------------------------------------
// Flexbox display
// flex or inline-flex
.flex-display(@display: flex) {
display: ~"-ms-@{display}box"; // IE10 uses -ms-flexbox
display: ~"-ms-@{display}"; // IE11
display: @display;
}
// The 'flex' shorthand
// - applies to: flex items
// <positive-number>, initial, auto, or none
.flex(@columns: initial) {
-ms-flex: @columns;
flex: @columns;
}
// Flex Flow Direction
// - applies to: flex containers
// row | row-reverse | column | column-reverse
.flex-direction(@direction: row) {
-ms-flex-direction: @direction;
flex-direction: @direction;
}
// Flex Line Wrapping
// - applies to: flex containers
// nowrap | wrap | wrap-reverse
.flex-wrap(@wrap: nowrap) {
-ms-flex-wrap: @wrap;
flex-wrap: @wrap;
}
// Flex Direction and Wrap
// - applies to: flex containers
// <flex-direction> || <flex-wrap>
.flex-flow(@flow) {
-ms-flex-flow: @flow;
flex-flow: @flow;
}
// Display Order
// - applies to: flex items
// <integer>
.flex-order(@order: 0) {
-ms-flex-order: @order;
order: @order;
}
// Flex grow factor
// - applies to: flex items
// <number>
.flex-grow(@grow: 0) {
-ms-flex-positive: @grow;
-ms-flex-grow: @grow;
flex-grow: @grow;
}
// Flex shrink
// - applies to: flex item shrink factor
// <number>
.flex-shrink(@shrink: 1) {
-ms-flex-negative: @shrink;
-ms-flex-shrink: @shrink;
flex-shrink: @shrink;
}
// Flex basis
// - the initial main size of the flex item
// - applies to: flex itemsnitial main size of the flex item
// <width>
.flex-basis(@width: auto) {
-ms-flex-preferred-size: @width;
-ms-flex-basis: @width;
flex-basis: @width;
}
// Axis Alignment
// - applies to: flex containers
// flex-start | flex-end | center | space-between | space-around
.justify-content(@justify: flex-start) {
-ms-flex-pack: @justify;
-ms-justify-content: @justify;
justify-content: @justify;
}
// Packing Flex Lines
// - applies to: multi-line flex containers
// flex-start | flex-end | center | space-between | space-around | stretch
.align-content(@align: stretch) {
-ms-align-content: @align;
align-content: @align;
}
// Cross-axis Alignment
// - applies to: flex containers
// flex-start | flex-end | center | baseline | stretch
.align-items(@align: stretch) {
-ms-align-items: @align;
-ms-flex-align: @align;
align-items: @align;
}
// Cross-axis Alignment
// - applies to: flex items
// auto | flex-start | flex-end | center | baseline | stretch
.align-self(@align: auto) {
-ms-align-self: @align;
-ms-flex-item-align: @align;
align-self: @align;
}
/*! Prefix flex for IE10 in LESS
* https://gist.github.com/codler/2148ba4ff096a19f08ea
* Copyright (c) 2014 Han Lin Yap http://yap.nu; MIT license */
.display(@value) when (@value = flex) {
display: -ms-flexbox; // IE10
}
.display(@value) when (@value = inline-flex) {
display: -ms-inline-flexbox; // IE10
}
.display(@value) {
display: @value;
}
.ie-flex(@value) {
-ms-flex: @value;
}
.ie-flex-justify-content(@justifyContent) {
.ms-flex-justify-content(@justifyContent); // IE10
}
.ie-flex-align-content(@alignContent) {
.ms-flex-align-content(@alignContent); // IE10
}
.ie-flex-align-items(@alignItems) {
.ms-flex-align-items(@alignItems); // IE10
}
.ie-flex-align-self(@alignSelf) {
.ms-flex-align-self(@alignSelf); // IE10
}
.ie-flex-direction(@direction) {
-ms-flex-direction: @direction; // IE10
}
.ie-flex-order(@order) {
-ms-flex-order: @order; // IE10
}
.ie-flex-wrap(@wrap) {
.ms-flex-wrap(@wrap); // IE10
}
/* These are the conditional mixins for the different syntax for IE10 Flexbox */
.ms-flex-justify-content(@justifyContent) when (@justifyContent = space-between) {
-ms-flex-pack: justify;
}
.ms-flex-justify-content(@justifyContent) when (@justifyContent = space-around) {
-ms-flex-pack: distribute;
}
.ms-flex-justify-content(@justifyContent) when (@justifyContent = flex-start) {
-ms-flex-pack: start;
}
.ms-flex-justify-content(@justifyContent) when (@justifyContent = flex-end) {
-ms-flex-pack: end;
}
.ms-flex-justify-content(@justifyContent) when (@justifyContent = center) {
-ms-flex-pack: center;
}
.ms-flex-align-content(@alignContent) when (@alignContent = space-between) {
-ms-flex-line-pack: justify;
}
.ms-flex-align-content(@alignContent) when (@alignContent = space-around) {
-ms-flex-line-pack: distribute;
}
.ms-flex-align-content(@alignContent) when (@alignContent = flex-start) {
-ms-flex-line-pack: start;
}
.ms-flex-align-content(@alignContent) when (@alignContent = flex-end) {
-ms-flex-line-pack: end;
}
.ms-flex-align-content(@alignContent) when (@alignContent = center), (@alignContent = stretch) {
-ms-flex-line-pack: @alignContent;
}
.ms-flex-align-items(@alignItems) when (@alignItems = flex-start) {
-ms-flex-align: start;
}
.ms-flex-align-items(@alignItems) when (@alignItems = flex-end) {
-ms-flex-align: end;
}
.ms-flex-align-items(@alignItems) when (@alignItems = center), (@alignItems = baseline), (@alignItems = stretch) {
-ms-flex-align: @alignItems;
}
.ms-flex-align-self(@alignSelf) when (@alignSelf = flex-start) {
-ms-flex-item-align: start;
}
.ms-flex-align-self(@alignSelf) when (@alignSelf = flex-end) {
-ms-flex-item-align: end;
}
.ms-flex-align-self(@alignSelf) when (@alignSelf = auto), (@alignSelf = center), (@alignSelf = baseline), (@alignSelf = stretch) {
-ms-flex-item-align: @alignSelf;
}
.ms-flex-wrap(@wrap) when (@wrap = nowrap) {
-ms-flex-wrap: none;
}
.ms-flex-wrap(@wrap) when (@wrap = wrap), (@wrap = wrap-reverse) {
-ms-flex-wrap: @wrap;
}