avives
1f72193a64
Some checks are pending
Module sub-split / Sub-split (push) Waiting to run
- Base: wintercms/winter branch 1.2 (full framework) - Theme vivespos: Canvas 7 + Bootstrap 5 CDN, custom CSS - Layout: deferred GTM/GA4 tracking, JSON-LD SoftwareApplication - Partials: hero (offline-first), features, modes (offline/nube toggle), screenshots, pricing (3 planes), comparison, FAQ, CTA - Plugin VivesPOS.Site with ContactForm - Dockerfile: PHP 8.2 Apache, port 80, healthcheck - Added winter/wn-pages, blog, sitemap, seo plugins - Active theme set to vivespos
165 lines
4.0 KiB
Plaintext
165 lines
4.0 KiB
Plaintext
// --------------------------------------------------
|
|
// Flexbox LESS mixins
|
|
// The spec: http://www.w3.org/TR/css3-flexbox
|
|
// --------------------------------------------------
|
|
|
|
// Flexbox display
|
|
// flex or inline-flex
|
|
.flex-display() {
|
|
display: ~"-webkit-box";
|
|
display: ~"-webkit-flex";
|
|
display: ~"-moz-flex";
|
|
display: ~"-ms-flexbox"; // IE10 uses -ms-flexbox
|
|
display: ~"-ms-flex"; // IE11
|
|
display: flex;
|
|
}
|
|
|
|
// The 'flex: 0 0 auto' shorthand
|
|
.flex-fix() {
|
|
-webkit-box-flex: 0;
|
|
-webkit-flex: 0 0 auto;
|
|
-moz-flex: 0 0 auto;
|
|
-ms-flex: 0 0 auto;
|
|
flex: 0 0 auto;
|
|
}
|
|
|
|
// The 'flex: 1 1 auto' shorthand
|
|
.flex-stretch() {
|
|
-webkit-box-flex: 1;
|
|
-webkit-flex: 1 1 auto;
|
|
-moz-flex: 1 1 auto;
|
|
-ms-flex: 1 1 auto;
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
// The 'flex: 1' shorthand
|
|
.flex-stretch-constrain() {
|
|
-webkit-box-flex: 1;
|
|
-webkit-flex: 1;
|
|
-moz-flex: 1;
|
|
-ms-flex: 1;
|
|
flex: 1;
|
|
}
|
|
|
|
// Flex Flow Direction Column
|
|
// - applies to: flex containers
|
|
.flex-direction-column() {
|
|
-webkit-flex-direction: column;
|
|
-moz-flex-direction: column;
|
|
-webkit-box-orient: vertical;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
}
|
|
|
|
// Flex Flow Direction Row
|
|
// - applies to: flex containers
|
|
.flex-direction-row() {
|
|
-webkit-flex-direction: row;
|
|
-moz-flex-direction: row;
|
|
-webkit-box-orient: horizontal;
|
|
-ms-flex-direction: row;
|
|
flex-direction: row;
|
|
}
|
|
|
|
// Flex Line Wrapping
|
|
// - applies to: flex containers
|
|
// nowrap | wrap | wrap-reverse
|
|
.flex-wrap(@wrap: nowrap) {
|
|
-webkit-flex-wrap: @wrap;
|
|
-moz-flex-wrap: @wrap;
|
|
-ms-flex-wrap: @wrap;
|
|
flex-wrap: @wrap;
|
|
}
|
|
|
|
// Flex Direction and Wrap
|
|
// - applies to: flex containers
|
|
// <flex-direction> || <flex-wrap>
|
|
.flex-flow(@flow) {
|
|
-webkit-flex-flow: @flow;
|
|
-moz-flex-flow: @flow;
|
|
-ms-flex-flow: @flow;
|
|
flex-flow: @flow;
|
|
}
|
|
|
|
// Display Order
|
|
// - applies to: flex items
|
|
// <integer>
|
|
.flex-order(@order: 0) {
|
|
-webkit-order: @order;
|
|
-moz-order: @order;
|
|
-ms-order: @order;
|
|
order: @order;
|
|
}
|
|
|
|
// Flex grow factor
|
|
// - applies to: flex items
|
|
// <number>
|
|
.flex-grow(@grow: 0) {
|
|
-webkit-flex-grow: @grow;
|
|
-moz-flex-grow: @grow;
|
|
-ms-flex-grow: @grow;
|
|
flex-grow: @grow;
|
|
}
|
|
|
|
// Flex shr
|
|
// - applies to: flex itemsink factor
|
|
// <number>
|
|
.flex-shrink(@shrink: 1) {
|
|
-webkit-flex-shrink: @shrink;
|
|
-moz-flex-shrink: @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) {
|
|
-webkit-flex-basis: @width;
|
|
-moz-flex-basis: @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) {
|
|
-webkit-justify-content: @justify;
|
|
-moz-justify-content: @justify;
|
|
-ms-justify-content: @justify;
|
|
-webkit-box-pack: @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) {
|
|
-webkit-align-content: @align;
|
|
-moz-align-content: @align;
|
|
-webkit-box-align: @align;
|
|
-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) {
|
|
-webkit-align-items: @align;
|
|
-moz-align-items: @align;
|
|
-ms-align-items: @align;
|
|
align-items: @align;
|
|
}
|
|
|
|
// Cross-axis Alignment
|
|
// - applies to: flex items
|
|
// auto | flex-start | flex-end | center | baseline | stretch
|
|
.align-self(@align: auto) {
|
|
-webkit-align-self: @align;
|
|
-moz-align-self: @align;
|
|
-ms-align-self: @align;
|
|
align-self: @align;
|
|
} |