diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_actions-bar.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_actions-bar.less
index 9f96776a6c902..640a508b9dddb 100644
--- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_actions-bar.less
+++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_actions-bar.less
@@ -72,7 +72,7 @@
&.action-back {
// ToDo UI: Should be changed to ._back
float: left;
- .vendor-prefix-order(-1);
+ .mixin-vendor-prefix-order(-1);
&:before {
&:extend(.abs-icon all);
content: @icon-back-arrow__content;
@@ -86,24 +86,24 @@
// ToDo UI: Should be changed to .action-primary
&:extend(.abs-action-primary all);
&:extend(.abs-action-l all);
- .vendor-prefix-order(2);
+ .mixin-vendor-prefix-order(2);
}
&.save {
// ToDo UI: Should be changed to ._save
&:not(.primary) {
- .vendor-prefix-order(1);
+ .mixin-vendor-prefix-order(1);
}
}
&.delete {
// ToDo UI: Should be changed to ._delete
- .vendor-prefix-order(-1);
+ .mixin-vendor-prefix-order(-1);
}
}
.actions-split {
&:extend(.abs-actions-split-xl all);
float: right;
margin-left: @_page-action__indent;
- .vendor-prefix-order(2);
+ .mixin-vendor-prefix-order(2);
.dropdown-menu {
.item {
display: block;
@@ -115,7 +115,7 @@
.page-actions-buttons {
float: right;
justify-content: flex-end;
- .vendor-prefix-display(flex);
+ .mixin-vendor-prefix-display(flex);
.customer-index-edit & {
background-color: transparent;
}
diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_page-nav.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_page-nav.less
index 20f9fd8ed9709..067571bf5f086 100644
--- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_page-nav.less
+++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/_page-nav.less
@@ -282,7 +282,7 @@
z-index: 2;
&:after,
&:before {
- .arrow(
+ .mixin-arrow(
@_position: down,
@_size: 15px,
@_color: @admin__page-nav-tooltip__background
diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/actions-bar/_store-switcher.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/actions-bar/_store-switcher.less
index 7e9d32a3b53f1..7d2d2d0653f71 100644
--- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/actions-bar/_store-switcher.less
+++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/main/actions-bar/_store-switcher.less
@@ -217,7 +217,7 @@
font-size: 1.7rem;
}
span {
- .visually-hidden();
+ .mixin-visually-hidden();
}
}
a {
diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/pages/_dashboard.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/pages/_dashboard.less
index ed511e65dfcb8..3f72170b3eff0 100644
--- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/pages/_dashboard.less
+++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/pages/_dashboard.less
@@ -169,7 +169,7 @@
margin-bottom: 0;
position: relative;
&:before {
- .background-gradient(
+ .mixin-background-gradient(
@_background-gradient: true,
@_background-gradient-direction: horizontal,
@_background-gradient-color-start: rgba(255,255,255,0),
diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/pages/_login.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/pages/_login.less
index 8291e266f89ff..a0813b2231d64 100644
--- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/pages/_login.less
+++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/pages/_login.less
@@ -26,12 +26,12 @@
// Login box
.page-layout-admin-login {
align-items: center;
- .vendor-prefix-display(flex);
+ .mixin-vendor-prefix-display(flex);
background-color: @login-page__background-color;
padding: 2rem 0 20rem;
.page-wrapper {
- .vendor-prefix-flex-shrink(0);
- .vendor-prefix-flex-grow(0);
+ .mixin-vendor-prefix-flex-shrink(0);
+ .mixin-vendor-prefix-flex-grow(0);
background-color: @login-box__background-color;
border: @login-box__border;
box-shadow: @login-box__shadow;
diff --git a/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module.less b/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module.less
index f2d8d81ac9378..93df1df5887d9 100644
--- a/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module.less
+++ b/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module.less
@@ -4,7 +4,7 @@
// */
.product-actions {
- .clearfix();
+ .mixin-clearfix();
.switcher {
float: right;
}
diff --git a/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/components/navigation-bar/_navigation-bar.less b/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/components/navigation-bar/_navigation-bar.less
index e8736ed6f3c68..09f2451f8829b 100644
--- a/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/components/navigation-bar/_navigation-bar.less
+++ b/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/components/navigation-bar/_navigation-bar.less
@@ -85,7 +85,7 @@
// Progress line tunnel
&:before {
- .background-gradient( @_background-gradient: true, @_background-gradient-direction: vertical, @_background-gradient-color-start: @color-gray82, @_background-gradient-color-end: @color-gray83 );
+ .mixin-background-gradient( @_background-gradient: true, @_background-gradient-direction: vertical, @_background-gradient-color-start: @color-gray82, @_background-gradient-color-end: @color-gray83 );
border-bottom: 1px solid @nav-bar-bullet-wrap__border-bottom-color;
border-top: 1px solid @nav-bar-bullet-wrap__border-top-color;
content: '';
diff --git a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module.less b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module.less
index 3e1c86ab7f8b8..3f70b79c6bbef 100644
--- a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module.less
+++ b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module.less
@@ -166,7 +166,7 @@
.pager {
text-align: left;
padding-bottom: 10px;
- .clearfix();
+ .mixin-clearfix();
[data-part=left] {
display: inline-block;
width: 45%;
@@ -208,7 +208,7 @@
text-align: center;
}
.actions-split {
- .clearfix();
+ .mixin-clearfix();
display: inline-block;
position: relative;
z-index: 100;
@@ -257,7 +257,7 @@
}
}
> span {
- .visually-hidden();
+ .mixin-visually-hidden();
}
}
}
diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/components/_navigation-bar.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/components/_navigation-bar.less
index ae48a2e9dc1b4..18920ed38b86a 100644
--- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/components/_navigation-bar.less
+++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/components/_navigation-bar.less
@@ -92,7 +92,7 @@
// Progress line tunnel
&:before {
- .background-gradient( @_background-gradient: true, @_background-gradient-direction: vertical, @_background-gradient-color-start: @color-gray82, @_background-gradient-color-end: @color-gray83 );
+ .mixin-background-gradient( @_background-gradient: true, @_background-gradient-direction: vertical, @_background-gradient-color-start: @color-gray82, @_background-gradient-color-end: @color-gray83 );
border-bottom: 1px solid @nav-bar-bullet-wrap__border-bottom-color;
border-top: 1px solid @nav-bar-bullet-wrap__border-top-color;
content: '';
diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/_buttons.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/_buttons.less
index d6a76f09a9929..1d2dbd1c30f64 100644
--- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/_buttons.less
+++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/_buttons.less
@@ -102,7 +102,7 @@
color: @btn-prime__color;
text-shadow: 1px 1px 0 rgba(0, 0, 0, .25);
&:hover {
- .background-gradient(
+ .mixin-background-gradient(
@_background-gradient: true,
@_background-gradient-direction: horizontal,
@_background-gradient-color-start: @btn-prime__color-gradient-start,
@@ -111,7 +111,7 @@
color: @btn-prime__color;
}
&:active {
- .background-gradient(
+ .mixin-background-gradient(
@_background-gradient: true,
@_background-gradient-direction: horizontal,
@_background-gradient-color-start: @btn-prime__color-gradient-end,
diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/_extends.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/_extends.less
index 29b9ac3a7ea31..3676aefbe4050 100644
--- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/_extends.less
+++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/_extends.less
@@ -6,7 +6,7 @@
// Clearfix
.abs-clearer {
- .clearer();
+ .mixin-clearer();
}
.extend__clearer() {
diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_checkbox-radio.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_checkbox-radio.less
index f744e9147b093..3edb71c12c18d 100644
--- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_checkbox-radio.less
+++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_checkbox-radio.less
@@ -20,7 +20,7 @@
.form-el-checkbox,
.form-el-radio {
- .visually-hidden();
+ .mixin-visually-hidden();
// Disabled state
diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_validation.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_validation.less
index 91064a7366fb1..bd4ebe6af4b59 100644
--- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_validation.less
+++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_validation.less
@@ -42,8 +42,8 @@
.check-result-message {
margin-left: .5em;
min-height: @btn__height__base;
- .vendor-box-align(center);
- .vendor-prefix-display(flex);
+ .mixin-vendor-box-align(center);
+ .mixin-vendor-prefix-display(flex);
}
.check-result-text {
diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/utilities/_vendor-prefixes.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/utilities/_vendor-prefixes.less
index 58e5eb8843f60..db03373d5328a 100644
--- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/utilities/_vendor-prefixes.less
+++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/utilities/_vendor-prefixes.less
@@ -3,7 +3,7 @@
// * See COPYING.txt for license details.
// */
-.vendor-prefix-appearance (
+.mixin-vendor-prefix-appearance (
@value: none
) {
-webkit-appearance: @value;
diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/pages/_customize-your-store.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/pages/_customize-your-store.less
index 1029449932948..b4d85a4571ab9 100644
--- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/pages/_customize-your-store.less
+++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/pages/_customize-your-store.less
@@ -6,7 +6,7 @@
.customize-your-store {
.customize-your-store-default {
.legend {
- .visually-hidden();
+ .mixin-visually-hidden();
}
}
.advanced-modules-select,
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/_extends.less b/app/design/adminhtml/Magento/backend/web/css/source/_extends.less
index 6b340f813fa49..3f6e8d88d3ca8 100644
--- a/app/design/adminhtml/Magento/backend/web/css/source/_extends.less
+++ b/app/design/adminhtml/Magento/backend/web/css/source/_extends.less
@@ -53,7 +53,7 @@
// Visually hidden
.abs-visually-hidden {
- .visually-hidden();
+ .mixin-visually-hidden();
}
.extend__visually-hidden() {
@@ -62,7 +62,7 @@
// Revert visually hidden
.abs-visually-hidden-reset {
- .visually-hidden-reset();
+ .mixin-visually-hidden-reset();
}
.extend__visually-hidden-reset() {
@@ -71,12 +71,12 @@
// Clearfixes
.abs-clearfix {
- .clearfix();
+ .mixin-clearfix();
}
// Clearer - clearing container using only :after element
.abs-clearer {
- .clearer();
+ .mixin-clearer();
}
.extend__clearer() {
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/_grid.less b/app/design/adminhtml/Magento/backend/web/css/source/_grid.less
index 0a1891d66b5c3..2892db520bac3 100644
--- a/app/design/adminhtml/Magento/backend/web/css/source/_grid.less
+++ b/app/design/adminhtml/Magento/backend/web/css/source/_grid.less
@@ -72,7 +72,7 @@
#mix-grid() {
.row() {
- .clearer();
+ .mixin-clearer();
margin-left: ~'-@{temp_gutter}';
}
.return_length(@_columns-min, @_total: @temp_columns, @mathSymbol: '-') {
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-multiselect.less b/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-multiselect.less
index 6bd43c41d6b12..ff239e9e88bec 100644
--- a/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-multiselect.less
+++ b/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-multiselect.less
@@ -70,7 +70,7 @@
right: .3rem;
}
> span {
- .visually-hidden();
+ .mixin-visually-hidden();
}
}
.action-menu {
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_calendar-temp.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_calendar-temp.less
index f1b4e4e709b7d..218d24ab5c362 100644
--- a/app/design/adminhtml/Magento/backend/web/css/source/components/_calendar-temp.less
+++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_calendar-temp.less
@@ -100,7 +100,7 @@
line-height: 3rem;
top: 0;
span {
- .visually-hidden();
+ .mixin-visually-hidden();
}
&:before {
color: #514943;
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/forms/_controls.less b/app/design/adminhtml/Magento/backend/web/css/source/forms/_controls.less
index 342b855c0d16d..0543790aeb87b 100644
--- a/app/design/adminhtml/Magento/backend/web/css/source/forms/_controls.less
+++ b/app/design/adminhtml/Magento/backend/web/css/source/forms/_controls.less
@@ -188,8 +188,8 @@ option:empty {
// Control with additional prefix or suffix label
.admin__control-addon {
- .vendor-prefix-display(inline-flex);
- .vendor-prefix-flex-direction(row);
+ .mixin-vendor-prefix-display(inline-flex);
+ .mixin-vendor-prefix-flex-direction(row);
display: inline-flex;
flex-flow: row nowrap;
position: relative;
@@ -197,15 +197,15 @@ option:empty {
z-index: 1;
> [class*='admin__addon-'],
> [class*='admin__control-'] {
- .vendor-prefix-flex-basis(auto);
- .vendor-prefix-flex-grow(0);
- .vendor-prefix-flex-shrink(0);
+ .mixin-vendor-prefix-flex-basis(auto);
+ .mixin-vendor-prefix-flex-grow(0);
+ .mixin-vendor-prefix-flex-shrink(0);
position: relative;
z-index: 1;
}
[class*='admin__control-'] {
.css(appearence,none);
- .vendor-prefix-flex-grow(1);
+ .mixin-vendor-prefix-flex-grow(1);
box-shadow: none;
background-color: transparent;
border-color: transparent;
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/forms/_fields.less b/app/design/adminhtml/Magento/backend/web/css/source/forms/_fields.less
index 7699db6b976a2..8f30a2ee04525 100644
--- a/app/design/adminhtml/Magento/backend/web/css/source/forms/_fields.less
+++ b/app/design/adminhtml/Magento/backend/web/css/source/forms/_fields.less
@@ -285,7 +285,7 @@
&:nth-child(n+2) {
padding-left: 20px;
&:not(.admin__field-option) .admin__field-label {
- .visually-hidden();
+ .mixin-visually-hidden();
}
}
}
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/forms/fields/_field-tooltips.less b/app/design/adminhtml/Magento/backend/web/css/source/forms/fields/_field-tooltips.less
index f982df06b859e..c62df1fb60553 100644
--- a/app/design/adminhtml/Magento/backend/web/css/source/forms/fields/_field-tooltips.less
+++ b/app/design/adminhtml/Magento/backend/web/css/source/forms/fields/_field-tooltips.less
@@ -50,7 +50,7 @@
right: -70px;
&:after,
&:before {
- .arrow(
+ .mixin-arrow(
@_position: down,
@_size: 16px,
@_color: @field-tooltip-content__border-color
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/utilities/_grid.less b/app/design/adminhtml/Magento/backend/web/css/source/utilities/_grid.less
index 44460f957bf23..fa6b1ce207e00 100644
--- a/app/design/adminhtml/Magento/backend/web/css/source/utilities/_grid.less
+++ b/app/design/adminhtml/Magento/backend/web/css/source/utilities/_grid.less
@@ -18,7 +18,7 @@
margin-left: auto;
padding-left: (@gutter / 2);
padding-right: (@gutter / 2);
- .clearer();
+ .mixin-clearer();
}
// Creates a wrapper for a series of columns
@@ -26,7 +26,7 @@
.make-row(@gutter: @grid-gutter-width) {
margin-left: (@gutter / -2);
margin-right: (@gutter / -2);
- .clearer();
+ .mixin-clearer();
}
//
diff --git a/app/design/adminhtml/Magento/backend/web/css/styles-old.less b/app/design/adminhtml/Magento/backend/web/css/styles-old.less
index af2040df17655..38a1527fa01e9 100644
--- a/app/design/adminhtml/Magento/backend/web/css/styles-old.less
+++ b/app/design/adminhtml/Magento/backend/web/css/styles-old.less
@@ -4090,7 +4090,7 @@ input.no-display,
}
.rule-chooser .field-row {
- .clearfix();
+ .mixin-clearfix();
display: block;
margin-bottom: 17px;
.input-text {
diff --git a/app/design/adminhtml/Magento/backend/web/mui/styles/abstract.less b/app/design/adminhtml/Magento/backend/web/mui/styles/abstract.less
index 5a4e98bf6afb2..b67f8636fff45 100644
--- a/app/design/adminhtml/Magento/backend/web/mui/styles/abstract.less
+++ b/app/design/adminhtml/Magento/backend/web/mui/styles/abstract.less
@@ -132,5 +132,5 @@
}
.add-clearer {
- .clearer();
+ .mixin-clearer();
}
diff --git a/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/_module.less b/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/_module.less
index 75ab7518c47f9..1ce826426b32d 100644
--- a/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/_module.less
+++ b/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/_module.less
@@ -437,11 +437,11 @@
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
.catalog-product-view {
.column.main {
- .vendor-prefix-display(flex);
- .vendor-prefix-flex-direction(column);
+ .mixin-vendor-prefix-display(flex);
+ .mixin-vendor-prefix-flex-direction(column);
}
.product.media {
- .vendor-prefix-order(-1);
+ .mixin-vendor-prefix-order(-1);
}
}
.product-info-main .box-tocart {
diff --git a/app/design/frontend/Magento/blank/Magento_CatalogSearch/web/css/source/_module.less b/app/design/frontend/Magento/blank/Magento_CatalogSearch/web/css/source/_module.less
index 1a304732fe2df..f20f0dcc91814 100644
--- a/app/design/frontend/Magento/blank/Magento_CatalogSearch/web/css/source/_module.less
+++ b/app/design/frontend/Magento/blank/Magento_CatalogSearch/web/css/source/_module.less
@@ -197,7 +197,7 @@
position: static;
padding-right: 35px;
margin: 0;
- .input-placeholder(@form-element-input-placeholder__color);
+ .mixin-input-placeholder(@form-element-input-placeholder__color);
}
.action.search {
position: absolute;
diff --git a/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_authentication.less b/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_authentication.less
index 0fe233697bf61..8659c574b77f1 100644
--- a/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_authentication.less
+++ b/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_authentication.less
@@ -160,17 +160,17 @@
width: 60%;
}
.block-authentication {
- .vendor-prefix-display(flex);
- .vendor-prefix-flex-direction(row);
+ .mixin-vendor-prefix-display(flex);
+ .mixin-vendor-prefix-flex-direction(row);
border-top: 1px solid @color-gray-light5;
}
.block[class],
.form-login,
.fieldset,
.block-content {
- .vendor-prefix-display(flex);
- .vendor-prefix-flex-direction(column);
- .vendor-prefix-flex-grow(1);
+ .mixin-vendor-prefix-display(flex);
+ .mixin-vendor-prefix-flex-direction(column);
+ .mixin-vendor-prefix-flex-grow(1);
}
.block[class] {
box-sizing: border-box;
diff --git a/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_tooltip.less b/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_tooltip.less
index 74dc4518f1894..85aec309e6a9a 100644
--- a/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_tooltip.less
+++ b/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_tooltip.less
@@ -95,7 +95,7 @@
&:before,
&:after {
- .arrow(
+ .mixin-arrow(
@_position: left,
@_size: @checkout-tooltip-icon-arrow__font-size,
@_color: @checkout-tooltip-content__background-color
diff --git a/app/design/frontend/Magento/blank/Magento_Review/web/css/source/_module.less b/app/design/frontend/Magento/blank/Magento_Review/web/css/source/_module.less
index d5c31283ecadd..2d58122c8d845 100644
--- a/app/design/frontend/Magento/blank/Magento_Review/web/css/source/_module.less
+++ b/app/design/frontend/Magento/blank/Magento_Review/web/css/source/_module.less
@@ -263,7 +263,7 @@
padding: @indent__base 0;
border-bottom: 1px solid @color-gray79;
margin: 0;
- .clearer();
+ .mixin-clearer();
&:last-child {
border-width: 0;
}
diff --git a/app/design/frontend/Magento/blank/Magento_Theme/web/css/source/_module.less b/app/design/frontend/Magento/blank/Magento_Theme/web/css/source/_module.less
index 7beeb9a2312bf..6e25404cc31f1 100644
--- a/app/design/frontend/Magento/blank/Magento_Theme/web/css/source/_module.less
+++ b/app/design/frontend/Magento/blank/Magento_Theme/web/css/source/_module.less
@@ -240,8 +240,8 @@ body {
}
.page-wrapper {
- .vendor-prefix-display(flex);
- .vendor-prefix-flex-direction(column);
+ .mixin-vendor-prefix-display(flex);
+ .mixin-vendor-prefix-flex-direction(column);
min-height: 100%; // stretch content area for sticky footer
> .breadcrumbs,
> .top-container,
diff --git a/app/design/frontend/Magento/blank/Magento_Weee/web/css/source/_module.less b/app/design/frontend/Magento/blank/Magento_Weee/web/css/source/_module.less
index 48479786c3c90..10e24a36357d8 100644
--- a/app/design/frontend/Magento/blank/Magento_Weee/web/css/source/_module.less
+++ b/app/design/frontend/Magento/blank/Magento_Weee/web/css/source/_module.less
@@ -1,28 +1,26 @@
-// /**
-// * Copyright © 2015 Magento. All rights reserved.
-// * See COPYING.txt for license details.
-// */
-
-//
-// Common
-//--------------------------------------
-
-& when (@media-common = true) {
-
-.minilist {
- .weee {
- display: table-row;
- .mixin-font-size(11);
- &:before {
- display: none;
- }
- }
-}
-
-.price-container.weee {
- &:before {
- display: none;
- }
-}
-
-}
+// /**
+// * Copyright © 2015 Magento. All rights reserved.
+// * See COPYING.txt for license details.
+// */
+
+//
+// Common
+// _____________________________________________
+
+& when (@media-common = true) {
+ .minilist {
+ .weee {
+ display: table-row;
+ .mixin-font-size(11);
+ &:before {
+ display: none;
+ }
+ }
+ }
+
+ .price-container.weee {
+ &:before {
+ display: none;
+ }
+ }
+}
diff --git a/app/design/frontend/Magento/blank/web/css/source/_extends.less b/app/design/frontend/Magento/blank/web/css/source/_extends.less
index abe0d04953e5f..1aca11d5664fe 100644
--- a/app/design/frontend/Magento/blank/web/css/source/_extends.less
+++ b/app/design/frontend/Magento/blank/web/css/source/_extends.less
@@ -408,7 +408,7 @@
// ---------------------------------------------
.abs-hidden {
- .visibility-hidden();
+ .mixin-visibility-hidden();
}
//
@@ -416,7 +416,7 @@
// ---------------------------------------------
@abs-visually-hidden: {
- .visually-hidden();
+ .mixin-visually-hidden();
};
.abs-visually-hidden {
@@ -452,7 +452,7 @@
// ---------------------------------------------
@abs-add-clearfix: {
- .clearfix();
+ .mixin-clearfix();
};
.abs-add-clearfix {
@@ -1060,7 +1060,7 @@
&:before,
&:after {
- .arrow(
+ .mixin-arrow(
@_position: top,
@_size: @checkout-tooltip-icon-arrow__font-size,
@_color: @checkout-tooltip-content__background-color
diff --git a/app/design/frontend/Magento/blank/web/css/source/_layout.less b/app/design/frontend/Magento/blank/web/css/source/_layout.less
index 81e7556438153..7c01da12c0bbd 100644
--- a/app/design/frontend/Magento/blank/web/css/source/_layout.less
+++ b/app/design/frontend/Magento/blank/web/css/source/_layout.less
@@ -16,22 +16,22 @@
#mixin-layout-columns();
.column.main {
&:extend(.abs-add-box-sizing all);
- .vendor-prefix-flex-grow(1);
- .vendor-prefix-flex-basis(100%);
+ .mixin-vendor-prefix-flex-grow(1);
+ .mixin-vendor-prefix-flex-basis(100%);
.css(padding-bottom, @indent__xl);
- .vendor-prefix-order(1);
+ .mixin-vendor-prefix-order(1);
}
.sidebar-main {
&:extend(.abs-add-box-sizing all);
- .vendor-prefix-flex-grow(1);
- .vendor-prefix-flex-basis(100%);
- .vendor-prefix-order(1);
+ .mixin-vendor-prefix-flex-grow(1);
+ .mixin-vendor-prefix-flex-basis(100%);
+ .mixin-vendor-prefix-order(1);
}
.sidebar-additional {
&:extend(.abs-add-box-sizing all);
- .vendor-prefix-flex-grow(1);
- .vendor-prefix-flex-basis(100%);
- .vendor-prefix-order(2);
+ .mixin-vendor-prefix-flex-grow(1);
+ .mixin-vendor-prefix-flex-basis(100%);
+ .mixin-vendor-prefix-order(2);
}
}
@@ -87,9 +87,9 @@
}
.page-main {
width: 100%;
- .vendor-prefix-flex-grow(1);
- .vendor-prefix-flex-shrink(0);
- .vendor-prefix-flex-basis(auto);
+ .mixin-vendor-prefix-flex-grow(1);
+ .mixin-vendor-prefix-flex-shrink(0);
+ .mixin-vendor-prefix-flex-basis(auto);
.ie9 & {
width: auto;
}
diff --git a/app/design/frontend/Magento/blank/web/css/source/_navigation.less b/app/design/frontend/Magento/blank/web/css/source/_navigation.less
index ef7f236cfb4a6..37855d7a6b78b 100644
--- a/app/design/frontend/Magento/blank/web/css/source/_navigation.less
+++ b/app/design/frontend/Magento/blank/web/css/source/_navigation.less
@@ -197,7 +197,7 @@
.nav-sections {
&-items {
- .clearfix();
+ .mixin-clearfix();
position: relative;
z-index: 1;
}
@@ -219,7 +219,7 @@
}
&-item-content {
- .clearfix();
+ .mixin-clearfix();
box-sizing: border-box;
float: right;
margin-left: -100%;
diff --git a/app/design/frontend/Magento/blank/web/css/source/_popups.less b/app/design/frontend/Magento/blank/web/css/source/_popups.less
index 3dfffa2acb4f2..51af95ad0d8e7 100644
--- a/app/design/frontend/Magento/blank/web/css/source/_popups.less
+++ b/app/design/frontend/Magento/blank/web/css/source/_popups.less
@@ -3,28 +3,32 @@
// * See COPYING.txt for license details.
// */
+//
+// Variables
+// _____________________________________________
+
@popup-marker__size: 7px;
//
-// Common
-//--------------------------------------
+// Common
+// _____________________________________________
& when (@media-common = true) {
-// Popup working with dropdown dialog
-.ui-dialog {
- &.popup {
- .action {
- &.close {
- width: 40px;
- height: 40px;
- top: 0;
- right: 0;
- .css(position, @popup-button-close__position);
- .css(bottom, @popup-button-close__position-bottom);
- .css(left, @popup-button-close__position-left);
- z-index: 1001;
- ._mixin-popup-button-close-icon(
+// Popup working with dropdown dialog
+ .ui-dialog {
+ &.popup {
+ .action {
+ &.close {
+ .css(bottom, @popup-button-close__position-bottom);
+ .css(left, @popup-button-close__position-left);
+ .css(position, @popup-button-close__position);
+ height: 40px;
+ right: 0;
+ top: 0;
+ width: 40px;
+ z-index: 1001;
+ ._mixin-popup-button-close-icon(
@popup-button-close__icon,
@popup-icon-font__content,
@popup-icon-font,
@@ -37,33 +41,33 @@
@popup-icon-font__vertical-align,
@popup-icon-font__position,
@popup-icon-font__text-hide
- );
- ._mixin-popup-button-close-reset(
+ );
+ ._mixin-popup-button-close-reset(
@popup-button-close__reset
- );
+ );
+ }
}
}
}
-}
-.popup-pointer {
- .pointer(
+ .popup-pointer {
+ .mixin-pointer(
@_size: @popup-marker__size,
@_background-color: @popup__background,
@_border-color: @popup__border-color,
@_position__vertical__value: 2px,
@_position__horizontal__value: 2px
- );
- position: absolute;
- top: -@popup-marker__size * 2;
- margin-left: -@popup-marker__size * 2;
-}
-
+ );
+ margin-left: -@popup-marker__size * 2;
+ position: absolute;
+ top: -@popup-marker__size * 2;
+ }
}
//
// Desktop
-//--------------------------------------
+// _____________________________________________
+
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.ui-dialog {
&.popup {
diff --git a/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/_module.less
index 8cc787a1c10ae..49270923d8216 100644
--- a/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/_module.less
+++ b/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/_module.less
@@ -492,11 +492,11 @@
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
.catalog-product-view {
.column.main {
- .vendor-prefix-display(flex);
- .vendor-prefix-flex-direction(column);
+ .mixin-vendor-prefix-display(flex);
+ .mixin-vendor-prefix-flex-direction(column);
}
.product.media {
- .vendor-prefix-order(-1);
+ .mixin-vendor-prefix-order(-1);
}
}
}
diff --git a/app/design/frontend/Magento/luma/Magento_CatalogSearch/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_CatalogSearch/web/css/source/_module.less
index 8d910970ea4bc..e2fe853cf5dd3 100644
--- a/app/design/frontend/Magento/luma/Magento_CatalogSearch/web/css/source/_module.less
+++ b/app/design/frontend/Magento/luma/Magento_CatalogSearch/web/css/source/_module.less
@@ -198,7 +198,7 @@
position: static;
padding-right: 35px;
margin: 0;
- .input-placeholder(@form-element-input-placeholder__color);
+ .mixin-input-placeholder(@form-element-input-placeholder__color);
}
.action.search {
position: absolute;
diff --git a/app/design/frontend/Magento/luma/Magento_LayeredNavigation/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_LayeredNavigation/web/css/source/_module.less
index 8f5d8b07a9bfb..1b12df89117d6 100644
--- a/app/design/frontend/Magento/luma/Magento_LayeredNavigation/web/css/source/_module.less
+++ b/app/design/frontend/Magento/luma/Magento_LayeredNavigation/web/css/source/_module.less
@@ -386,7 +386,7 @@
&:before {
content: "";
display: block;
- .arrow(up, 8px, @color-black);
+ .mixin-arrow(up, 8px, @color-black);
position: absolute;
left: 50%;
bottom: -1px;
diff --git a/app/design/frontend/Magento/luma/Magento_Review/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_Review/web/css/source/_module.less
index 9639dde5993bf..c9d3f74dfb710 100644
--- a/app/design/frontend/Magento/luma/Magento_Review/web/css/source/_module.less
+++ b/app/design/frontend/Magento/luma/Magento_Review/web/css/source/_module.less
@@ -156,7 +156,7 @@
padding: @indent__base 0;
border-bottom: 1px solid @color-gray79;
margin: 0;
- .clearer();
+ .mixin-clearer();
&:last-child {
border-width: 0;
}
diff --git a/app/design/frontend/Magento/luma/Magento_Theme/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_Theme/web/css/source/_module.less
index e3c29e2010354..6d7e0c1f16f85 100644
--- a/app/design/frontend/Magento/luma/Magento_Theme/web/css/source/_module.less
+++ b/app/design/frontend/Magento/luma/Magento_Theme/web/css/source/_module.less
@@ -416,7 +416,7 @@
float: right;
margin-left: 15px;
margin-right: -6px;
- .vendor-prefix-order(1);
+ .mixin-vendor-prefix-order(1);
}
}
@@ -532,8 +532,8 @@
}
.page-wrapper {
- .vendor-prefix-display(flex);
- .vendor-prefix-flex-direction(column);
+ .mixin-vendor-prefix-display(flex);
+ .mixin-vendor-prefix-flex-direction(column);
margin: 0;
min-height: 100%; // Stretch content area for sticky footer
position: relative;
diff --git a/app/design/frontend/Magento/luma/web/css/source/_extends.less b/app/design/frontend/Magento/luma/web/css/source/_extends.less
index ac3693b539561..d8c98a056fa15 100644
--- a/app/design/frontend/Magento/luma/web/css/source/_extends.less
+++ b/app/design/frontend/Magento/luma/web/css/source/_extends.less
@@ -422,7 +422,7 @@
// ---------------------------------------------
@abs-hidden: {
- .visibility-hidden();
+ .mixin-visibility-hidden();
};
.abs-hidden {
@@ -434,7 +434,7 @@
// ---------------------------------------------
@abs-visually-hidden: {
- .visually-hidden();
+ .mixin-visually-hidden();
};
.abs-visually-hidden {
@@ -470,7 +470,7 @@
// ---------------------------------------------
@abs-add-clearfix: {
- .clearfix();
+ .mixin-clearfix();
};
.abs-add-clearfix {
@@ -724,7 +724,7 @@
.abs-forms-general-desktop {
max-width: 500px;
.legend {
- .visually-hidden();
+ .mixin-visually-hidden();
}
.legend + br {
display: none;
@@ -945,7 +945,7 @@
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) {
.abs-col-no-prefix {
&:before {
- .visually-hidden();
+ .mixin-visually-hidden();
}
}
}
@@ -1448,7 +1448,7 @@
&:before,
&:after {
- .arrow(
+ .mixin-arrow(
@_position: top,
@_size: @checkout-tooltip-icon-arrow__font-size,
@_color: @checkout-tooltip-content__background-color
diff --git a/app/design/frontend/Magento/luma/web/css/source/_forms.less b/app/design/frontend/Magento/luma/web/css/source/_forms.less
index a51cddd5d7c68..7d3ea1b543c52 100644
--- a/app/design/frontend/Magento/luma/web/css/source/_forms.less
+++ b/app/design/frontend/Magento/luma/web/css/source/_forms.less
@@ -23,7 +23,7 @@
.mixin-form-field();
&.no-label {
> .label {
- .visually-hidden();
+ .mixin-visually-hidden();
}
}
&.choice {
diff --git a/app/design/frontend/Magento/luma/web/css/source/_popups.less b/app/design/frontend/Magento/luma/web/css/source/_popups.less
index 663d9b4e26a66..61eb569b89a9e 100644
--- a/app/design/frontend/Magento/luma/web/css/source/_popups.less
+++ b/app/design/frontend/Magento/luma/web/css/source/_popups.less
@@ -3,28 +3,32 @@
// * See COPYING.txt for license details.
// */
+//
+// Variables
+// _____________________________________________
+
@popup-marker__size: 7px;
//
-// Common
-//--------------------------------------
+// Common
+// _____________________________________________
& when (@media-common = true) {
-// Popup working with dropdown dialog
-.ui-dialog {
- &.popup {
- .action {
- &.close {
- width: 40px;
- height: 40px;
- top: 0;
- right: 0;
- .css(position, @popup-button-close__position);
- .css(bottom, @popup-button-close__position-bottom);
- .css(left, @popup-button-close__position-left);
- z-index: 1001;
- ._mixin-popup-button-close-icon(
+ // Popup working with dropdown dialog
+ .ui-dialog {
+ &.popup {
+ .action {
+ &.close {
+ .css(bottom, @popup-button-close__position-bottom);
+ .css(left, @popup-button-close__position-left);
+ .css(position, @popup-button-close__position);
+ height: 40px;
+ right: 0;
+ top: 0;
+ width: 40px;
+ z-index: 1001;
+ ._mixin-popup-button-close-icon(
@popup-button-close__icon,
@popup-icon-font__content,
@popup-icon-font,
@@ -37,44 +41,43 @@
@popup-icon-font__vertical-align,
@popup-icon-font__position,
@popup-icon-font__text-hide
- );
- ._mixin-popup-button-close-reset(
+ );
+ ._mixin-popup-button-close-reset(
@popup-button-close__reset
- );
+ );
+ }
}
}
}
-}
-.popup {
- .actions-toolbar {
- .action {
- &.cancel {
- &:extend(.abs-action-button-as-link all);
- font-weight: @font-weight__regular;
+ .popup {
+ .actions-toolbar {
+ .action {
+ &.cancel {
+ &:extend(.abs-action-button-as-link all);
+ font-weight: @font-weight__regular;
+ }
}
}
}
-}
-.popup-pointer {
- .pointer(
+ .popup-pointer {
+ .mixin-pointer(
@_size: @popup-marker__size,
@_background-color: @popup__background,
@_border-color: @popup__border-color,
@_position__vertical__value: 2px,
@_position__horizontal__value: 2px
- );
- position: absolute;
- top: -@popup-marker__size * 2;
- margin-left: -@popup-marker__size * 2;
-}
-
+ );
+ margin-left: -@popup-marker__size * 2;
+ position: absolute;
+ top: -@popup-marker__size * 2;
+ }
}
//
-// Mobile
-//--------------------------------------
+// Mobile
+// _____________________________________________
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
.popup-content {
@@ -95,8 +98,8 @@
}
//
-// Desktop
-//--------------------------------------
+// Desktop
+// _____________________________________________
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) {
.ui-dialog {
diff --git a/lib/web/css/docs/actions-toolbar.html b/lib/web/css/docs/actions-toolbar.html
index 0515d275c3b40..c7a9a6899ac5f 100644
--- a/lib/web/css/docs/actions-toolbar.html
+++ b/lib/web/css/docs/actions-toolbar.html
@@ -6,7 +6,7 @@
-->
actions-toolbar | Magento UI Library
-
+
Actions toolbar is a set of actions on a page, form and so on that includes primary and/or secondary actions.
To customize action toolbar .mixin-actions-toolbar()
mixin is used.
To implement the Actions toolbar use the following markup
@@ -290,4 +290,4 @@
.example-actions-toolbar-12 {
.mixin-actions-toolbar-clear-floats();
}
-}
+}