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/old/vendor/magento/magento2-base/lib/web/css/source/lib/ |
// /**
// * Copyright © Magento, Inc. All rights reserved.
// * See COPYING.txt for license details.
// */
//
// Utilities
// _____________________________________________
//
// Convert values to unit specified in typography variables
// ---------------------------------------------
.lib-font-size-value(
@_value
) when not (@_value = false) and not (@_value = '') and (@font-size-unit-convert) {
@fontValue: unit(((@_value) * 1), @font-size-unit) / @font-size-unit-ratio;
}
.lib-font-size-value(
@_value
) when (@font-size-unit-convert = false) {
@fontValue: @_value;
}
.lib-visibility-hidden() {
height: 0;
visibility: hidden;
}
.lib-visually-hidden() {
border: 0;
clip: rect(0, 0, 0, 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
.lib-visually-hidden-reset() {
clip: auto;
height: auto;
margin: 0;
overflow: visible;
position: static;
width: auto;
}
//
// Clearfix
// ---------------------------------------------
.lib-clearfix() {
&:before,
&:after {
content: '';
display: table;
}
&:after {
clear: both;
}
}
.lib-clearer() {
&:after {
clear: both;
content: '';
display: table;
}
}
//
// Gradient
// ---------------------------------------------
#lib-gradient {
// Horizontal gradient, from left to right
// Creates two color stops, start and end, by specifying a color and position for each color stop.
// Color stops are not available in IE9 and below.
// Filters are enabled
.horizontal(
@_start-color,
@_end-color,
@_start-percent: 0%,
@_end-percent: 100%,
@_background-color-position: true
) when not (@disable-filters) and (@_background-color-position = true) {
background-color: @_end-color;
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(left, color-stop(@_start-color @_start-percent), color-stop(@_end-color @_end-percent)); // Safari 5.1-6, Chrome 10+
background-image: linear-gradient(to right, @_start-color @_start-percent, @_end-color @_end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)", @_start-color, @_end-color)); // IE9 and down
}
.horizontal(
@_start-color,
@_end-color,
@_start-percent: 0%,
@_end-percent: 100%,
@_background-color-position: true
) when not (@disable-filters) and (@_background-color-position = false) {
background-color: @_start-color;
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(left, color-stop(@_start-color @_start-percent), color-stop(@_end-color @_end-percent)); // Safari 5.1-6, Chrome 10+
background-image: linear-gradient(to right, @_start-color @_start-percent, @_end-color @_end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=1)", @_start-color, @_end-color)); // IE9 and down
}
// Horizontal gradient, from left to right
// Creates two color stops, start and end, by specifying a color and position for each color stop.
// Color stops are not available in IE9 and below.
// Filters are disabled
.horizontal(
@_start-color,
@_end-color,
@_start-percent: 0%,
@_end-percent: 100%,
@_background-color-position: true
) when (@disable-filters) and (@_background-color-position = true) {
background-color: @_end-color;
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(left, color-stop(@_start-color @_start-percent), color-stop(@_end-color @_end-percent)); // Safari 5.1-6, Chrome 10+
background-image: linear-gradient(to right, @_start-color @_start-percent, @_end-color @_end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
}
.horizontal(
@_start-color,
@_end-color,
@_start-percent: 0%,
@_end-percent: 100%,
@_background-color-position: true
) when (@disable-filters) and (@_background-color-position = false) {
background-color: @_start-color;
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(left, color-stop(@_start-color @_start-percent), color-stop(@_end-color @_end-percent)); // Safari 5.1-6, Chrome 10+
background-image: linear-gradient(to right, @_start-color @_start-percent, @_end-color @_end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
}
// Vertical gradient, from top to bottom
// Creates two color stops, start and end, by specifying a color and position for each color stop.
// Color stops are not available in IE9 and below.
// Filters are enabled
.vertical(
@_start-color,
@_end-color,
@_start-percent: 0%,
@_end-percent: 100%,
@_background-color-position: true
) when not (@disable-filters) and (@_background-color-position = true) {
background-color: @_end-color;
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(top, @_start-color @_start-percent, @_end-color @_end-percent); // Safari 5.1-6, Chrome 10+
background-image: linear-gradient(to bottom, @_start-color @_start-percent, @_end-color @_end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)", @_start-color, @_end-color)); // IE9 and down
}
.vertical(
@_start-color,
@_end-color,
@_start-percent: 0%,
@_end-percent: 100%,
@_background-color-position: true
) when not (@disable-filters) and (@_background-color-position = false) {
background-color: @_start-color;
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(top, @_start-color @_start-percent, @_end-color @_end-percent); // Safari 5.1-6, Chrome 10+
background-image: linear-gradient(to bottom, @_start-color @_start-percent, @_end-color @_end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
filter: e(%("progid:DXImageTransform.Microsoft.gradient(startColorstr='%d', endColorstr='%d', GradientType=0)", @_start-color, @_end-color)); // IE9 and down
}
// Vertical gradient, from top to bottom
// Creates two color stops, start and end, by specifying a color and position for each color stop.
// Color stops are not available in IE9 and below.
// Filters are disabled
.vertical(
@_start-color,
@_end-color,
@_start-percent: 0%,
@_end-percent: 100%,
@_background-color-position: true
) when (@disable-filters) and (@_background-color-position = true) {
background-color: @_end-color;
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(top, @_start-color @_start-percent, @_end-color @_end-percent); // Safari 5.1-6, Chrome 10+
background-image: linear-gradient(to bottom, @_start-color @_start-percent, @_end-color @_end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
}
.vertical(
@_start-color,
@_end-color,
@_start-percent: 0%,
@_end-percent: 100%,
@_background-color-position: true
) when (@disable-filters) and (@_background-color-position = false) {
background-color: @_start-color;
background-repeat: repeat-x;
background-image: -webkit-linear-gradient(top, @_start-color @_start-percent, @_end-color @_end-percent); // Safari 5.1-6, Chrome 10+
background-image: linear-gradient(to bottom, @_start-color @_start-percent, @_end-color @_end-percent); // Standard, IE10, Firefox 16+, Opera 12.10+, Safari 7+, Chrome 26+
}
}
//
// Custom background gradient
// ---------------------------------------------
// Pager gradient - horizontal
.lib-background-gradient(
@_background-gradient-color-start,
@_background-gradient-color-end,
@_background-gradient-direction,
@_background-gradient,
@_background-gradient-color-position: true
) when (@_background-gradient-direction = horizontal) and (@_background-gradient = true) {
#lib-gradient > .horizontal(
@_start-color: @_background-gradient-color-start,
@_end-color: @_background-gradient-color-end,
@_background-color-position: @_background-gradient-color-position
);
}
// Pager gradient - vertical
.lib-background-gradient(
@_background-gradient-color-start,
@_background-gradient-color-end,
@_background-gradient-direction,
@_background-gradient,
@_background-gradient-color-position: true
) when (@_background-gradient-direction = vertical) and (@_background-gradient = true) {
#lib-gradient > .vertical(
@_start-color: @_background-gradient-color-start,
@_end-color: @_background-gradient-color-end,
@_background-color-position: @_background-gradient-color-position
);
}
//
// Rotate
// ---------------------------------------------
.lib-rotate(@_rotation) {
-webkit-transform: rotate(@_rotation); // Use in 8 Safari
-ms-transform: rotate(@_rotation); // Use in 9 IE
transform: rotate(@_rotation);
}
//
// Remove spaces between elements with display: inline-block
// ---------------------------------------------
.lib-inline-block-space-container() {
font-size: 0;
letter-spacing: -1px;
line-height: 0;
}
.lib-inline-block-space-item(
@_font-size: @font-size__base,
@_line-height: normal
) {
.lib-font-size(@_font-size);
.lib-line-height(@_line-height);
letter-spacing: normal;
}
//
// Add any css property
// ---------------------------------------------
.lib-css(
@_property,
@_value,
@_prefix: 0
) when (@_prefix = 1)
and not (@_value = '')
and not (@_value = false)
and not (extract(@_value, 1) = false)
and not (extract(@_value, 2) = false)
and not (extract(@_value, 3) = false)
and not (extract(@_value, 4) = false)
and not (extract(@_value, 5) = false) {
-webkit-@{_property}: @_value;
-moz-@{_property}: @_value;
-ms-@{_property}: @_value;
}
.lib-css(
@_property,
@_value,
@_prefix: 0
) when not (@_value = '')
and not (@_value = false)
and not (extract(@_value, 1) = false)
and not (extract(@_value, 2) = false)
and not (extract(@_value, 3) = false)
and not (extract(@_value, 4) = false)
and not (extract(@_value, 5) = false) {
@{_property}: @_value;
}
//
// Add url to property
// ---------------------------------------------
// usage:
// .column.left {
// .lib-url('images/fallback.png');
// background:url("@{url}") repeat-y;
// }
// .columns {
// .lib-url('images/fallback.png', 'Magento_Catalog');
// background:url("@{url}") repeat;
// }
@urls-resolved: false;
.lib-url(@_path) {
@url: "@{baseDir}@{_path}";
}
.lib-url(
@_path,
@_module
) when not (@_module = false) and not (@_module = '') and (@urls-resolved = false) {
@url: "@{_module}::@{_path}";
}
.lib-url(
@_path,
@_module
) when not (@_module = false) and not (@_module = '') and (@urls-resolved = true) {
@url: "@{baseDir}@{_module}/@{_path}";
}
//
// Arrow
// ---------------------------------------------
.lib-arrow(
@_position,
@_size,
@_color
) {
border: @_size solid transparent;
height: 0;
width: 0;
._lib-abbor_el(@_position, @_color);
}
._lib-abbor_el(
@_position,
@_color
) when (@_position = left) {
.lib-css(border-right-color, @_color);
}
._lib-abbor_el(
@_position,
@_color
) when (@_position = right) {
.lib-css(border-left-color, @_color);
}
._lib-abbor_el(
@_position,
@_color
) when (@_position = up) {
.lib-css(border-bottom-color, @_color);
}
._lib-abbor_el(
@_position,
@_color
) when (@_position = down) {
.lib-css(border-top-color, @_color);
}
//
// Input placeholder
// ---------------------------------------------
.lib-input-placeholder(
@_input-placeholder-color: @form-element-input-placeholder__color,
@_input-placeholder-font-weight: @form-element-input__font-weight
) {
&::-webkit-input-placeholder {
.lib-css(color, @_input-placeholder-color);
.lib-css(font-weight, @_input-placeholder-font-weight);
}
&:-moz-placeholder {
.lib-css(color, @_input-placeholder-color);
.lib-css(font-weight, @_input-placeholder-font-weight);
}
&::-moz-placeholder {
.lib-css(color, @_input-placeholder-color);
.lib-css(font-weight, @_input-placeholder-font-weight);
}
&:-ms-input-placeholder {
.lib-css(color, @_input-placeholder-color);
.lib-css(font-weight, @_input-placeholder-font-weight);
}
}
//
// Flex layout
// ---------------------------------------------
.lib-vendor-prefix-display(
@_value: flex
) {
display: ~"-webkit-@{_value}";
display: ~"-ms-@{_value}box";
display: @_value;
}
.lib-vendor-prefix-flex-grow(
@_value: 0
) {
-webkit-flex-grow: @_value;
flex-grow: @_value;
}
.lib-vendor-prefix-flex-shrink (
@_value: 1
) {
-webkit-flex-shrink: @_value;
flex-shrink: @_value;
}
.lib-vendor-prefix-flex-basis (
@_value: auto
) {
-webkit-flex-basis: @_value;
flex-basis: @_value;
}
.lib-vendor-prefix-flex-wrap (
@_value: wrap
) {
-webkit-flex-wrap: @_value;
flex-wrap: @_value;
}
.lib-vendor-prefix-flex-direction (
@_value: column
) {
-webkit-flex-direction: @_value;
-ms-flex-direction: @_value;
flex-direction: @_value;
}
.lib-vendor-prefix-order (
@_value: 0
) {
-ms-flex-order: @_value;
-webkit-order: @_value;
order: @_value;
}
.lib-vendor-box-align (
@_value: stretch
) {
-webkit-align-items: @_value;
-ms-align-items: @_value;
align-items: @_value;
}
.lib-vendor-prefix-appearance (
@value: none
) {
-webkit-appearance: @value;
-moz-appearance: @value;
appearance: @value;
}
.lib-vendor-prefix-column-count (
@_value
) {
-webkit-column-count: @_value;
-moz-column-count: @_value;
column-count: @_value;
}
//
// Pointer for popups or dropdowns
// ---------------------------------------------
.lib-pointer(
@_size: 6px,
@_background-color: @color-white,
@_border-color: @color-gray-light3,
@_position__vertical: top,
@_position__horizontal: left,
@_position__vertical__value: -12px,
@_position__horizontal__value: @indent__s,
@_z-index: 99
) {
&:before,
&:after {
content: '';
position: absolute;
display: block;
width: 0;
height: 0;
border-bottom-style: solid;
}
&:before {
.lib-css(@_position__horizontal, @_position__horizontal__value);
.lib-css(@_position__vertical, @_position__vertical__value);
.lib-css(border, solid @_size - 1);
.lib-css(border-color, transparent transparent @_background-color transparent);
.lib-css(z-index, @_z-index);
}
&:after {
.lib-css(@_position__horizontal, @_position__horizontal__value - 1);
.lib-css(@_position__vertical, @_position__vertical__value - 2);
.lib-css(border, solid @_size);
.lib-css(border-color, transparent transparent @_border-color transparent);
.lib-css(z-index, @_z-index - 1);
}
}