From 79b2f3774bd85fcc9c39a965c9eb5b9c6dd932f6 Mon Sep 17 00:00:00 2001 From: Pieter Hoste Date: Sun, 7 Jan 2024 18:23:25 +0100 Subject: [PATCH] Put calculations in less files in brackets if they were not there already, this fixes generating correct css again after the upgrade to less.js v4 in AC-8098 & AC-9713. --- .../web/css/source/_module.less | 8 ++--- .../web/css/source/module/_header.less | 2 +- .../web/css/source/module/_menu.less | 36 +++++++++---------- .../source/module/header/_actions-group.less | 2 +- .../source/module/header/_headings-group.less | 4 +-- .../header/actions-group/_notifications.less | 10 +++--- .../module/header/actions-group/_search.less | 14 ++++---- .../module/header/actions-group/_user.less | 6 ++-- .../css/source/module/main/_actions-bar.less | 2 +- .../main/actions-bar/_store-switcher.less | 2 +- .../css/source/module/pages/_dashboard.less | 10 +++--- .../navigation-bar/_navigation-bar.less | 22 ++++++------ .../module/steps/_attribute-values.less | 2 +- .../web/css/source/_module.less | 2 +- .../web/css/source/_module.less | 12 +++---- .../web/css/source/_module.less | 4 +-- .../web/css/source/module/_order.less | 2 +- .../web/css/source/module/order/_sidebar.less | 2 +- .../css/source/module/_scheduled-changes.less | 6 ++-- .../web/css/source/_module.less | 2 +- .../web/css/source/module/_data-grid.less | 32 ++++++++--------- .../web/css/source/module/_masonry-grid.less | 4 +-- .../module/data-grid/_data-grid-header.less | 6 ++-- .../_data-grid-action-bookmarks.less | 8 ++--- .../_data-grid-action-columns.less | 6 ++-- .../data-grid-header/_data-grid-filters.less | 22 ++++++------ .../_data-grid-sticky-header.less | 6 ++-- .../less/components/_navigation-bar.less | 26 +++++++------- .../less/components/tooltips/_tooltips.less | 4 +-- .../app/setup/styles/less/lib/_buttons.less | 16 ++++----- .../setup/styles/less/lib/forms/_forms.less | 2 +- .../setup/styles/less/lib/forms/_selects.less | 4 +-- .../backend/web/css/source/_actions.less | 6 ++-- .../Magento/backend/web/css/source/_grid.less | 6 ++-- .../css/source/actions/_actions-dropdown.less | 2 +- .../source/actions/_actions-multicheck.less | 2 +- .../source/actions/_actions-multiselect.less | 24 ++++++------- .../css/source/actions/_actions-split.less | 4 +-- .../css/source/components/_calendar-temp.less | 4 +-- .../css/source/components/_data-tooltip.less | 22 ++++++------ .../css/source/components/_file-uploader.less | 16 ++++----- .../css/source/components/_media-gallery.less | 6 ++-- .../css/source/components/_modals_extend.less | 20 +++++------ .../web/css/source/components/_popups.less | 4 +-- .../source/components/_resizable-block.less | 24 ++++++------- .../web/css/source/components/_slider.less | 8 ++--- .../web/css/source/components/_spinner.less | 4 +-- .../web/css/source/components/_timeline.less | 8 ++--- .../web/css/source/forms/_controls.less | 2 +- .../web/css/source/forms/_extends.less | 4 +-- .../backend/web/css/source/forms/_fields.less | 2 +- .../backend/web/css/source/forms/_temp.less | 4 +-- .../forms/controls/_checkbox-radio.less | 2 +- .../forms/fields/_control-collapsible.less | 4 +-- .../source/forms/fields/_field-tooltips.less | 6 ++-- .../web/css/source/utilities/_actions.less | 4 +-- .../web/css/source/variables/_actions.less | 6 ++-- .../web/css/source/variables/_components.less | 2 +- .../web/css/source/variables/_data-grid.less | 2 +- .../web/css/source/variables/_spinner.less | 2 +- .../web/css/source/variables/_structure.less | 16 ++++----- .../backend/web/mui/clearless/_arrows.less | 2 +- .../backend/web/mui/clearless/_icons.less | 20 +++++------ .../Magento/backend/web/mui/styles/_vars.less | 2 +- .../web/css/source/_module.less | 8 ++--- .../web/css/source/_widgets.less | 10 +++--- .../web/css/source/module/_listings.less | 14 ++++---- .../web/css/source/module/_toolbar.less | 2 +- .../module/checkout/_authentication.less | 2 +- .../css/source/module/checkout/_shipping.less | 4 +-- .../web/css/source/_module.less | 2 +- .../web/css/source/_module.less | 2 +- .../web/css/source/_module.less | 2 +- .../web/css/source/_module.less | 4 +-- .../Magento_Sales/web/css/source/_email.less | 2 +- .../Magento_Sales/web/css/source/_module.less | 2 +- .../blank/web/css/source/_email-base.less | 2 +- .../blank/web/css/source/_extends.less | 2 +- .../Magento/blank/web/css/source/_popups.less | 4 +-- .../css/source/components/_modals_extend.less | 4 +-- .../web/css/source/_module.less | 6 ++-- .../web/css/source/module/_listings.less | 14 ++++---- .../web/css/source/module/_toolbar.less | 2 +- .../web/css/source/module/_cart.less | 2 +- .../css/source/module/checkout/_shipping.less | 4 +-- .../checkout/fields/_file-uploader.less | 16 ++++----- .../web/css/source/_module.less | 2 +- .../web/css/source/_module.less | 2 +- .../web/css/source/_module.less | 2 +- .../web/css/source/_module.less | 2 +- .../web/css/source/_module.less | 8 ++--- .../Magento_Rma/web/css/source/_module.less | 2 +- .../Magento_Sales/web/css/source/_email.less | 2 +- .../Magento_Sales/web/css/source/_module.less | 6 ++-- .../Magento_Theme/web/css/source/_module.less | 4 +-- .../Magento/luma/web/css/source/_extends.less | 2 +- .../Magento/luma/web/css/source/_popups.less | 4 +-- .../Magento/luma/web/css/source/_theme.less | 2 +- .../css/source/components/_modals_extend.less | 2 +- dev/tools/grunt/configs/less.js | 1 + lib/web/css/source/components/_modals.less | 2 +- lib/web/css/source/lib/_layout.less | 2 +- lib/web/css/source/lib/_navigation.less | 4 +-- lib/web/css/source/lib/_rating.less | 6 ++-- lib/web/css/source/lib/_utilities.less | 4 +-- lib/web/css/source/lib/variables/_layout.less | 8 ++--- .../css/source/lib/variables/_messages.less | 2 +- .../css/source/lib/variables/_sections.less | 2 +- .../css/source/lib/variables/_structure.less | 2 +- .../css/source/lib/variables/_typography.less | 22 ++++++------ 110 files changed, 366 insertions(+), 365 deletions(-) diff --git a/app/design/adminhtml/Magento/backend/Magento_AdminNotification/web/css/source/_module.less b/app/design/adminhtml/Magento/backend/Magento_AdminNotification/web/css/source/_module.less index afd91ed3dbde6..125c8b2926c30 100644 --- a/app/design/adminhtml/Magento/backend/Magento_AdminNotification/web/css/source/_module.less +++ b/app/design/adminhtml/Magento/backend/Magento_AdminNotification/web/css/source/_module.less @@ -96,7 +96,7 @@ position: absolute; right: -1px; top: 100%; - z-index: @z-index-5 - 2; + z-index: (@z-index-5 - 2); ._active & { display: block; @@ -115,7 +115,7 @@ @_triangle__width: @message-system-triangle__width; @_triangle__color: @message-system__color; @_triangle__hover__color: darken(@message-system__color, 10%); - @_triangle__right: (@message-system-triangle__padding-right / 2) - (@message-system-triangle__width/ 2); + @_triangle__right: ((@message-system-triangle__padding-right / 2) - (@message-system-triangle__width/ 2)); ); } @@ -139,8 +139,8 @@ .notices-wrapper { .admin__data-grid-loading-mask { display: none; - min-height: @message-system-short-wrapper__height + @message-system__border-width; - z-index: @z-index-5 - 1; + min-height: (@message-system-short-wrapper__height + @message-system__border-width); + z-index: (@z-index-5 - 1); } .admin__data-grid-outer-wrap { diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/_header.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/_header.less index 7abbe0619efed..ee25e315d3fbc 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/_header.less +++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/_header.less @@ -18,7 +18,7 @@ // --------------------------------------------- @page-header__indent-horizontal: @content__indent; -@page-header__indent-vertical: @content__indent / 2; +@page-header__indent-vertical: (@content__indent / 2); // diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/_menu.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/_menu.less index 7486fa76078e9..95e68a8635e47 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/_menu.less +++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/_menu.less @@ -11,12 +11,12 @@ // Variables // --------------------------------------------- -@menu-wrapper__z-index: @menu__z-index - 1; +@menu-wrapper__z-index: (@menu__z-index - 1); @menu__background-color: @color-very-dark-grayish-orange; @menu-logo__padding-bottom: 1.7rem; -@menu-logo__outer-size: @menu-logo__padding-top + @menu-logo-img__height + @menu-logo__padding-bottom; +@menu-logo__outer-size: (@menu-logo__padding-top + @menu-logo-img__height + @menu-logo__padding-bottom); @menu-logo__padding-top: 1.7rem; @menu-logo-img__height: 4.1rem; @menu-logo-img__width: 3.5rem; @@ -31,12 +31,12 @@ @menu-line-before__background-color: @color-brownie-vanilla; @menu-line-before__height: 1px; -@menu-overlay__z-index: @menu__z-index - 3; +@menu-overlay__z-index: (@menu__z-index - 3); @submenu__background-color: @menu-item__active__background-color; @submenu__padding-horizontal: 1.5rem; @submenu__padding-vertical: 2rem; -@submenu__z-index: @menu__z-index - 2; +@submenu__z-index: (@menu__z-index - 2); @submenu__height: 720px; @submenu-column__width: 23.8rem; @submenu-column__width__l: 19.8rem; @@ -119,7 +119,7 @@ .logo { display: block; - height: @menu-logo-img__height + @menu-logo__padding-top + @menu-logo__padding-bottom; + height: (@menu-logo-img__height + @menu-logo__padding-top + @menu-logo__padding-bottom); padding: @menu-logo__padding-top 0 @menu-logo__padding-bottom; position: relative; text-align: center; @@ -181,7 +181,7 @@ display: block; height: @menu-line-before__height; left: 0; - margin-left: (100% - @_menu-separator__width) / 2; + margin-left: ((100% - @_menu-separator__width) / 2); position: absolute; top: 0; width: @_menu-separator__width; @@ -265,7 +265,7 @@ transition-property: transform, visibility; transition-timing-function: ease-in-out; visibility: hidden; - z-index: @submenu__z-index - 1; + z-index: (@submenu__z-index - 1); .ie11 & { height: 100%; @@ -305,8 +305,8 @@ &:active { background-color: @submenu-link__active__background-color; - padding-bottom: @submenu-link__padding-vertical - .1rem; - padding-top: @submenu-link__padding-vertical + .1rem; + padding-bottom: (@submenu-link__padding-vertical - .1rem); + padding-top: (@submenu-link__padding-vertical + .1rem); } } } @@ -363,16 +363,16 @@ display: block; font-size: 2.2rem; font-weight: @font-weight__semibold; - margin-bottom: .4rem + @submenu-heading-group__indent-bottom; - margin-left: @submenu__padding-horizontal * 2; - margin-right: @submenu__padding-horizontal * 2 + @submenu-action-close__indent-right; + margin-bottom: (.4rem + @submenu-heading-group__indent-bottom); + margin-left: (@submenu__padding-horizontal * 2); + margin-right: (@submenu__padding-horizontal * 2 + @submenu-action-close__indent-right); } .submenu-sub-title { color: @submenu-title__color; display: block; font-size: @font-size__s; - margin: -(@submenu-heading-group__indent-bottom) @submenu__padding-horizontal * 2 + @submenu-action-close__indent-right 3.8rem @submenu__padding-horizontal * 2; + margin: -(@submenu-heading-group__indent-bottom) (@submenu__padding-horizontal * 2 + @submenu-action-close__indent-right) 3.8rem (@submenu__padding-horizontal * 2); } .action-close { @@ -404,7 +404,7 @@ content: @icon-dashboard__content; font-size: @_menu-item-dashboard__size; - padding-top: @menu-item-icon__height - @_menu-item-dashboard__size; + padding-top: (@menu-item-icon__height - @_menu-item-dashboard__size); } } } @@ -433,7 +433,7 @@ content: @icon-customers__content; font-size: @_menu-item-dashboard__size; position: relative; - top: @menu-item-icon__height - @_menu-item-dashboard__size; + top: (@menu-item-icon__height - @_menu-item-dashboard__size); } } } @@ -445,7 +445,7 @@ content: @icon-promotions__content; font-size: @_menu-item-dashboard__size; - padding-top: @menu-item-icon__height - @_menu-item-dashboard__size; + padding-top: (@menu-item-icon__height - @_menu-item-dashboard__size); } } } @@ -458,7 +458,7 @@ content: @icon-cms__content; font-size: @_menu-item-dashboard__size; position: relative; - top: @menu-item-icon__height - @_menu-item-dashboard__size; + top: (@menu-item-icon__height - @_menu-item-dashboard__size); } } } @@ -478,7 +478,7 @@ content: @icon-stores__content; font-size: @_menu-item-dashboard__size; - padding-top: @menu-item-icon__height - @_menu-item-dashboard__size; + padding-top: (@menu-item-icon__height - @_menu-item-dashboard__size); } } } diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/_actions-group.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/_actions-group.less index a971ed7e637de..69f706161407e 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/_actions-group.less +++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/_actions-group.less @@ -19,7 +19,7 @@ // Variables // --------------------------------------------- -@page-header-action__height: @action__height + .1rem; +@page-header-action__height: (@action__height + .1rem); // diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/_headings-group.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/_headings-group.less index bf7ee7850f9d0..dea50861cbea4 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/_headings-group.less +++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/_headings-group.less @@ -21,13 +21,13 @@ @page-title__font-size: 2.8rem; // Breadcrumbs component not included in common styles, but title used it -@page-title-breadcrumbs__min-height: round(@page-title-breadcrumb__font-size * @line-height__base, 1); +@page-title-breadcrumbs__min-height: round((@page-title-breadcrumb__font-size * @line-height__base), 1); @page-title-breadcrumb__font-size: @font-size__s; // .page-header-hgroup { - padding-right: @content__indent / 2; + padding-right: (@content__indent / 2); } // diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_notifications.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_notifications.less index 6b30bf70772a4..abb540ebc1f73 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_notifications.less +++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_notifications.less @@ -11,13 +11,13 @@ // Variables // --------------------------------------------- -@notifications__font-size: round(@font-size__s - .1rem, 1); +@notifications__font-size: round((@font-size__s - .1rem), 1); @notifications__color: @color-gray20; @notifications-action__color: @text__color; -@notifications-action__padding-bottom: (@page-header-action__height - @notifications-action-icon__size) / 2 - .05rem; +@notifications-action__padding-bottom: ((@page-header-action__height - @notifications-action-icon__size) / 2 - .05rem); @notifications-action__padding-side: 2rem; -@notifications-action__padding-top: (@page-header-action__height - @notifications-action-icon__size) / 2 + .05rem; +@notifications-action__padding-top: ((@page-header-action__height - @notifications-action-icon__size) / 2 + .05rem); @notifications-action__hover__color: darken(@action-dropdown__color, 20%); @notifications-action-icon__size: 1.9rem; @notifications-action-menu__z-index: @header__z-index; @@ -49,7 +49,7 @@ border: none; content: ''; display: block; - height: @component__shadow-size__base + 1; + height: (@component__shadow-size__base + 1); left: -(@component__shadow-size__base + 1); margin-top: 0; position: absolute; @@ -177,7 +177,7 @@ .notifications-close { &:extend(.abs-action-reset all); line-height: 1; - padding: @notifications-action__padding-side / 2; + padding: (@notifications-action__padding-side / 2); position: absolute; right: 0; top: .6rem; diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_search.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_search.less index 2d3c6140d588f..ac222f8a0e074 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_search.less +++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_search.less @@ -11,18 +11,18 @@ // Variables // --------------------------------------------- -@search-global__z-index: @user-account-menu__z-index - 10; // Should be lower than user account +@search-global__z-index: (@user-account-menu__z-index - 10); // Should be lower than user account @search-global-field__width: @search-global-input__width; @search-global-input__font-size: @font-size__base; @search-global-input__height: @page-header-action__height; -@search-global-input__padding-bottom: (@search-global-input__height - @search-global-icon__height) / 2 - .1rem; -@search-global-input__padding-top: (@search-global-input__height - @search-global-icon__height) / 2 + .1rem; +@search-global-input__padding-bottom: ((@search-global-input__height - @search-global-icon__height) / 2 - .1rem); +@search-global-input__padding-top: ((@search-global-input__height - @search-global-icon__height) / 2 + .1rem); @search-global-input__padding-side: @font-size__base; -@search-global-input__width: @search-global-icon__width + @search-global-input__padding-side * 2; +@search-global-input__width: (@search-global-icon__width + @search-global-input__padding-side * 2); -@search-global-input__active__padding-right: @search-global-icon__height + 2rem; +@search-global-input__active__padding-right: (@search-global-icon__height + 2rem); @search-global-input__active__width: 25rem; @search-global-label-icon__color: @text__color; @@ -60,7 +60,7 @@ right: 0; text-indent: -100%; top: 0; - width: @search-global-icon__width + @search-global-input__padding-side * 2; + width: (@search-global-icon__width + @search-global-input__padding-side * 2); z-index: 3; } } @@ -155,7 +155,7 @@ background-color: transparent; border: 1px solid transparent; font-size: @search-global-input__font-size; - height: @search-global-input__height + .2; + height: (@search-global-input__height + .2); padding: @search-global-input__padding-top @search-global-input__padding-side @search-global-input__padding-bottom; position: absolute; right: 0; diff --git a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_user.less b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_user.less index efb809f9e1ace..97206bb3d9717 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_user.less +++ b/app/design/adminhtml/Magento/backend/Magento_Backend/web/css/source/module/header/actions-group/_user.less @@ -17,7 +17,7 @@ @user-account__padding-right: 2.8rem; @user-account-menu__min-width: 20rem; -@user-account-menu__z-index: @notifications-action-menu__z-index - 10; // Should be lower than notifications +@user-account-menu__z-index: (@notifications-action-menu__z-index - 10); // Should be lower than notifications @user-account-menu__hover__background-color: @action__hover__background-color; @user-account-menu__active__background-color: darken(@color-blue-clear-sky, 5%); @@ -61,7 +61,7 @@ content: @icon-account__content; font-size: @_icon-user__size; left: 1.1rem; - margin-top: -(@_icon-user__size / 2) - .1rem; + margin-top: (-(@_icon-user__size / 2) - .1rem); position: absolute; top: 50%; } @@ -113,5 +113,5 @@ .admin-user-account-text { .lib-text-overflow-ellipsis(); display: inline-block; - max-width: @user-account-menu__min-width - @user-account__padding-left - @user-account__padding-right - 2rem; + max-width: (@user-account-menu__min-width - @user-account__padding-left - @user-account__padding-right - 2rem); } 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 129dc93cfc686..cc29de874a4f5 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 @@ -65,7 +65,7 @@ position: fixed; right: 0; top: 0; - z-index: @page-actions__fixed__z-index + 101; + z-index: (@page-actions__fixed__z-index + 101); .page-actions-inner { &:before { 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 c4bb1a027e4b9..f2d88637680c0 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 @@ -12,7 +12,7 @@ .store-switcher { color: @text__color; float: left; - font-size: round(@font-size__base - .1rem, 1); + font-size: round((@font-size__base - .1rem), 1); margin-top: .59rem; .admin__action-dropdown { 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 3c50fc02a05c5..183f1cc75381f 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 @@ -21,8 +21,8 @@ @dashboard-secondary-table-col-name__width-px: 135px; @dashboard-secondary-table-col-value__width-px: 50px; -@dashboard-secondary-table-col-name__width-pct: @dashboard-secondary-table-col-name__width-px * 100% / @dashboard-secondary-table__width-px; // 57.44680851% -@dashboard-secondary-table-col-value__width-pct: @dashboard-secondary-table-col-value__width-px * 100% / @dashboard-secondary-table__width-px; // 21.27659574% +@dashboard-secondary-table-col-name__width-pct: (@dashboard-secondary-table-col-name__width-px * 100% / @dashboard-secondary-table__width-px); // 57.44680851% +@dashboard-secondary-table-col-value__width-pct: (@dashboard-secondary-table-col-value__width-px * 100% / @dashboard-secondary-table__width-px); // 21.27659574% // // Tables @@ -60,9 +60,9 @@ @dashboard-table-col-name__width-px: 308px; @dashboard-table-col-value__width-px: 84px; - @dashboard-table-col-product__width-pct: @dashboard-table-col-product__width-px * 100% / @dashboard-table__width-px; // 70% - @dashboard-table-col-name__width-pct: @dashboard-table-col-name__width-px * 100% / @dashboard-table__width-px; // 55% - @dashboard-table-col-value__width-pct: @dashboard-table-col-value__width-px * 100% / @dashboard-table__width-px; // 15% + @dashboard-table-col-product__width-pct: (@dashboard-table-col-product__width-px * 100% / @dashboard-table__width-px); // 70% + @dashboard-table-col-name__width-pct: (@dashboard-table-col-name__width-px * 100% / @dashboard-table__width-px); // 55% + @dashboard-table-col-value__width-pct: (@dashboard-table-col-value__width-px * 100% / @dashboard-table__width-px); // 15% th, td { 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 a09f6bf0f57cd..5c34cb107e533 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 @@ -90,9 +90,9 @@ border-top: 1px solid @nav-bar-bullet-wrap__border-top-color; content: ''; height: .8rem; - left: @nav-bar-step__width / 2; + left: (@nav-bar-step__width / 2); position: absolute; - right: @nav-bar-step__width / 2; + right: (@nav-bar-step__width / 2); top: @nav-bar-point__size; } @@ -200,11 +200,11 @@ height: @nav-bar-point__size; left: 50%; line-height: .6; - margin-left: -@nav-bar-point__size - .1; + margin-left: (-@nav-bar-point__size - .1); position: absolute; right: auto; text-align: center; - top: @nav-bar-dot__size / 2 - (@nav-bar-point__size / 2) - @nav-bar-point__border-width + .05; + top: (@nav-bar-dot__size / 2 - (@nav-bar-point__size / 2) - @nav-bar-point__border-width + .05); width: @nav-bar-point__size; } @@ -214,13 +214,13 @@ border: 1px solid transparent; border-radius: 100%; content: ''; - height: @nav-bar-dot__size - .1; + height: (@nav-bar-dot__size - .1); left: 50%; line-height: 1; - margin-left: -(@nav-bar-dot__size / 2) - .1; + margin-left: (-(@nav-bar-dot__size / 2) - .1); position: absolute; top: 0; - width: @nav-bar-dot__size - .1; + width: (@nav-bar-dot__size - .1); } } } @@ -256,10 +256,10 @@ .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__xs) { .nav-bar { - width: @nav-bar-step__width * .75 * 3; + width: (@nav-bar-step__width * .75 * 3); > li { - width: @nav-bar-step__width - .3; + width: (@nav-bar-step__width - .3); } } @@ -302,7 +302,7 @@ margin-bottom: 0; margin-left: auto; margin-right: auto; - width: @nav-bar-step__width * 4; + width: (@nav-bar-step__width * 4); > li { float: left; @@ -325,7 +325,7 @@ .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__l) { .nav { - padding-bottom: @nav-bar__height__base + @nav-bar-items__indent-bottom; + padding-bottom: (@nav-bar__height__base + @nav-bar-items__indent-bottom); padding-left: 1.5rem; text-align: center; } diff --git a/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/steps/_attribute-values.less b/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/steps/_attribute-values.less index 624a9b162a6df..d924e4cd195e5 100644 --- a/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/steps/_attribute-values.less +++ b/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/steps/_attribute-values.less @@ -18,7 +18,7 @@ @steps-wizard-attribute-entity-action-save__content: @icon-arrow-right__content; @steps-wizard-attribute-entity-action-save__hover__content: @color-very-dark-gray-black2; -@steps-wizard-attribute-option-width: 100%/3; +@steps-wizard-attribute-option-width: (100% / 3); // // Common diff --git a/app/design/adminhtml/Magento/backend/Magento_Marketplace/web/css/source/_module.less b/app/design/adminhtml/Magento/backend/Magento_Marketplace/web/css/source/_module.less index 92a08eb7909c4..fa810371c4541 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Marketplace/web/css/source/_module.less +++ b/app/design/adminhtml/Magento/backend/Magento_Marketplace/web/css/source/_module.less @@ -20,7 +20,7 @@ .partner { margin-bottom: @indent__xl; padding: 0 @indent__m; - width: 100% / 3; + width: (100% / 3); } } diff --git a/app/design/adminhtml/Magento/backend/Magento_ProductVideo/web/css/source/_module.less b/app/design/adminhtml/Magento/backend/Magento_ProductVideo/web/css/source/_module.less index 1b8ce7158488d..b62f03fd472f1 100644 --- a/app/design/adminhtml/Magento/backend/Magento_ProductVideo/web/css/source/_module.less +++ b/app/design/adminhtml/Magento/backend/Magento_ProductVideo/web/css/source/_module.less @@ -1,4 +1,4 @@ -// /** +// /** // * Copyright © Magento, Inc. All rights reserved. // * See COPYING.txt for license details. // */ @@ -9,7 +9,7 @@ @video-gallery-icon__color: @color-black; @video-gallery-icon__size: 4rem; -@video-gallery-icon__z-index: @image-gallery-image__z-index + 1; +@video-gallery-icon__z-index: (@image-gallery-image__z-index + 1); // // Extends @@ -28,7 +28,7 @@ &:before { left: 0; - margin-top: -@video-gallery-icon__size / 2; + margin-top: (-@video-gallery-icon__size / 2); opacity: .5; position: absolute; right: 0; @@ -118,7 +118,7 @@ display: block; float: left; font-family: @font-family__base; - font-size: @font-size__s + .2; + font-size: (@font-size__s + .2); font-weight: @font-weight__semibold; text-align: right; width: 25%; @@ -128,7 +128,7 @@ display: block; float: left; font-family: @font-family__base; - font-size: @font-size__s + .2; + font-size: (@font-size__s + .2); font-weight: @font-weight__light; padding-left: 20px; width: 74.9999%; @@ -206,7 +206,7 @@ color: @color-black; float: right; font-family: @font-family__base; - font-size: @font-size__s + .2; + font-size: (@font-size__s + .2); font-weight: @font-weight__semibold; position: relative; right: 50px; diff --git a/app/design/adminhtml/Magento/backend/Magento_Review/web/css/source/_module.less b/app/design/adminhtml/Magento/backend/Magento_Review/web/css/source/_module.less index 08606402f7a0e..9fb12b12cc31e 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Review/web/css/source/_module.less +++ b/app/design/adminhtml/Magento/backend/Magento_Review/web/css/source/_module.less @@ -1,4 +1,4 @@ -// /** +// /** // * Copyright © Magento, Inc. All rights reserved. // * See COPYING.txt for license details. // */ @@ -69,7 +69,7 @@ line-height: 0; margin: 4px 0 0; overflow: hidden; - width: @rating-star__width*5; + width: (@rating-star__width*5); .rating { background: url('@{baseDir}images/rating-bg.png') repeat-x 0 -@rating-star__height; diff --git a/app/design/adminhtml/Magento/backend/Magento_Sales/web/css/source/module/_order.less b/app/design/adminhtml/Magento/backend/Magento_Sales/web/css/source/module/_order.less index 94c9703199e26..c847526498be1 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Sales/web/css/source/module/_order.less +++ b/app/design/adminhtml/Magento/backend/Magento_Sales/web/css/source/module/_order.less @@ -305,7 +305,7 @@ .summary-details { .label, .admin__total-mark { - padding-left: @collapsible-title-icon__size + .5rem + @admin__table-secondary__padding-horizontal; + padding-left: (@collapsible-title-icon__size + .5rem + @admin__table-secondary__padding-horizontal); } } diff --git a/app/design/adminhtml/Magento/backend/Magento_Sales/web/css/source/module/order/_sidebar.less b/app/design/adminhtml/Magento/backend/Magento_Sales/web/css/source/module/order/_sidebar.less index 19a6782b0ccd0..8e055a4a0f9ab 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Sales/web/css/source/module/order/_sidebar.less +++ b/app/design/adminhtml/Magento/backend/Magento_Sales/web/css/source/module/order/_sidebar.less @@ -66,7 +66,7 @@ .icon { &:extend(.abs-icon all); display: inline-block; - font-size: @order-create-sidebar__font-size + .1rem; + font-size: (@order-create-sidebar__font-size + .1rem); text-decoration: none; vertical-align: middle; &:after { diff --git a/app/design/adminhtml/Magento/backend/Magento_Staging/web/css/source/module/_scheduled-changes.less b/app/design/adminhtml/Magento/backend/Magento_Staging/web/css/source/module/_scheduled-changes.less index f4959f3ba487b..960ed9f2809b7 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Staging/web/css/source/module/_scheduled-changes.less +++ b/app/design/adminhtml/Magento/backend/Magento_Staging/web/css/source/module/_scheduled-changes.less @@ -26,7 +26,7 @@ @scheduled-changes-mark__width: @scheduled-changes-mark__height; @scheduled-changes-mark-overlay__height: 20px; -@scheduled-changes-mark-overlay__width: @scheduled-changes-mark__width + @scheduled-changes-mark__border-width + 4; +@scheduled-changes-mark-overlay__width: (@scheduled-changes-mark__width + @scheduled-changes-mark__border-width + 4); // // Components @@ -93,9 +93,9 @@ background: linear-gradient(to top, rgba(255,255,255,1) 30%, rgba(255,255,255,0) 100%); content: ''; height: @scheduled-changes-mark-overlay__height; - left: -@scheduled-changes-mark-overlay__width / 2; + left: (-@scheduled-changes-mark-overlay__width / 2); position: absolute; - top: -@scheduled-changes-mark-overlay__height; + top: (-@scheduled-changes-mark-overlay__height); width: @scheduled-changes-mark-overlay__width; } } diff --git a/app/design/adminhtml/Magento/backend/Magento_Translation/web/css/source/_module.less b/app/design/adminhtml/Magento/backend/Magento_Translation/web/css/source/_module.less index ef87f2ef97e57..3c2a3cbf90859 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Translation/web/css/source/_module.less +++ b/app/design/adminhtml/Magento/backend/Magento_Translation/web/css/source/_module.less @@ -11,7 +11,7 @@ // Variables // --------------------------------------------- -@translate-inline-title__z-index: @menu__z-index + 1; +@translate-inline-title__z-index: (@menu__z-index + 1); // // Form diff --git a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/_data-grid.less b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/_data-grid.less index e8d6472ce0b4b..3626c22a1e6e0 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/_data-grid.less +++ b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/_data-grid.less @@ -34,7 +34,7 @@ // .admin__data-grid-outer-wrap { - min-height: @data-grid-spinner__size + @indent__base * 2; + min-height: (@data-grid-spinner__size + @indent__base * 2); position: relative; // Used to keep spinner inside } @@ -377,8 +377,8 @@ body._in-resize { } &:active { - padding-bottom: @data-grid-th__padding-vertical - .1rem; - padding-top: @data-grid-th__padding-vertical + .1rem; + padding-bottom: (@data-grid-th__padding-vertical - .1rem); + padding-top: (@data-grid-th__padding-vertical + .1rem); } } @@ -398,7 +398,7 @@ body._in-resize { overflow: hidden; padding: 0; vertical-align: middle; - width: @control-checkbox-radio__size + @data-grid-checkbox-cell-inner__padding-horizontal * 2; + width: (@control-checkbox-radio__size + @data-grid-checkbox-cell-inner__padding-horizontal * 2); &:hover { cursor: default; @@ -416,7 +416,7 @@ body._in-resize { } .data-grid-multicheck-cell { - padding: @data-grid-th__padding-horizontal @data-grid-th__padding-vertical @data-grid-th__padding-horizontal - .1rem; + padding: @data-grid-th__padding-horizontal @data-grid-th__padding-vertical (@data-grid-th__padding-horizontal - .1rem); text-align: center; vertical-align: middle; } @@ -427,8 +427,8 @@ body._in-resize { } .data-grid-actions-cell { - padding-left: @data-grid-cell__padding-horizontal * 2; - padding-right: @data-grid-cell__padding-horizontal * 2; + padding-left: (@data-grid-cell__padding-horizontal * 2); + padding-right: (@data-grid-cell__padding-horizontal * 2); position: relative; text-align: center; width: 1%; @@ -525,7 +525,7 @@ body._in-resize { } .data-grid-controls-row td { - padding-top: @data-grid-cell__padding-vertical + @field-control__padding-top; + padding-top: (@data-grid-cell__padding-vertical + @field-control__padding-top); &.data-grid-checkbox-cell { padding-top: @field-control__padding-top; @@ -533,7 +533,7 @@ body._in-resize { button, [class*='admin__control-'] { - margin-top: -@field-control__padding-top - @field-control__border-width - .1rem; + margin-top: (-@field-control__padding-top - @field-control__border-width - .1rem); } } @@ -663,7 +663,7 @@ body._in-resize { bottom: 0; box-shadow: 0 5px @component__shadow-size__base rgba(0, 0, 0, .25); content: ''; - height: @data-grid-cell__padding-vertical - .1rem; + height: (@data-grid-cell__padding-vertical - .1rem); left: 0; margin-top: -(@data-grid-cell__padding-vertical); position: absolute; @@ -675,9 +675,9 @@ body._in-resize { bottom: 0; content: ''; height: @data-grid-cell__padding-vertical; - left: -@component__shadow-size__base * 2; + left: (-@component__shadow-size__base * 2); position: absolute; - right: -@component__shadow-size__base * 2; + right: (-@component__shadow-size__base * 2); z-index: 1; } } @@ -756,7 +756,7 @@ body._in-resize { &._sortable { &._ascend, &._descend { - padding-right: @data-grid-th__padding-horizontal * 2 + @data-grid-th-marker__width; + padding-right: (@data-grid-th__padding-horizontal * 2 + @data-grid-th-marker__width); &:before { margin-top: -1em; @@ -818,7 +818,7 @@ body._in-resize { > td { .data-grid-checkbox-cell-inner { - padding-left: (@data-grid-checkbox-cell-inner__padding-horizontal * .75) * 2 + @data-grid-row-parent-marker__size; + padding-left: ((@data-grid-checkbox-cell-inner__padding-horizontal * .75) * 2 + @data-grid-row-parent-marker__size); position: relative; &:before { @@ -826,9 +826,9 @@ body._in-resize { content: @icon-caret-down__content; font-size: @data-grid-row-parent-marker__size; font-weight: @font-weight__bold; - left: @data-grid-checkbox-cell-inner__padding-horizontal * .75; + left: (@data-grid-checkbox-cell-inner__padding-horizontal * .75); position: absolute; - top: @data-grid-checkbox-cell-inner__padding-top + (@data-grid-row-parent-marker__size / 2); + top: (@data-grid-checkbox-cell-inner__padding-top + (@data-grid-row-parent-marker__size / 2)); } } } diff --git a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/_masonry-grid.less b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/_masonry-grid.less index 237395db8cb43..4d9c433d25402 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/_masonry-grid.less +++ b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/_masonry-grid.less @@ -10,7 +10,7 @@ & when (@media-common = true) { .masonry-image { &-grid { - margin: @admin__masonry_grid_image__space/2 -(@admin__masonry_grid_image__space/2); + margin: (@admin__masonry_grid_image__space/2) -(@admin__masonry_grid_image__space/2); overflow: hidden; position: relative; @@ -25,7 +25,7 @@ &-column { background-color: @admin__masonry_grid_background_color; float: left; - margin: @admin__masonry_grid_image__space/2; + margin: (@admin__masonry_grid_image__space/2); overflow: hidden; .masonry-image-block { diff --git a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/_data-grid-header.less b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/_data-grid-header.less index bb62bb8bb1829..eea3c473de759 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/_data-grid-header.less +++ b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/_data-grid-header.less @@ -26,7 +26,7 @@ .admin__data-grid-header-row { &:extend(.abs-clearfix all); + .admin__data-grid-header-row { - margin-top: @data-grid-header-row__indent - @data-grid-header-add-indent__bottom; + margin-top: (@data-grid-header-row__indent - @data-grid-header-add-indent__bottom); } &:last-child { @@ -85,8 +85,8 @@ } .admin__action-dropdown { - padding-bottom: @action-dropdown__padding-bottom + @data-grid-header-add-indent__bottom; - padding-top: @action-dropdown__padding-top + @data-grid-header-add-indent__top; + padding-bottom: (@action-dropdown__padding-bottom + @data-grid-header-add-indent__bottom); + padding-top: (@action-dropdown__padding-top + @data-grid-header-add-indent__top); &:after { margin-top: -.4rem; diff --git a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-action-bookmarks.less b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-action-bookmarks.less index f9c93dce57002..2233ace6c1dd1 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-action-bookmarks.less +++ b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-action-bookmarks.less @@ -79,7 +79,7 @@ .action-dropdown-menu-item-edit { display: none; padding-bottom: @action-dropdown-menu-item__padding-vertical; - padding-left: @action-dropdown-menu-item__padding-left / 2; + padding-left: (@action-dropdown-menu-item__padding-left / 2); padding-top: @action-dropdown-menu-item__padding-vertical; .action-dropdown-menu-item-actions { @@ -90,7 +90,7 @@ // Menu actions .action-dropdown-menu-action { - padding-left: @action-dropdown-menu-item__padding-left / 2; + padding-left: (@action-dropdown-menu-item__padding-left / 2); padding-top: @action-dropdown-menu-item__padding-vertical; + .action-dropdown-menu-item-last { @@ -145,7 +145,7 @@ .action-dropdown-menu-link { .action-dropdown-menu-link-pattern(); - padding: @action-dropdown-menu-item__padding-vertical 1rem @action-dropdown-menu-item__padding-vertical @action-dropdown-menu-item__padding-left + .1rem; + padding: @action-dropdown-menu-item__padding-vertical 1rem @action-dropdown-menu-item__padding-vertical (@action-dropdown-menu-item__padding-left + .1rem); } } @@ -195,7 +195,7 @@ } .action-edit { - padding-top: @action-dropdown-menu-item-action-icon__padding-vertical + .2rem; + padding-top: (@action-dropdown-menu-item-action-icon__padding-vertical + .2rem); &:before { content: @icon-edit__content; diff --git a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-action-columns.less b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-action-columns.less index 88176da4540d0..624e1ac3895b0 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-action-columns.less +++ b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-action-columns.less @@ -54,7 +54,7 @@ } .admin__action-dropdown-menu-content { - width: @data-grid-action-columns-menu-item__width * @data-grid-action-columns-menu-item__column + @data-grid-action-columns-menu-scroll__width; + width: (@data-grid-action-columns-menu-item__width * @data-grid-action-columns-menu-item__column + @data-grid-action-columns-menu-scroll__width); } .admin__action-dropdown-menu-footer { @@ -65,11 +65,11 @@ .admin__action-dropdown-menu-content { &:extend(.abs-clearfix all); - max-height: (@data-grid-action-columns-menu-items-to-scroll / @data-grid-action-columns-menu-item__column) * (@data-grid-action-columns-menu-item__height + @data-grid-action-columns-menu-item__margin-bottom) + (@data-grid-action-columns-menu-item__height / 2 + @data-grid-action-columns-menu-item__margin-bottom); + max-height: ((@data-grid-action-columns-menu-items-to-scroll / @data-grid-action-columns-menu-item__column) * (@data-grid-action-columns-menu-item__height + @data-grid-action-columns-menu-item__margin-bottom) + (@data-grid-action-columns-menu-item__height / 2 + @data-grid-action-columns-menu-item__margin-bottom)); overflow-y: auto; padding-top: 1.5rem; position: relative; - width: @data-grid-action-columns-menu-item__width * @data-grid-action-columns-menu-item__column; + width: (@data-grid-action-columns-menu-item__width * @data-grid-action-columns-menu-item__column); } .admin__field-option { diff --git a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-filters.less b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-filters.less index e37e08f3b667d..45dbf26afb7f7 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-filters.less +++ b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-filters.less @@ -32,7 +32,7 @@ @data-grid-filters-current-action-remove__hover__background-color: darken(@data-grid-filters-current-action-remove__background-color, 10%); @data-grid-filters-current-action-remove__size: 1.6rem; -@data-grid-search-menu__z-index: @data-grid-overlay__z-index - 1; +@data-grid-search-menu__z-index: (@data-grid-overlay__z-index - 1); @data-grid-search-control-action-menu-item__quantity: 5; // @@ -99,7 +99,7 @@ } .action-menu { - max-height: 3.85rem * @data-grid-search-control-action-menu-item__quantity; // @todo: change static item height + max-height: (3.85rem * @data-grid-search-control-action-menu-item__quantity); // @todo: change static item height overflow-y: auto; z-index: @data-grid-search-menu__z-index; } @@ -116,7 +116,7 @@ } .data-grid-search-control { - padding-right: @data-grid-search-action__size + 2rem * 2; + padding-right: (@data-grid-search-action__size + 2rem * 2); width: 100%; } @@ -130,7 +130,7 @@ margin-bottom: 1rem; padding-left: @data-grid-filters-action__padding-left; padding-right: @data-grid-filters-action__padding-right; - padding-top: @action__padding-top + .1rem; + padding-top: (@action__padding-top + .1rem); &._active { background-color: @data-grid-filters__background-color; @@ -139,9 +139,9 @@ font-weight: @font-weight__semibold; margin: -.1rem 0 0; padding-bottom: 1.6rem; - padding-top: @action__padding-top + .2rem; + padding-top: (@action__padding-top + .2rem); position: relative; - z-index: @data-grid-header__z-index - 19; + z-index: (@data-grid-header__z-index - 19); &:after { background-color: @data-grid-filters-action__active__color; @@ -197,7 +197,7 @@ padding: 3.6rem 0 3rem; position: relative; top: -1px; - z-index: @data-grid-header__z-index - 20; + z-index: (@data-grid-header__z-index - 20); .admin__data-grid-filters-footer, .admin__data-grid-filters { @@ -219,8 +219,8 @@ display: inline-block; margin-bottom: 2em; margin-left: 0; - padding-left: @data-grid-filters-fieldset__inner-side / 2; - padding-right: @data-grid-filters-fieldset__inner-side / 2; + padding-left: (@data-grid-filters-fieldset__inner-side / 2); + padding-right: (@data-grid-filters-fieldset__inner-side / 2); vertical-align: top; width: ~'calc(100% / @{data-grid-filters-fieldset__columns} - 4px)'; @@ -265,7 +265,7 @@ .admin__control-select { height: @action__height; - padding-top: @action__padding-top - .1rem; + padding-top: (@action__padding-top - .1rem); } .admin__action-multiselect { @@ -364,7 +364,7 @@ display: inline-block; font-weight: @font-weight__semibold; margin: 0 1rem .5rem; - padding-right: @data-grid-filters-current-action-remove__size + 1rem; + padding-right: (@data-grid-filters-current-action-remove__size + 1rem); position: relative; } diff --git a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-sticky-header.less b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-sticky-header.less index 1272b5c9c41ac..998edfd0733ee 100644 --- a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-sticky-header.less +++ b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-sticky-header.less @@ -164,7 +164,7 @@ position: absolute; top: 100%; width: 100%; - z-index: @data-grid-sticky-header-actions__z-index - 1; + z-index: (@data-grid-sticky-header-actions__z-index - 1); } .admin__data-grid-filters-current { @@ -186,7 +186,7 @@ position: absolute; right: -7px; top: 0; - z-index: @data-grid-sticky-header-actions__z-index + 1; + z-index: (@data-grid-sticky-header-actions__z-index + 1); &:empty { padding-bottom: 0; @@ -278,7 +278,7 @@ position: absolute; top: 6rem; width: @page-content__padding-horizontal; - z-index: @action-multicheck__z-index + 1; + z-index: (@action-multicheck__z-index + 1); } .data-grid-cap-left { 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 16ccf4081ddbf..1f0f47816ecaa 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 @@ -100,9 +100,9 @@ border-top: 1px solid @nav-bar-bullet-wrap__border-top-color; content: ''; height: 1rem; - left: @nav-bar-step__width / 2; + left: (@nav-bar-step__width / 2); position: absolute; - right: @nav-bar-step__width / 2; + right: (@nav-bar-step__width / 2); top: @nav-bar-point__size; } @@ -208,15 +208,15 @@ color: @color-white; content: counter(i); counter-increment: i; - height: @nav-bar-point__size + @nav-bar-point__border-width * 2; + height: (@nav-bar-point__size + @nav-bar-point__border-width * 2); left: 50%; line-height: .6; - margin-left: -@nav-bar-point__size - .1; + margin-left: (-@nav-bar-point__size - .1); position: absolute; right: auto; text-align: center; - top: @nav-bar-dot__size / 2 - (@nav-bar-point__size / 2) - @nav-bar-point__border-width + .05; - width: @nav-bar-point__size + @nav-bar-point__border-width * 2; + top: (@nav-bar-dot__size / 2 - (@nav-bar-point__size / 2) - @nav-bar-point__border-width + .05); + width: (@nav-bar-point__size + @nav-bar-point__border-width * 2); } // Visited step link bullet wrap @@ -227,13 +227,13 @@ border-radius: 100%; border-top-color: @nav-bar-bullet-wrap__border-top-color; content: ''; - height: @nav-bar-dot__size + @nav-bar-dot__border-width * 2 - @nav-bar-dot__border-width; + height: (@nav-bar-dot__size + @nav-bar-dot__border-width * 2 - @nav-bar-dot__border-width); left: 50%; line-height: 1; - margin-left: -(@nav-bar-dot__size / 2) - @nav-bar-dot__border-width; + margin-left: (-(@nav-bar-dot__size / 2) - @nav-bar-dot__border-width); position: absolute; top: 0; - width: @nav-bar-dot__size + @nav-bar-dot__border-width * 2 - @nav-bar-dot__border-width; + width: (@nav-bar-dot__size + @nav-bar-dot__border-width * 2 - @nav-bar-dot__border-width); } } } @@ -244,7 +244,7 @@ .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__l) { .nav { - padding-bottom: @nav-bar__height__base + @nav-bar-items__indent-bottom; + padding-bottom: (@nav-bar__height__base + @nav-bar-items__indent-bottom); padding-left: 1.5rem; text-align: center; } @@ -295,7 +295,7 @@ margin-bottom: 0; margin-left: auto; margin-right: auto; - width: @nav-bar-step__width * 3; + width: (@nav-bar-step__width * 3); &:before { display: none; @@ -322,10 +322,10 @@ .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__xs) { .nav-bar { - width: @nav-bar-step__width * .75 * 3; + width: (@nav-bar-step__width * .75 * 3); > li { - width: @nav-bar-step__width * .75; + width: (@nav-bar-step__width * .75); } } diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/components/tooltips/_tooltips.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/components/tooltips/_tooltips.less index 8b26177a05cc8..04f09b8202a2f 100644 --- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/components/tooltips/_tooltips.less +++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/components/tooltips/_tooltips.less @@ -46,12 +46,12 @@ } &.right { - margin-left: @tooltip-arrow__size / 2; + margin-left: (@tooltip-arrow__size / 2); padding: 0 @tooltip-arrow__size; } &.bottom { - margin-top: @tooltip-arrow__size / 2; + margin-top: (@tooltip-arrow__size / 2); padding: @tooltip-arrow__size 0; } 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 2c60af8dfa178..17f112459ad8f 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 @@ -170,17 +170,17 @@ // Right .btn-wrap-triangle-right { display: inline-block; - padding-right: @triangle__base__size - .1; + padding-right: (@triangle__base__size - .1); position: relative; .btn { - text-indent: @triangle__base__size / 2; + text-indent: (@triangle__base__size / 2); &:after { border-color: transparent transparent transparent @btn__base__background-color; border-width: @triangle__base__size 0 @triangle__base__size @triangle__base__size; left: 100%; - margin-left: -@triangle__base__size + .1; + margin-left: (-@triangle__base__size + .1); } &:focus, @@ -235,15 +235,15 @@ .btn-wrap-triangle-left { display: inline-block; - padding-left: @triangle__base__size - .1; + padding-left: (@triangle__base__size - .1); .btn { - text-indent: -@triangle__base__size / 2; + text-indent: (-@triangle__base__size / 2); &:after { border-color: transparent @btn__base__background-color transparent transparent; border-width: @triangle__base__size @triangle__base__size @triangle__base__size 0; - margin-right: -@triangle__base__size + .1; + margin-right: (-@triangle__base__size + .1); right: 100%; } @@ -312,7 +312,7 @@ &.expanded { &:after { border-color: transparent transparent @color-btn-expand transparent; - border-width: 0 @width-triangle-btn-expand / 2 @height-triangle-btn-expand @width-triangle-btn-expand / 2; + border-width: 0 (@width-triangle-btn-expand / 2) @height-triangle-btn-expand (@width-triangle-btn-expand / 2); } &:hover { @@ -335,7 +335,7 @@ &:after { border-color: @color-btn-expand transparent transparent transparent; border-style: solid; - border-width: @height-triangle-btn-expand @width-triangle-btn-expand / 2 0 @width-triangle-btn-expand / 2; + border-width: @height-triangle-btn-expand (@width-triangle-btn-expand / 2) 0 (@width-triangle-btn-expand / 2); content: ''; height: 0; left: 100%; diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_forms.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_forms.less index 790777ae0e130..0e5457056118f 100644 --- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_forms.less +++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_forms.less @@ -166,7 +166,7 @@ textarea:not([disabled]) { .form-el-insider { border-radius: @form-el__border-radius; display: table-cell; - padding: @form-el__padding-top + .08em @form-el__padding-side @form-el__padding-bottom 0; + padding: (@form-el__padding-top + .08em) @form-el__padding-side @form-el__padding-bottom 0; vertical-align: top; } diff --git a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_selects.less b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_selects.less index 76973802a3d2e..49ce5376c4ffc 100644 --- a/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_selects.less +++ b/app/design/adminhtml/Magento/backend/web/app/setup/styles/less/lib/forms/_selects.less @@ -52,13 +52,13 @@ &:before { border-color: @form-el__color transparent transparent transparent; border-style: solid; - border-width: @select-check__height @select-check__width / 2 0 @select-check__width / 2; + border-width: @select-check__height (@select-check__width / 2) 0 (@select-check__width / 2); content: ''; height: 0; margin-right: -(@select-check__width / 2); margin-top: -(@select-check__height / 2); position: absolute; - right: @select-check__size / 2; + right: (@select-check__size / 2); top: 50%; width: 0; z-index: -1; diff --git a/app/design/adminhtml/Magento/backend/web/css/source/_actions.less b/app/design/adminhtml/Magento/backend/web/css/source/_actions.less index 852c6c1f3799e..0909ad8b42d36 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/_actions.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/_actions.less @@ -148,7 +148,7 @@ // Right Triangle .abs-action-wrap-triangle-right { display: inline-block; - padding-right: @button-triangle__base__size - .1; + padding-right: (@button-triangle__base__size - .1); position: relative; .action-default { @@ -192,10 +192,10 @@ // Left Triangle .abs-action-wrap-triangle-left { display: inline-block; - padding-left: @button-triangle__base__size - .1; + padding-left: (@button-triangle__base__size - .1); .action-default { - text-indent: -(@button-triangle__base__size) / 2; + text-indent: (-(@button-triangle__base__size) / 2); &:before, &:after { 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 48d92e1d447c3..b98cc310221d4 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/_grid.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/_grid.less @@ -65,8 +65,8 @@ margin-left: -(@content__indent / 2); margin-right: -(@content__indent / 2); > [class*='col-'] { - padding-left: @content__indent / 2; - padding-right: @content__indent / 2; + padding-left: (@content__indent / 2); + padding-right: (@content__indent / 2); } } @@ -81,7 +81,7 @@ } .return_length(@_columns-min, @_total: @temp_columns, @mathSymbol: '-') { - @_part: @_columns-min/@_total; + @_part: (@_columns-min/@_total); @_length: ~'calc( (100%) * @{_part} @{mathSymbol} @{temp_gutter} )'; } diff --git a/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-dropdown.less b/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-dropdown.less index d1fe33c4fe77d..0bcb6809ab728 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-dropdown.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-dropdown.less @@ -72,7 +72,7 @@ &:after { background-color: @action-dropdown__background-color; content: ''; - height: @component__shadow-size__base + 1; + height: (@component__shadow-size__base + 1); position: absolute; top: 100%; } diff --git a/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-multicheck.less b/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-multicheck.less index 4bf2ce6e8e0c3..f8a48c735be78 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-multicheck.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-multicheck.less @@ -15,7 +15,7 @@ height: @control-checkbox-radio__size; padding-top: 1px; position: relative; - width: @control-checkbox-radio__size * 2 - .1rem; + width: (@control-checkbox-radio__size * 2 - .1rem); z-index: @action-multicheck__z-index; &:hover { 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 c3cbffe4e8c4f..f4bbfe4cfdcf4 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 @@ -39,7 +39,7 @@ @action-multiselect-tree-lines__color: @color-gray65-almost; @action-multiselect-tree-lines__size: 1px; @action-multiselect-tree-lines__style: dashed; -@action-multiselect-tree-menu-item__margin-left: @action-multiselect-tree-arrow__size + @action-multiselect-tree-level__width; +@action-multiselect-tree-menu-item__margin-left: (@action-multiselect-tree-arrow__size + @action-multiselect-tree-level__width); // // Multiselect default view @@ -84,16 +84,16 @@ cursor: pointer; display: block; min-height: @action__height; - padding-right: @action__height + .4rem; + padding-right: (@action__height + .4rem); white-space: normal; &:after { - bottom: @action__height / 2 - @button-marker-triangle__height / 2 - .1rem; + bottom: (@action__height / 2 - @button-marker-triangle__height / 2 - .1rem); top: auto; } &:before { - height: @action__height + .1rem; + height: (@action__height + .1rem); top: auto; } @@ -341,7 +341,7 @@ &._with-checkbox { .admin__action-multiselect-label { - padding-left: @control-checkbox-radio__size + 1rem; + padding-left: (@control-checkbox-radio__size + 1rem); } } } @@ -350,10 +350,10 @@ position: relative; .admin__action-multiselect-menu-inner { - padding-left: @action-multiselect-tree-menu-item__margin-left - @action-multiselect-menu-item__padding; + padding-left: (@action-multiselect-tree-menu-item__margin-left - @action-multiselect-menu-item__padding); &:before { - left: @action-multiselect-menu-item__padding + @action-multiselect-tree-arrow__size + @action-multiselect-tree-arrow__size/2; + left: (@action-multiselect-menu-item__padding + @action-multiselect-tree-arrow__size + @action-multiselect-tree-arrow__size/2); } } } @@ -363,7 +363,7 @@ &:last-child { &:before { - height: @action-multiselect-menu-item__padding + @action-multiselect-tree-arrow__size/2; + height: (@action-multiselect-menu-item__padding + @action-multiselect-tree-arrow__size/2); } } @@ -378,7 +378,7 @@ &:after { border-top: @action-multiselect-tree-lines; height: 1px; - top: @action-multiselect-menu-item__padding + @action-multiselect-tree-arrow__size/2; + top: (@action-multiselect-menu-item__padding + @action-multiselect-tree-arrow__size/2); width: @action-multiselect-tree-menu-item__margin-left; } @@ -402,12 +402,12 @@ margin-left: -@action-multiselect-menu-item__padding; &:after { - left: @action-multiselect-tree-arrow__size + @action-multiselect-menu-item__padding; + left: (@action-multiselect-tree-arrow__size + @action-multiselect-menu-item__padding); width: @action-multiselect-tree-arrow__size; } &:before { - left: @action-multiselect-tree-arrow__size + @action-multiselect-menu-item__padding; + left: (@action-multiselect-tree-arrow__size + @action-multiselect-menu-item__padding); top: @action-multiselect-menu-item__padding; } @@ -419,7 +419,7 @@ &:first-child { &:before { - top: @action-multiselect-menu-item__padding + @action-multiselect-tree-arrow__size/2; + top: (@action-multiselect-menu-item__padding + @action-multiselect-tree-arrow__size/2); } } diff --git a/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-split.less b/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-split.less index 9c1156a4bc06c..ee776d8fcf92f 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-split.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/actions/_actions-split.less @@ -18,7 +18,7 @@ @_action-toggle__width: @_dropdown__padding-right; @_triangle__height: @button-marker-triangle__height__xl; - @_triangle__right: (@_dropdown__padding-right / 2) - (@_triangle__width / 2); + @_triangle__right: ((@_dropdown__padding-right / 2) - (@_triangle__width / 2)); @_triangle__width: @button-marker-triangle__width__xl; .action-default { @@ -29,7 +29,7 @@ padding-right: @_dropdown__padding-right; &:after { - border-width: @_triangle__height @_triangle__width / 2 0 @_triangle__width / 2; + border-width: @_triangle__height (@_triangle__width / 2) 0 (@_triangle__width / 2); margin-top: -((@_triangle__width / 2) / 2); right: @_triangle__right; } 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 1a5e3f8f4f80b..64b8d3d265fdf 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 @@ -49,7 +49,7 @@ + .admin__control-support-text, + .admin__control-label { - margin-left: @action__height + .5rem; + margin-left: (@action__height + .5rem); } img { @@ -66,7 +66,7 @@ box-sizing: border-box; display: none; opacity: @component-modal__opacity; - padding: @ui-datepicker__padding + @ui-datepicker__indent @ui-datepicker__padding; + padding: (@ui-datepicker__padding + @ui-datepicker__indent) @ui-datepicker__padding; width: auto; z-index: 999999 !important; diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_data-tooltip.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_data-tooltip.less index 5abe13365fb9f..46e1f13d7e5da 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/components/_data-tooltip.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_data-tooltip.less @@ -11,7 +11,7 @@ @data-tooltip__border-color: #007dbd; @data-tooltip__border-width: 1px; @data-tooltip__box-shadow: 2px 2px 8px 0 rgba(0, 0, 0, .3); -@data-tooltip__z-index: @overlay__z-index - 1; +@data-tooltip__z-index: (@overlay__z-index - 1); @data-tooltip-tail__height: 22px; @data-tooltip-tail__width: @data-tooltip-tail__height; @@ -35,7 +35,7 @@ .data-tooltip-tail { display: block; left: 50%; - margin-left: -@data-tooltip-tail__width / 2; + margin-left: (-@data-tooltip-tail__width / 2); top: -(@data-tooltip-tail__height / 2 - @data-tooltip__border-width); } } @@ -43,18 +43,18 @@ &._right { .data-tooltip-tail { display: block; - margin-top: -@data-tooltip-tail__width / 2; - right: @data-tooltip-tail__height / 2 + @data-tooltip__border-width; + margin-top: (-@data-tooltip-tail__width / 2); + right: (@data-tooltip-tail__height / 2 + @data-tooltip__border-width); top: 50%; } } &._bottom { .data-tooltip-tail { - bottom: @data-tooltip-tail__height / 2 + @data-tooltip__border-width; + bottom: (@data-tooltip-tail__height / 2 + @data-tooltip__border-width); display: block; left: 50%; - margin-left: -@data-tooltip-tail__width / 2; + margin-left: (-@data-tooltip-tail__width / 2); } } @@ -62,7 +62,7 @@ .data-tooltip-tail { display: block; left: -(@data-tooltip-tail__height / 2 - @data-tooltip__border-width); - margin-top: -@data-tooltip-tail__width / 2; + margin-top: (-@data-tooltip-tail__width / 2); top: 50%; } } @@ -132,18 +132,18 @@ top: 0; transform: rotate(45deg); width: @data-tooltip-tail__width; - z-index: @data-tooltip-tail__z-index - 1; + z-index: (@data-tooltip-tail__z-index - 1); } &:after { background-color: @data-tooltip__background-color; content: ''; - height: @data-tooltip-tail__height - @data-tooltip__border-width * 2; + height: (@data-tooltip-tail__height - @data-tooltip__border-width * 2); left: @data-tooltip__border-width; position: absolute; top: @data-tooltip__border-width; transform: rotate(45deg); - width: @data-tooltip-tail__width - @data-tooltip__border-width * 2; - z-index: @data-tooltip-tail__z-index + 1; + width: (@data-tooltip-tail__width - @data-tooltip__border-width * 2); + z-index: (@data-tooltip-tail__z-index + 1); } } diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_file-uploader.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_file-uploader.less index ec276449263a4..ec3b064e318af 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/components/_file-uploader.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_file-uploader.less @@ -17,14 +17,14 @@ @file-uploader-document-icon__color: @color-gray80; @file-uploader-document-icon__size: 7rem; -@file-uploader-document-icon__z-index: @data-grid-file-uploader-image__z-index + 1; +@file-uploader-document-icon__z-index: (@data-grid-file-uploader-image__z-index + 1); @file-uploader-video-icon__color: @color-gray80; @file-uploader-video-icon__size: 4rem; -@file-uploader-video-icon__z-index: @data-grid-file-uploader-image__z-index + 1; +@file-uploader-video-icon__z-index: (@data-grid-file-uploader-image__z-index + 1); @file-uploader-placeholder-icon__color: @color-gray80; -@file-uploader-placeholder-icon__z-index: @data-grid-file-uploader-image__z-index + 1; +@file-uploader-placeholder-icon__z-index: (@data-grid-file-uploader-image__z-index + 1); @file-uploader-delete-icon__color: @color-brownie; @file-uploader-delete-icon__hover__color: @color-brownie-vanilla; @@ -52,7 +52,7 @@ @data-grid-file-uploader-upload-icon__hover__color: @color-very-dark-gray; @data-grid-file-uploader-upload-icon__line-height: 48px; -@data-grid-file-uploader-wrapper__size: @data-grid-file-uploader-image__size + 2rem; +@data-grid-file-uploader-wrapper__size: (@data-grid-file-uploader-image__size + 2rem); // // Single file uploader @@ -170,7 +170,7 @@ &:before { left: 0; - margin-top: -@file-uploader-video-icon__size / 2; + margin-top: (-@file-uploader-video-icon__size / 2); position: absolute; right: 0; top: 50%; @@ -189,7 +189,7 @@ &:before { left: 0; - margin-top: -@file-uploader-document-icon__size / 2; + margin-top: (-@file-uploader-document-icon__size / 2); position: absolute; right: 0; top: 50%; @@ -361,7 +361,7 @@ } .file-uploader-area { - z-index: @data-grid-file-uploader-image__z-index + 1; + z-index: (@data-grid-file-uploader-image__z-index + 1); } .file-uploader-spinner { @@ -420,7 +420,7 @@ .action-menu { left: 4rem; right: auto; - z-index: @data-grid-file-uploader-image__z-index + 1; + z-index: (@data-grid-file-uploader-image__z-index + 1); } } } diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_media-gallery.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_media-gallery.less index 35712c0c0bb74..22915fbadd7c5 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/components/_media-gallery.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_media-gallery.less @@ -9,7 +9,7 @@ @image-gallery__margin-bottom: 3rem; -@image-gallery-image-hidden__z-index: @image-gallery-image__z-index + 1; +@image-gallery-image-hidden__z-index: (@image-gallery-image__z-index + 1); @image-gallery-image__margin: 1.2rem; @image-gallery-image__z-index: 1; @image-gallery-image-title__font-size: 1.3rem; @@ -26,9 +26,9 @@ @image-gallery-icons__color: @color-gray34; @image-gallery-icons__hover__color: @color-gray52; -@image-gallery-action__z-index: @image-gallery-image-hidden__z-index + 1; +@image-gallery-action__z-index: (@image-gallery-image-hidden__z-index + 1); -@image-gallery-fade__z-index: @image-gallery-action__z-index + 1; +@image-gallery-fade__z-index: (@image-gallery-action__z-index + 1); // // Image Management diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_modals_extend.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_modals_extend.less index 72e9088f7cd34..e0faf565ae0d0 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/components/_modals_extend.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_modals_extend.less @@ -122,15 +122,15 @@ .modal-title { font-size: @modal-popup-title__font-size; - margin-right: @modal-popup-title__font-size + @modal-popup__padding + 1rem; + margin-right: (@modal-popup-title__font-size + @modal-popup__padding + 1rem); } .action-close { padding: @modal-popup__padding @modal-popup__padding; &:active { - padding-right: @modal-popup__padding + (@modal-action-close__font-size - @modal-action-close__active__font-size) / 3; - padding-top: @modal-popup__padding + (@modal-action-close__font-size - @modal-action-close__active__font-size) / 3; + padding-right: (@modal-popup__padding + (@modal-action-close__font-size - @modal-action-close__active__font-size) / 3); + padding-top: (@modal-popup__padding + (@modal-action-close__font-size - @modal-action-close__active__font-size) / 3); } } @@ -150,13 +150,13 @@ } .action-close { - padding: @modal-popup__padding - 2; + padding: (@modal-popup__padding - 2); &:active, &:focus { background: transparent; - padding-right: @modal-popup__padding - 2; - padding-top: @modal-popup__padding - 2; + padding-right: (@modal-popup__padding - 2); + padding-top: (@modal-popup__padding - 2); } } } @@ -174,20 +174,20 @@ .modal-title { font-size: @modal-slide-title__font-size; - margin-right: @modal-slide-title__font-size + @modal-slide__padding + 1rem; + margin-right: (@modal-slide-title__font-size + @modal-slide__padding + 1rem); } .action-close { padding: @modal-slide-header__padding-vertical @modal-slide__padding; &:active { - padding-right: @modal-slide__padding + (@modal-action-close__font-size - @modal-action-close__active__font-size) / 2; - padding-top: @modal-slide-header__padding-vertical + (@modal-action-close__font-size - @modal-action-close__active__font-size) / 2; + padding-right: (@modal-slide__padding + (@modal-action-close__font-size - @modal-action-close__active__font-size) / 2); + padding-top: (@modal-slide-header__padding-vertical + (@modal-action-close__font-size - @modal-action-close__active__font-size) / 2); } } .page-main-actions { - margin-bottom: @modal-slide-header__padding-vertical - @page-main-actions__padding; + margin-bottom: (@modal-slide-header__padding-vertical - @page-main-actions__padding); margin-top: @modal-slide-header__padding-vertical; } diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_popups.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_popups.less index 4242e036b8b5c..286bc5ebedb4d 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/components/_popups.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_popups.less @@ -34,7 +34,7 @@ color: @popup-title__color; font-size: @popup-title__font-size; line-height: @popup-title__line-height; - padding: @popup__padding__vertical @popup__padding__horizontal * 2 @popup__padding__vertical @popup__padding__horizontal; + padding: @popup__padding__vertical (@popup__padding__horizontal * 2) @popup__padding__vertical @popup__padding__horizontal; } .ui-dialog-titlebar-close { @@ -45,7 +45,7 @@ position: absolute; right: @popup-close-icon__right; text-shadow: none; - top: @popup-close-icon__top - .3; + top: (@popup-close-icon__top - .3); .ui-icon { display: none; diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_resizable-block.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_resizable-block.less index 310e3505f1620..450e66176e195 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/components/_resizable-block.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_resizable-block.less @@ -82,12 +82,12 @@ cursor: n-resize; height: @resizable-block-side-handle__default__size; left: 0; - top: -@resizable-block-side-handle__default__size/2; + top: (-@resizable-block-side-handle__default__size/2); width: 100%; } .ui-resizable-s { - bottom: -@resizable-block-side-handle__default__size/2; + bottom: (-@resizable-block-side-handle__default__size/2); cursor: s-resize; height: @resizable-block-side-handle__default__size; left: 0; @@ -97,7 +97,7 @@ .ui-resizable-e { cursor: e-resize; height: 100%; - right: -@resizable-block-side-handle__default__size/2; + right: (-@resizable-block-side-handle__default__size/2); top: 0; width: @resizable-block-side-handle__default__size; } @@ -105,40 +105,40 @@ .ui-resizable-w { cursor: w-resize; height: 100%; - left: -@resizable-block-side-handle__default__size/2; + left: (-@resizable-block-side-handle__default__size/2); top: 0; width: @resizable-block-side-handle__default__size; } .ui-resizable-se { - bottom: -@resizable-block-angle-handle__default__height/2; + bottom: (-@resizable-block-angle-handle__default__height/2); cursor: se-resize; height: @resizable-block-angle-handle__default__height; - right: -@resizable-block-angle-handle__default__width/2; + right: (-@resizable-block-angle-handle__default__width/2); width: @resizable-block-angle-handle__default__width; } .ui-resizable-sw { - bottom: -@resizable-block-angle-handle__default__height/2; + bottom: (-@resizable-block-angle-handle__default__height/2); cursor: sw-resize; height: @resizable-block-angle-handle__default__height; - left: -@resizable-block-angle-handle__default__width/2; + left: (-@resizable-block-angle-handle__default__width/2); width: @resizable-block-angle-handle__default__width; } .ui-resizable-nw { cursor: nw-resize; height: @resizable-block-angle-handle__default__height; - left: -@resizable-block-angle-handle__default__width/2; - top: -@resizable-block-angle-handle__default__height/2; + left: (-@resizable-block-angle-handle__default__width/2); + top: (-@resizable-block-angle-handle__default__height/2); width: @resizable-block-angle-handle__default__width; } .ui-resizable-ne { cursor: ne-resize; height: @resizable-block-angle-handle__default__height; - right: -@resizable-block-angle-handle__default__width/2; - top: -@resizable-block-angle-handle__default__height/2; + right: (-@resizable-block-angle-handle__default__width/2); + top: (-@resizable-block-angle-handle__default__height/2); width: @resizable-block-angle-handle__default__width; } diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_slider.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_slider.less index c8baf3b464d6c..a87fab4d9166b 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/components/_slider.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_slider.less @@ -69,11 +69,11 @@ cursor: pointer; display: block; height: @data-slider-handle__height; - margin-left: -@data-slider-handle__width / 2 !important; + margin-left: (-@data-slider-handle__width / 2) !important; position: absolute; - top: -@data-slider-handle__height / 2; + top: (-@data-slider-handle__height / 2); width: @data-slider-handle__width; - z-index: @data-slider-track__z-index + 1 !important; + z-index: (@data-slider-track__z-index + 1) !important; &:before { .lib-background-gradient( @@ -88,7 +88,7 @@ display: block; height: @data-slider-handle-accent__height; left: 50%; - margin: -@data-slider-handle-accent__height / 2 0 0 -@data-slider-handle-accent__width / 2; + margin: (-@data-slider-handle-accent__height / 2) 0 0 (-@data-slider-handle-accent__width / 2); position: absolute; top: 50%; width: @data-slider-handle-accent__width; diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_spinner.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_spinner.less index f6f61c1efae91..0ae0b6a4f0182 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/components/_spinner.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_spinner.less @@ -27,9 +27,9 @@ ._spinner_transform(); background-color: @spinner-second-color; border-radius: @spinner-border-radius; - clip: rect(0 1em/3.5 .1em 0); + clip: rect(0 (1em/3.5) .1em 0); height: .1em; - margin-top: 1em / 2; + margin-top: (1em / 2); position: absolute; width: 1em; } diff --git a/app/design/adminhtml/Magento/backend/web/css/source/components/_timeline.less b/app/design/adminhtml/Magento/backend/web/css/source/components/_timeline.less index 4fa8a1daa9536..bcb524e1c2c60 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/components/_timeline.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/components/_timeline.less @@ -14,7 +14,7 @@ @timeline__no-records__background-color: @color-white; @timeline-item__height: 3.6rem; -@timeline-unit__width: 100%/7; +@timeline-unit__width: (100% / 7); @timeline-event__background-color: #ccf391; @timeline-event__border-color: #81c21d; @@ -130,7 +130,7 @@ .timeline-items { .extend__list-reset-styles(); - min-height: @timeline-item__height * 7; + min-height: (@timeline-item__height * 7); position: relative; } @@ -346,7 +346,7 @@ svg { list-style-type: none; margin: 0; padding: 0; - width: @timeline-unit__width/@timeline__scale; + width: (@timeline-unit__width/@timeline__scale); &:last-child { border-right: 0; @@ -366,7 +366,7 @@ svg { content: ''; margin-left: -1px; position: absolute; - top: @font-size__tiny + 2rem + .2rem; + top: (@font-size__tiny + 2rem + .2rem); width: 1px; z-index: 0; } 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 c6f39e8e8840d..d4ec2a401ae99 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 @@ -233,7 +233,7 @@ option:empty { .admin__control-text { margin: .1rem; - padding: @field-control__padding-top - .1rem @field-control__padding-horizontal - .1rem @field-control__padding-bottom - .1rem; + padding: (@field-control__padding-top - .1rem) (@field-control__padding-horizontal - .1rem) (@field-control__padding-bottom - .1rem); width: 100%; } diff --git a/app/design/adminhtml/Magento/backend/web/css/source/forms/_extends.less b/app/design/adminhtml/Magento/backend/web/css/source/forms/_extends.less index 9ba5458fd3684..ca38633e560de 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/forms/_extends.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/forms/_extends.less @@ -40,8 +40,8 @@ display: block; line-height: @field-label__font-size; // Try to Calculate margin offset considering line-height; - margin-bottom: 1rem - round((@field-label__line-height - 1) * @field-label__font-size / 2, 2); - margin-top: 0 - round((@field-label__line-height - 1) * @field-label__font-size / 2, 2); + margin-bottom: (1rem - round(((@field-label__line-height - 1) * @field-label__font-size / 2), 2)); + margin-top: (0 - round(((@field-label__line-height - 1) * @field-label__font-size / 2), 2)); text-align: left; width: auto; 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 b86b0005e88fb..fe46e826c5c41 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 @@ -335,7 +335,7 @@ font-size: @font-size__s; left: @_length; line-height: 3.2rem; - margin-left: 2 * @temp_gutter; + margin-left: (2 * @temp_gutter); position: absolute; & { diff --git a/app/design/adminhtml/Magento/backend/web/css/source/forms/_temp.less b/app/design/adminhtml/Magento/backend/web/css/source/forms/_temp.less index 71f57b765ff0e..54b94860421d5 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/forms/_temp.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/forms/_temp.less @@ -233,8 +233,8 @@ label.mage-error { .popup-loading { height: 149px; left: 50%; - margin-left: -218px/2; - margin-top: -149px/2; + margin-left: (-218px/2); + margin-top: (-149px/2); overflow: hidden; position: absolute; top: 50%; diff --git a/app/design/adminhtml/Magento/backend/web/css/source/forms/controls/_checkbox-radio.less b/app/design/adminhtml/Magento/backend/web/css/source/forms/controls/_checkbox-radio.less index a68a725fa653b..a89b2ac8b9271 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/forms/controls/_checkbox-radio.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/forms/controls/_checkbox-radio.less @@ -38,7 +38,7 @@ // Label with text content + .admin__field-label { - padding-left: @control-checkbox-radio__size + @field-label__indent; + padding-left: (@control-checkbox-radio__size + @field-label__indent); &:before { margin: 1px @field-label__indent 0 -(@control-checkbox-radio__size + @field-label__indent); diff --git a/app/design/adminhtml/Magento/backend/web/css/source/forms/fields/_control-collapsible.less b/app/design/adminhtml/Magento/backend/web/css/source/forms/fields/_control-collapsible.less index 006a2a7c68ce5..90b64363ce618 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/forms/fields/_control-collapsible.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/forms/fields/_control-collapsible.less @@ -19,8 +19,8 @@ @control-collapsible-title-icon-open__size: 1.8rem; @control-collapsible-title-icon-remove__size: @indent__base; @control-collapsible-title__background-color: @color-white-fog; -@control-collapsible-title__padding-left: @control-collapsible-title-icon-open__size + @control-collapsible-title__padding__horizontal * 2; -@control-collapsible-title__padding-right: @control-collapsible-title-icon-remove__size + @control-collapsible-title__padding__horizontal * 2; +@control-collapsible-title__padding-left: (@control-collapsible-title-icon-open__size + @control-collapsible-title__padding__horizontal * 2); +@control-collapsible-title__padding-right: (@control-collapsible-title-icon-remove__size + @control-collapsible-title__padding__horizontal * 2); @control-collapsible-title__padding__horizontal: @indent__s; @control-collapsible-title__padding__vertical: 1.6rem; 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 befd27fa57df6..bd03cbf64951b 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 @@ -49,7 +49,7 @@ display: inline-block; margin-left: @field-tooltip-action__margin-left; position: relative; - z-index: @field-tooltip-content__z-index + 1; + z-index: (@field-tooltip-content__z-index + 1); .lib-icon-font( @icon-help__content, @@ -71,9 +71,9 @@ .admin__field-tooltip-content { &:extend(.abs-admin__field-tooltip-content all); - bottom: @field-tooltip-icon__size + @field-tooltip-content-arrow__size; + bottom: (@field-tooltip-icon__size + @field-tooltip-content-arrow__size); display: none; - right: -@field-tooltip-content-arrow__margin - (@field-tooltip-icon__size/2) + (@field-tooltip-content-arrow__size/2); + right: (-@field-tooltip-content-arrow__margin - (@field-tooltip-icon__size/2) + (@field-tooltip-content-arrow__size/2)); &:after, &:before { diff --git a/app/design/adminhtml/Magento/backend/web/css/source/utilities/_actions.less b/app/design/adminhtml/Magento/backend/web/css/source/utilities/_actions.less index 2916f438253be..53fa2ad9fd24a 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/utilities/_actions.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/utilities/_actions.less @@ -41,7 +41,7 @@ @_triangle__width: @button-marker-triangle__width; @_triangle__color: @color-black; @_triangle__hover__color: darken(@_triangle__color, 10%); - @_triangle__right: (@_dropdown__padding-right / 2) - (@_triangle__width / 2); + @_triangle__right: (((@_dropdown__padding-right / 2) - (@_triangle__width / 2))); ) { padding-right: @_dropdown__padding-right; @@ -55,7 +55,7 @@ &:after { border-color: @_triangle__color transparent transparent transparent; border-style: solid; - border-width: @_triangle__height @_triangle__width / 2 0 @_triangle__width / 2; + border-width: @_triangle__height (@_triangle__width / 2) 0 (@_triangle__width / 2); content: ''; height: 0; margin-top: -((@_triangle__width / 2) / 2); diff --git a/app/design/adminhtml/Magento/backend/web/css/source/variables/_actions.less b/app/design/adminhtml/Magento/backend/web/css/source/variables/_actions.less index e58421448d3aa..7fde10157d21d 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/variables/_actions.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/variables/_actions.less @@ -89,12 +89,12 @@ @action-dropdown__color: @text__color; @action-dropdown__background-color: @page-wrapper__background-color; @action-dropdown__border-color: @color-light-gray; -@action-dropdown__font-size: round(@font-size__base - .1rem, 1); +@action-dropdown__font-size: round((@font-size__base - .1rem), 1); @action-dropdown__height: @action__height; @action-dropdown__padding-top: .7rem; @action-dropdown__padding-bottom: .8rem; @action-dropdown__padding-horizontal: 1.5rem; -@action-dropdown__padding-right: @action-dropdown__padding-horizontal + @action-dropdown-menu__padding-horizontal + @button-marker-triangle__width; +@action-dropdown__padding-right: (@action-dropdown__padding-horizontal + @action-dropdown-menu__padding-horizontal + @button-marker-triangle__width); @action-dropdown__active__border-color: @color-blue-pure; @action-dropdown__hover__color: darken(@action-dropdown__color, 20%); @@ -102,4 +102,4 @@ @action-dropdown-menu__padding-horizontal: 1rem; @action-dropdown-menu-link__padding-vertical: .6rem; -@action-dropdown-menu-link__padding-horizontal: @action-dropdown__padding-horizontal - @action-dropdown-menu__padding-horizontal; +@action-dropdown-menu-link__padding-horizontal: (@action-dropdown__padding-horizontal - @action-dropdown-menu__padding-horizontal); diff --git a/app/design/adminhtml/Magento/backend/web/css/source/variables/_components.less b/app/design/adminhtml/Magento/backend/web/css/source/variables/_components.less index 6f96880cce49b..e3b34d97f2d2a 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/variables/_components.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/variables/_components.less @@ -38,4 +38,4 @@ @page-main-actions__background-color: @color-white-fog; @page-main-actions__border-color: @color-gray89; -@page-main-actions__padding: @content__indent / 2; +@page-main-actions__padding: (@content__indent / 2); diff --git a/app/design/adminhtml/Magento/backend/web/css/source/variables/_data-grid.less b/app/design/adminhtml/Magento/backend/web/css/source/variables/_data-grid.less index 40831684adceb..aabfca947c244 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/variables/_data-grid.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/variables/_data-grid.less @@ -72,4 +72,4 @@ @data-grid-header-row__indent: @indent__base; -@data-grid-action__z-index: @data-grid-header__z-index - 10; +@data-grid-action__z-index: (@data-grid-header__z-index - 10); diff --git a/app/design/adminhtml/Magento/backend/web/css/source/variables/_spinner.less b/app/design/adminhtml/Magento/backend/web/css/source/variables/_spinner.less index 60b84b1f467fe..0d7e1b357efda 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/variables/_spinner.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/variables/_spinner.less @@ -16,7 +16,7 @@ @spinner-second-color: @color-white; @spinner-keyframe-name: fade; @spinner-animation-step: .09s; -@spinner-animation-duration: @spinner-animation-step * @spinner-spin-count; +@spinner-animation-duration: (@spinner-animation-step * @spinner-spin-count); @spinner-animation-transform: scale(.4); @spinner-animation-iteration-count: infinite; @spinner-animation-direction: linear; diff --git a/app/design/adminhtml/Magento/backend/web/css/source/variables/_structure.less b/app/design/adminhtml/Magento/backend/web/css/source/variables/_structure.less index 91f3b5c4fa26c..1e072c303b1cf 100644 --- a/app/design/adminhtml/Magento/backend/web/css/source/variables/_structure.less +++ b/app/design/adminhtml/Magento/backend/web/css/source/variables/_structure.less @@ -12,11 +12,11 @@ // --------------------------------------------- @indent__base: 2rem; // 20px -@indent__xl: @indent__base * 2; // 40px -@indent__l: @indent__base * 1.5; // 30px -@indent__m: @indent__base * 1.25; // 25px -@indent__s: @indent__base / 2; // 10px -@indent__xs: @indent__base / 4; // 5px +@indent__xl: (@indent__base * 2); // 40px +@indent__l: (@indent__base * 1.5); // 30px +@indent__m: (@indent__base * 1.25); // 25px +@indent__s: (@indent__base / 2); // 10px +@indent__xs: (@indent__base / 4); // 5px // // Z axis @@ -31,9 +31,9 @@ // z-index 4 @page-actions__fixed__z-index: @z-index-4; @data-grid-overlay__z-index: @z-index-4; -@data-grid-sticky-header__z-index: @page-actions__fixed__z-index - 2; -@data-grid-overlay__z-index: @data-grid-sticky-header__z-index + 1; -@actions-split__z-index: @data-grid-overlay__z-index + 1; +@data-grid-sticky-header__z-index: (@page-actions__fixed__z-index - 2); +@data-grid-overlay__z-index: (@data-grid-sticky-header__z-index + 1); +@actions-split__z-index: (@data-grid-overlay__z-index + 1); // z-index 5 @header__z-index: @z-index-5; diff --git a/app/design/adminhtml/Magento/backend/web/mui/clearless/_arrows.less b/app/design/adminhtml/Magento/backend/web/mui/clearless/_arrows.less index f9ccd83a6e7bb..41417ad406581 100644 --- a/app/design/adminhtml/Magento/backend/web/mui/clearless/_arrows.less +++ b/app/design/adminhtml/Magento/backend/web/mui/clearless/_arrows.less @@ -49,7 +49,7 @@ &:before { border-color: transparent; ._abbor_el(@pos, @border-color); - border-width: @before-margin * -1; + border-width: (@before-margin * -1); ._abpos_el(@pos, @size, @offset); ._abmar_el(@pos, @before-margin); } diff --git a/app/design/adminhtml/Magento/backend/web/mui/clearless/_icons.less b/app/design/adminhtml/Magento/backend/web/mui/clearless/_icons.less index 024c7b6aa2563..f08f5edd6cf17 100644 --- a/app/design/adminhtml/Magento/backend/web/mui/clearless/_icons.less +++ b/app/design/adminhtml/Magento/backend/web/mui/clearless/_icons.less @@ -14,7 +14,7 @@ .prepend-icon( @icon-image, @width, @height, @nudge-left:0, @nudge-top:0, @pad:10px ) when (@using-modernizr) { .generatedcontent & { position: relative; - padding-left: @width + @pad; + padding-left: (@width + @pad); } .generatedcontent &:before { ._generated-icon( @width, @height, @icon-image ); @@ -25,7 +25,7 @@ .prepend-icon( @icon-image, @width, @height, @nudge-left:0, @nudge-top:0, @pad:10px ) when not (@using-modernizr) { position: relative; - padding-left: @width + @pad; + padding-left: (@width + @pad); &:before { ._generated-icon( @width, @height, @icon-image ); top: @nudge-top; @@ -36,7 +36,7 @@ .append-icon( @icon-image, @width, @height, @nudge-right:0, @nudge-top:0, @pad:10px ) when (@using-modernizr) { .generatedcontent & { position: relative; - padding-right: @width + @pad; + padding-right: (@width + @pad); } .generatedcontent &:after { ._generated-icon( @width, @height, @icon-image ); @@ -47,7 +47,7 @@ .append-icon( @icon-image, @width, @height, @nudge-right:0, @nudge-top:0, @pad:10px ) when not (@using-modernizr) { position: relative; - padding-right: @width + @pad; + padding-right: (@width + @pad); .generatedcontent &:after { ._generated-icon( @width, @height, @icon-image ); top: @nudge-top; @@ -60,7 +60,7 @@ .prepend-sprite-icon(@x, @y, @width, @height, @nudge-left:0, @nudge-top:0, @pad:10px, @sprite-image:@sprite-image, @sprite-grid:@sprite-grid) when (@using-modernizr) { .generatedcontent & { position: relative; - padding-left: @width + @pad; + padding-left: (@width + @pad); } .generatedcontent &:before { ._generated-sprite-icon( @x, @y, @width, @height, @sprite-image, @sprite-grid ); @@ -71,7 +71,7 @@ .prepend-sprite-icon(@x, @y, @width, @height, @nudge-left:0, @nudge-top:0, @pad:10px, @sprite-image:@sprite-image, @sprite-grid:@sprite-grid) when not (@using-modernizr) { position: relative; - padding-left: @width + @pad; + padding-left: (@width + @pad); &:before { ._generated-sprite-icon( @x, @y, @width, @height, @sprite-image, @sprite-grid ); top: @nudge-top; @@ -81,7 +81,7 @@ .append-sprite-icon(@x, @y, @width, @height, @nudge-right:0, @nudge-top:0, @pad:10px, @sprite-image:@sprite-image, @sprite-grid:@sprite-grid) when (@using-modernizr) { .generatedcontent & { - padding-right: @width + @pad; + padding-right: (@width + @pad); position: relative; } .generatedcontent &:after { @@ -93,7 +93,7 @@ .append-sprite-icon(@x, @y, @width, @height, @nudge-right:0, @nudge-top:0, @pad:10px, @sprite-image:@sprite-image, @sprite-grid:@sprite-grid) when not (@using-modernizr) { position: relative; - padding-right: @width + @pad; + padding-right: (@width + @pad); &:after { ._generated-sprite-icon( @x, @y, @width, @height, @sprite-image, @sprite-grid ); top: @nudge-top; @@ -252,14 +252,14 @@ } ._pad-left(@width, @pad) when not (@width = 0) { - padding-left: @width + @pad; + padding-left: (@width + @pad); } ._pad-right(@width, @pad) when (@width = 0) { } ._pad-right(@width, @pad) when not (@width = 0) { - padding-right: @width + @pad; + padding-right: (@width + @pad); } ._gc-pad-left(@width, @pad) when (@width = 0) { diff --git a/app/design/adminhtml/Magento/backend/web/mui/styles/_vars.less b/app/design/adminhtml/Magento/backend/web/mui/styles/_vars.less index 261c2eaddb95a..9c30173de4c91 100644 --- a/app/design/adminhtml/Magento/backend/web/mui/styles/_vars.less +++ b/app/design/adminhtml/Magento/backend/web/mui/styles/_vars.less @@ -354,7 +354,7 @@ @button__padding: 6px 13px; @button__font-weight: 500; @button__font-size: 13px; -@button__line-height: @button__font-size + 1; +@button__line-height: (@button__font-size + 1); @button__color: #645d53; @button__background: #f2ebde; @button__border: 1px solid #ada89e; 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 f7be4a9edb13c..af3cfdf363468 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 @@ -330,14 +330,14 @@ margin: @indent__base 0; .field.qty { - padding-right: .75 * @indent__base; + padding-right: (.75 * @indent__base); } .input-text.qty { - @tocart-input-size: @button__line-height__l + 28px; - height: @tocart-input-size + 2px; + @tocart-input-size: (@button__line-height__l + 28px); + height: (@tocart-input-size + 2px); text-align: center; - width: @tocart-input-size + 2px; + width: (@tocart-input-size + 2px); } .actions { diff --git a/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/_widgets.less b/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/_widgets.less index 6da9a31caf5f0..7ba5e31aaf140 100644 --- a/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/_widgets.less +++ b/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/_widgets.less @@ -95,7 +95,7 @@ .block.widget .products-grid .product-item, .page-layout-1column .block.widget .products-grid .product-item, .page-layout-3columns .block.widget .products-grid .product-item { - width: 100%/3; + width: (100% / 3); } .page-layout-1column .block.widget .products-grid .product-item { @@ -114,7 +114,7 @@ .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) { .block.widget .products-grid .product-item { - width: 100%/3; + width: (100% / 3); .sidebar & { margin-left: 0; @@ -141,7 +141,7 @@ } .page-layout-3columns .block.widget .products-grid .product-item { - width: 100%/2; + width: (100% / 2); } .sidebar .block.widget .pager { @@ -161,7 +161,7 @@ .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__l) { .block.widget .products-grid .product-item { - width: 100%/5; + width: (100% / 5); } .page-layout-1column .block.widget .products-grid .product-item { @@ -178,7 +178,7 @@ } .page-layout-3columns .block.widget .products-grid .product-item { - width: 100%/4; + width: (100% / 4); } .block.widget .products-grid .product-items { diff --git a/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/module/_listings.less b/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/module/_listings.less index 50a5e6351533d..7e504468784c6 100644 --- a/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/module/_listings.less +++ b/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/module/_listings.less @@ -323,7 +323,7 @@ } .products-grid .product-item { - width: 100%/3; + width: (100% / 3); } .page-products, @@ -367,7 +367,7 @@ .page-products.page-layout-1column { .products-grid { .product-item { - width: 100%/4; + width: (100% / 4); } } } @@ -375,7 +375,7 @@ .page-products.page-layout-3columns { .products-grid { .product-item { - width: 100%/2; + width: (100% / 2); } } } @@ -383,14 +383,14 @@ .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__l) { .products-grid { .product-item { - width: 100%/5; + width: (100% / 5); } } .page-layout-1column { .products-grid { .product-item { - width: 100%/6; + width: (100% / 6); } } } @@ -398,7 +398,7 @@ .page-layout-3columns { .products-grid { .product-item { - width: 100%/4; + width: (100% / 4); } } } @@ -430,7 +430,7 @@ .products-grid { .product-item { margin-left: 0; - width: 100%/5; + width: (100% / 5); } } } diff --git a/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/module/_toolbar.less b/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/module/_toolbar.less index 8e7f36389c417..b12c0f44e1153 100644 --- a/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/module/_toolbar.less +++ b/app/design/frontend/Magento/blank/Magento_Catalog/web/css/source/module/_toolbar.less @@ -28,7 +28,7 @@ .toolbar-amount { display: block; - line-height: @toolbar-mode-icon-font-size + 2; + line-height: (@toolbar-mode-icon-font-size + 2); margin: 0; padding: 8px 0 0; vertical-align: middle; 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 3fdd20e34e09a..0f6a426734ddb 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 @@ -28,7 +28,7 @@ .authentication-wrapper { float: right; - margin-top: -1.5*@indent__xl; + margin-top: (-1.5*@indent__xl); max-width: 50%; position: relative; z-index: 1; diff --git a/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_shipping.less b/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_shipping.less index af6127fd2ca9f..8de2ad443016c 100644 --- a/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_shipping.less +++ b/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_shipping.less @@ -19,8 +19,8 @@ @checkout-shipping-item__margin: 0 0 @indent__base; @checkout-shipping-item__padding: @indent__base (@indent__l + 5px) @indent__base @indent__base; @checkout-shipping-item__transition: .3s border-color; -@checkout-shipping-item__width: 100%/3; -@checkout-shipping-item-tablet__width: 100%/2; +@checkout-shipping-item__width: (100% / 3); +@checkout-shipping-item-tablet__width: (100% / 2); @checkout-shipping-item-mobile__width: 100%; @checkout-shipping-item__active__border-color: @active__color; diff --git a/app/design/frontend/Magento/blank/Magento_GiftRegistry/web/css/source/_module.less b/app/design/frontend/Magento/blank/Magento_GiftRegistry/web/css/source/_module.less index 03a474012cb0c..21afb0ee9bffb 100644 --- a/app/design/frontend/Magento/blank/Magento_GiftRegistry/web/css/source/_module.less +++ b/app/design/frontend/Magento/blank/Magento_GiftRegistry/web/css/source/_module.less @@ -70,7 +70,7 @@ } .form-giftregistry-search { - margin-bottom: @indent__l*2; + margin-bottom: (@indent__l*2); .legend { &:extend(.abs-account-title all); diff --git a/app/design/frontend/Magento/blank/Magento_MultipleWishlist/web/css/source/_module.less b/app/design/frontend/Magento/blank/Magento_MultipleWishlist/web/css/source/_module.less index c572c983d80d9..42a27a4368df7 100644 --- a/app/design/frontend/Magento/blank/Magento_MultipleWishlist/web/css/source/_module.less +++ b/app/design/frontend/Magento/blank/Magento_MultipleWishlist/web/css/source/_module.less @@ -185,7 +185,7 @@ } .form-wishlist-search { - margin-bottom: @indent__l * 2; + margin-bottom: (@indent__l * 2); max-width: 500px; .fieldset { diff --git a/app/design/frontend/Magento/blank/Magento_Multishipping/web/css/source/_module.less b/app/design/frontend/Magento/blank/Magento_Multishipping/web/css/source/_module.less index 46f9661d8281d..bc1b5b58f85c6 100644 --- a/app/design/frontend/Magento/blank/Magento_Multishipping/web/css/source/_module.less +++ b/app/design/frontend/Magento/blank/Magento_Multishipping/web/css/source/_module.less @@ -30,7 +30,7 @@ .orders-list { margin-top: @indent__m; - padding-left: @indent__base - 4px; + padding-left: (@indent__base - 4px); .shipping-list { .shipping-item { 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 bf77ab46712b2..fcb84d32429ff 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 @@ -283,7 +283,7 @@ &-field-rating { .control { - margin-bottom: 1.2 * @indent__xl; + margin-bottom: (1.2 * @indent__xl); margin-top: @indent__s; } } @@ -342,7 +342,7 @@ &-ratings { float: left; margin-bottom: 0; - max-width: @review-ratings-left - @indent__xl; + max-width: (@review-ratings-left - @indent__xl); } &-ratings ~ &-content, diff --git a/app/design/frontend/Magento/blank/Magento_Sales/web/css/source/_email.less b/app/design/frontend/Magento/blank/Magento_Sales/web/css/source/_email.less index b189d4e08ba17..bae794556ccb0 100644 --- a/app/design/frontend/Magento/blank/Magento_Sales/web/css/source/_email.less +++ b/app/design/frontend/Magento/blank/Magento_Sales/web/css/source/_email.less @@ -17,7 +17,7 @@ // Shrink order number in order email so it will fit on single line on small screens .email-summary { h1 { - font-size: ceil(1.7 * @font-size__base) !important; // 24px + font-size: ceil((1.7 * @font-size__base)) !important; // 24px } } } diff --git a/app/design/frontend/Magento/blank/Magento_Sales/web/css/source/_module.less b/app/design/frontend/Magento/blank/Magento_Sales/web/css/source/_module.less index 298ccbf58e687..51482c071c53b 100644 --- a/app/design/frontend/Magento/blank/Magento_Sales/web/css/source/_module.less +++ b/app/design/frontend/Magento/blank/Magento_Sales/web/css/source/_module.less @@ -370,7 +370,7 @@ .page-title-wrapper { .order-date { - @order-status-indent: ceil(@h1__margin-bottom__desktop/2); + @order-status-indent: ceil((@h1__margin-bottom__desktop/2)); .lib-css(margin-top, -@order-status-indent); } } diff --git a/app/design/frontend/Magento/blank/web/css/source/_email-base.less b/app/design/frontend/Magento/blank/web/css/source/_email-base.less index 29f6fd0dcbcfc..19405fef8bc9e 100644 --- a/app/design/frontend/Magento/blank/web/css/source/_email-base.less +++ b/app/design/frontend/Magento/blank/web/css/source/_email-base.less @@ -250,7 +250,7 @@ body { td { a { - font-size: @button__font-size + 2; + font-size: (@button__font-size + 2); } } } 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 aa934282ad7b6..e3b12c59df4b3 100644 --- a/app/design/frontend/Magento/blank/web/css/source/_extends.less +++ b/app/design/frontend/Magento/blank/web/css/source/_extends.less @@ -380,7 +380,7 @@ .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) { .abs-action-remove-desktop when not (@form-field-type-label-inline__width = false) and not (@form-field-type-label-inline__width = '') { - margin-left: @form-field-type-label-inline__width + 50%; + margin-left: (@form-field-type-label-inline__width + 50%); top: 6px; } } 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 35d40924b5ab7..ab4e2ff7dcd4f 100644 --- a/app/design/frontend/Magento/blank/web/css/source/_popups.less +++ b/app/design/frontend/Magento/blank/web/css/source/_popups.less @@ -58,9 +58,9 @@ @_position__vertical__value: 2px, @_position__horizontal__value: 2px ); - margin-left: -@popup-marker__size * 2; + margin-left: (-@popup-marker__size * 2); position: absolute; - top: -@popup-marker__size * 2; + top: (-@popup-marker__size * 2); } } diff --git a/app/design/frontend/Magento/blank/web/css/source/components/_modals_extend.less b/app/design/frontend/Magento/blank/web/css/source/components/_modals_extend.less index 764a63bd88064..476762699c9ab 100644 --- a/app/design/frontend/Magento/blank/web/css/source/components/_modals_extend.less +++ b/app/design/frontend/Magento/blank/web/css/source/components/_modals_extend.less @@ -25,7 +25,7 @@ @modal-action-close__font-size: 32px; @modal-action-close__hover__color: darken(@primary__color, 10%); -@modal-slide-action-close__padding: @modal-slide-header__padding-vertical - 1rem @modal-popup__padding - 1rem; +@modal-slide-action-close__padding: (@modal-slide-header__padding-vertical - 1rem) (@modal-popup__padding - 1rem); // // Common @@ -86,7 +86,7 @@ } .page-main-actions { - margin-bottom: @modal-slide-header__padding-vertical - (@indent__l/2); + margin-bottom: (@modal-slide-header__padding-vertical - (@indent__l/2)); margin-top: @modal-slide-header__padding-vertical; } } 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 ea7d8b412768f..fa286e7454d51 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 @@ -162,7 +162,7 @@ .lib-css(color, @product-info-price); border-bottom: 1px solid @color-gray-light5; display: table; - margin-bottom: @indent__s + @indent__xs; + margin-bottom: (@indent__s + @indent__xs); width: 100%; .price-box { @@ -272,7 +272,7 @@ .product-add-form { clear: both; - padding-top: @indent__s + @indent__xs; + padding-top: (@indent__s + @indent__xs); } .product-reviews-summary { @@ -426,7 +426,7 @@ .prices-tier { &:extend(.abs-reset-list all); - margin-bottom: @indent__s + @indent__xs; + margin-bottom: (@indent__s + @indent__xs); .item { margin-bottom: @indent__s; diff --git a/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/module/_listings.less b/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/module/_listings.less index d106fa8886c05..feef0e52920d9 100644 --- a/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/module/_listings.less +++ b/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/module/_listings.less @@ -398,7 +398,7 @@ .products-grid { .product-item { margin-bottom: @indent__base; - width: 100%/3; + width: (100% / 3); } } @@ -450,7 +450,7 @@ .page-products.page-layout-1column { .products-grid { .product-item { - width: 100%/4; + width: (100% / 4); } } } @@ -458,7 +458,7 @@ .page-products.page-layout-3columns { .products-grid { .product-item { - width: 100%/2; + width: (100% / 2); } } } @@ -468,14 +468,14 @@ .products-grid { .product-item { - width: 100%/5; + width: (100% / 5); } } .page-layout-1column { .products-grid { .product-item { - width: 100%/6; + width: (100% / 6); } } } @@ -483,7 +483,7 @@ .page-layout-3columns { .products-grid { .product-item { - width: 100%/4; + width: (100% / 4); } } } @@ -515,7 +515,7 @@ .products-grid { .product-item { margin-left: 0; - width: 100%/5; + width: (100% / 5); } } } diff --git a/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/module/_toolbar.less b/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/module/_toolbar.less index 9d30f787a7431..99430d42b1fc1 100644 --- a/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/module/_toolbar.less +++ b/app/design/frontend/Magento/luma/Magento_Catalog/web/css/source/module/_toolbar.less @@ -44,7 +44,7 @@ } &-amount { left: 0; - line-height: @toolbar-mode-icon-font-size + 2; + line-height: (@toolbar-mode-icon-font-size + 2); margin: 0; padding: 7px 0; text-align: left; diff --git a/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/_cart.less b/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/_cart.less index 2c8c52bdb7af2..29c629c6e385d 100644 --- a/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/_cart.less +++ b/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/_cart.less @@ -751,7 +751,7 @@ padding: 0 4% 0 0; .products-grid .product-item { - width: 100%/4; + width: (100% / 4); } } } diff --git a/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/checkout/_shipping.less b/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/checkout/_shipping.less index 8f2092713b718..e09f4b266026b 100644 --- a/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/checkout/_shipping.less +++ b/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/checkout/_shipping.less @@ -19,8 +19,8 @@ @checkout-shipping-item__margin: 0 0 @indent__base; @checkout-shipping-item__padding: @indent__base (@indent__l + 5px) @indent__base @indent__base; @checkout-shipping-item__transition: .3s border-color; -@checkout-shipping-item__width: 100%/3; -@checkout-shipping-item-tablet__width: 100%/2; +@checkout-shipping-item__width: (100% / 3); +@checkout-shipping-item-tablet__width: (100% / 2); @checkout-shipping-item-mobile__width: 100%; @checkout-shipping-item__active__border-color: @active__color; diff --git a/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/checkout/fields/_file-uploader.less b/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/checkout/fields/_file-uploader.less index 34109eb7cea90..eb4ae95840a85 100644 --- a/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/checkout/fields/_file-uploader.less +++ b/app/design/frontend/Magento/luma/Magento_Checkout/web/css/source/module/checkout/fields/_file-uploader.less @@ -24,14 +24,14 @@ @file-uploader-document-icon__color: @color-gray80; @file-uploader-document-icon__size: 7rem; -@file-uploader-document-icon__z-index: @data-grid-file-uploader-image__z-index + 1; +@file-uploader-document-icon__z-index: (@data-grid-file-uploader-image__z-index + 1); @file-uploader-video-icon__color: @color-gray80; @file-uploader-video-icon__size: 4rem; -@file-uploader-video-icon__z-index: @data-grid-file-uploader-image__z-index + 1; +@file-uploader-video-icon__z-index: (@data-grid-file-uploader-image__z-index + 1); @file-uploader-placeholder-icon__color: @color-gray80; -@file-uploader-placeholder-icon__z-index: @data-grid-file-uploader-image__z-index + 1; +@file-uploader-placeholder-icon__z-index: (@data-grid-file-uploader-image__z-index + 1); @file-uploader-delete-icon__color: @color-brownie; @file-uploader-delete-icon__hover__color: @color-brownie-vanilla; @@ -59,7 +59,7 @@ @data-grid-file-uploader-upload-icon__hover__color: @color-very-dark-gray; @data-grid-file-uploader-upload-icon__line-height: 48px; -@data-grid-file-uploader-wrapper__size: @data-grid-file-uploader-image__size + 2rem; +@data-grid-file-uploader-wrapper__size: (@data-grid-file-uploader-image__size + 2rem); // // Single file uploader @@ -188,7 +188,7 @@ &:before { left: 0; - margin-top: -@file-uploader-video-icon__size / 2; + margin-top: (-@file-uploader-video-icon__size / 2); position: absolute; right: 0; top: 50%; @@ -207,7 +207,7 @@ &:before { left: 0; - margin-top: -@file-uploader-document-icon__size / 2; + margin-top: (-@file-uploader-document-icon__size / 2); position: absolute; right: 0; top: 50%; @@ -379,7 +379,7 @@ } .file-uploader-area { - z-index: @data-grid-file-uploader-image__z-index + 1; + z-index: (@data-grid-file-uploader-image__z-index + 1); } .file-uploader-spinner { @@ -438,7 +438,7 @@ .action-menu { left: 4rem; right: auto; - z-index: @data-grid-file-uploader-image__z-index + 1; + z-index: (@data-grid-file-uploader-image__z-index + 1); } } } diff --git a/app/design/frontend/Magento/luma/Magento_GiftRegistry/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_GiftRegistry/web/css/source/_module.less index bf791188b4053..8b7de27f79505 100644 --- a/app/design/frontend/Magento/luma/Magento_GiftRegistry/web/css/source/_module.less +++ b/app/design/frontend/Magento/luma/Magento_GiftRegistry/web/css/source/_module.less @@ -83,7 +83,7 @@ } .form-giftregistry-search { - margin-bottom: @indent__l*2; + margin-bottom: (@indent__l*2); .legend { &:extend(.abs-account-title all); 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 423ccc075553e..78b681addc08d 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 @@ -119,7 +119,7 @@ font-weight: @font-weight__semibold; margin: 0; overflow: hidden; - padding: @indent__s @indent__s + 30px 0 @indent__s; + padding: @indent__s (@indent__s + 30px) 0 @indent__s; position: relative; text-transform: uppercase; word-break: break-all; diff --git a/app/design/frontend/Magento/luma/Magento_MultipleWishlist/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_MultipleWishlist/web/css/source/_module.less index 7ed4a9e64e943..7d5acb1b6f168 100644 --- a/app/design/frontend/Magento/luma/Magento_MultipleWishlist/web/css/source/_module.less +++ b/app/design/frontend/Magento/luma/Magento_MultipleWishlist/web/css/source/_module.less @@ -258,7 +258,7 @@ } .form-wishlist-search { - margin-bottom: @indent__l * 2; + margin-bottom: (@indent__l * 2); max-width: 500px; .fieldset { diff --git a/app/design/frontend/Magento/luma/Magento_Multishipping/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_Multishipping/web/css/source/_module.less index a94e2cae46b14..89dd8b8323273 100644 --- a/app/design/frontend/Magento/luma/Magento_Multishipping/web/css/source/_module.less +++ b/app/design/frontend/Magento/luma/Magento_Multishipping/web/css/source/_module.less @@ -31,7 +31,7 @@ .orders-list { margin-top: @indent__m; - padding-left: @indent__base - 4px; + padding-left: (@indent__base - 4px); .shipping-list { .shipping-item { 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 68d59d047ceec..5b0f40c43adb5 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 @@ -143,7 +143,7 @@ } .control { - margin-bottom: 1.2 * @indent__xl; + margin-bottom: (1.2 * @indent__xl); margin-top: @indent__s; } } @@ -224,7 +224,7 @@ &-ratings { float: left; margin-bottom: 0; - min-width: @review-ratings-left - @indent__xl; + min-width: (@review-ratings-left - @indent__xl); padding-right: @indent__xl; } @@ -291,7 +291,7 @@ .reviews-actions { display: inline-block; - font-size: floor(.8 * @font-size__base); + font-size: floor((.8 * @font-size__base)); vertical-align: middle; a:not(:last-child) { @@ -317,7 +317,7 @@ .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) { .product-reviews-summary { - margin-bottom: @indent__s + @indent__xs; + margin-bottom: (@indent__s + @indent__xs); .products.wrapper.list & { margin: 0; diff --git a/app/design/frontend/Magento/luma/Magento_Rma/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_Rma/web/css/source/_module.less index 104dd6c4d5b92..c581e9529ee9b 100644 --- a/app/design/frontend/Magento/luma/Magento_Rma/web/css/source/_module.less +++ b/app/design/frontend/Magento/luma/Magento_Rma/web/css/source/_module.less @@ -176,7 +176,7 @@ &:extend(.abs-add-box-sizing-desktop all); clear: none; float: left; - width: 100%/4; + width: (100% / 4); } } } diff --git a/app/design/frontend/Magento/luma/Magento_Sales/web/css/source/_email.less b/app/design/frontend/Magento/luma/Magento_Sales/web/css/source/_email.less index 31c128e07e3a6..50729de15f711 100644 --- a/app/design/frontend/Magento/luma/Magento_Sales/web/css/source/_email.less +++ b/app/design/frontend/Magento/luma/Magento_Sales/web/css/source/_email.less @@ -25,7 +25,7 @@ // Shrink order number in order email so it will fit on single line on small screens .email-summary { h1 { - font-size: ceil(1.7 * @font-size__base) !important; // 24px + font-size: ceil((1.7 * @font-size__base)) !important; // 24px } } } diff --git a/app/design/frontend/Magento/luma/Magento_Sales/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_Sales/web/css/source/_module.less index f8ab8ddb088ec..eb3848d586db5 100644 --- a/app/design/frontend/Magento/luma/Magento_Sales/web/css/source/_module.less +++ b/app/design/frontend/Magento/luma/Magento_Sales/web/css/source/_module.less @@ -585,7 +585,7 @@ strong { border-bottom: 0; margin-bottom: -1px; - padding: @tab-control__padding-top @indent__base @tab-control__padding-bottom + 1 @indent__base; + padding: @tab-control__padding-top @indent__base (@tab-control__padding-bottom + 1) @indent__base; } } } @@ -608,7 +608,7 @@ &:extend(.abs-add-box-sizing-desktop all); clear: none; float: left; - width: 100%/4; + width: (100% / 4); } } } @@ -723,7 +723,7 @@ } strong { - padding: @tab-control__padding-top @tab-control__padding-right @tab-control__padding-bottom + 1 @tab-control__padding-left; + padding: @tab-control__padding-top @tab-control__padding-right (@tab-control__padding-bottom + 1) @tab-control__padding-left; } } } 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 b7c62fbfc65ed..9a57b11cb1d2d 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 @@ -29,7 +29,7 @@ @header-panel__text-color: @color-white; @header-icons-color: @color-gray46; @header-icons-color-hover: @color-gray20; -@customer-welcome__z-index: @dropdown-list__z-index + 1; +@customer-welcome__z-index: (@dropdown-list__z-index + 1); @addto-color: @color-gray40; @addto-hover-color: @primary__color; @@ -695,7 +695,7 @@ &:before, &:after { - bottom: @indent__base - 7px; + bottom: (@indent__base - 7px); left: auto; right: 100%; top: auto; 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 86364f9d2c68e..d157767630a69 100644 --- a/app/design/frontend/Magento/luma/web/css/source/_extends.less +++ b/app/design/frontend/Magento/luma/web/css/source/_extends.less @@ -290,7 +290,7 @@ .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) { .abs-margin-for-blocks-and-widgets-desktop { - margin-bottom: @indent__xl + @indent__s; + margin-bottom: (@indent__xl + @indent__s); } } 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 957b2b054e0c7..e2ce46509274b 100644 --- a/app/design/frontend/Magento/luma/web/css/source/_popups.less +++ b/app/design/frontend/Magento/luma/web/css/source/_popups.less @@ -70,9 +70,9 @@ @_position__vertical__value: 2px, @_position__horizontal__value: 2px ); - margin-left: -@popup-marker__size * 2; + margin-left: (-@popup-marker__size * 2); position: absolute; - top: -@popup-marker__size * 2; + top: (-@popup-marker__size * 2); } } diff --git a/app/design/frontend/Magento/luma/web/css/source/_theme.less b/app/design/frontend/Magento/luma/web/css/source/_theme.less index 114fb7b817267..2ddb10373d0c8 100644 --- a/app/design/frontend/Magento/luma/web/css/source/_theme.less +++ b/app/design/frontend/Magento/luma/web/css/source/_theme.less @@ -71,7 +71,7 @@ // Tabs @tab-control__color: @color-gray43; @tab-control__font-weight: @font-weight__regular; -@tab-control__height: @indent__base*2; +@tab-control__height: (@indent__base*2); @tab-control__margin-right: -1px; @tab-control__padding-top: 1px; @tab-control__padding-right: 35px; diff --git a/app/design/frontend/Magento/luma/web/css/source/components/_modals_extend.less b/app/design/frontend/Magento/luma/web/css/source/components/_modals_extend.less index 855700806fdba..fb9aaada7334b 100644 --- a/app/design/frontend/Magento/luma/web/css/source/components/_modals_extend.less +++ b/app/design/frontend/Magento/luma/web/css/source/components/_modals_extend.less @@ -87,7 +87,7 @@ } .page-main-actions { - margin-bottom: @modal-slide-header__padding-vertical - (@indent__l/2); + margin-bottom: (@modal-slide-header__padding-vertical - (@indent__l/2)); margin-top: @modal-slide-header__padding-vertical; } } diff --git a/dev/tools/grunt/configs/less.js b/dev/tools/grunt/configs/less.js index 9ae376b9e21ba..43ce28793f327 100644 --- a/dev/tools/grunt/configs/less.js +++ b/dev/tools/grunt/configs/less.js @@ -21,6 +21,7 @@ var lessOptions = { options: { sourceMap: true, strictImports: false, + strictMath: true, sourceMapRootpath: '/', sourceMapBasepath: function (f) { this.sourceMapURL = this.sourceMapFilename.substr(this.sourceMapFilename.lastIndexOf('/') + 1); diff --git a/lib/web/css/source/components/_modals.less b/lib/web/css/source/components/_modals.less index 8b69f909869d6..4ea880a5bf379 100644 --- a/lib/web/css/source/components/_modals.less +++ b/lib/web/css/source/components/_modals.less @@ -33,7 +33,7 @@ @modal-popup-image-box__border-color: @color-gray80; @modal-popup-image-box__max-width: 78rem; -@modal-popup-image-box-preview__max-width: @modal-popup-image-box-preview-image__max-height + (2 * @indent__base); +@modal-popup-image-box-preview__max-width: (@modal-popup-image-box-preview-image__max-height + (2 * @indent__base)); @modal-popup-image-box-preview-image__max-height: 54rem; // diff --git a/lib/web/css/source/lib/_layout.less b/lib/web/css/source/lib/_layout.less index 8ae7277452b6b..aac020c972142 100644 --- a/lib/web/css/source/lib/_layout.less +++ b/lib/web/css/source/lib/_layout.less @@ -101,7 +101,7 @@ ._lib-set-column-width(@_index, @_width) when (@_index > 0) { @_checkUnit: isunit(@_width, extract(@_units, @_index)); ._lib-column-width(@_width, @_checkUnit, @_index); - ._lib-set-column-width(@_index - 1, @_width); + ._lib-set-column-width((@_index - 1), @_width); } .lib-layout-column(@_total-columns, @_order, @_width) { diff --git a/lib/web/css/source/lib/_navigation.less b/lib/web/css/source/lib/_navigation.less index 551e138ea06ec..1c1bf48eb997c 100644 --- a/lib/web/css/source/lib/_navigation.less +++ b/lib/web/css/source/lib/_navigation.less @@ -531,8 +531,8 @@ @_left ) when (@_submenu-arrow = true) { & when (iscolor(@_bg)) and (iscolor(@_border)) { - @_outer-size: @_size + 1; - @_outer-left: @_left - 1; + @_outer-size: (@_size + 1); + @_outer-left: (@_left - 1); .lib-css(margin-top, @_outer-size); > ul { diff --git a/lib/web/css/source/lib/_rating.less b/lib/web/css/source/lib/_rating.less index 535fa44616039..726de9000910c 100644 --- a/lib/web/css/source/lib/_rating.less +++ b/lib/web/css/source/lib/_rating.less @@ -102,7 +102,7 @@ ._lib-rating-label-hide(@_label-hide); .rating-result { - .lib-css(width, (@_icon-font-size * @_icon-count) + ceil(@_icon-letter-spacing * (@_icon-count - 1))); + .lib-css(width, (@_icon-font-size * @_icon-count) + ceil((@_icon-letter-spacing * (@_icon-count - 1)))); display: inline-block; position: relative; vertical-align: middle; @@ -164,14 +164,14 @@ ) { .loopingClass (@_index) when (@_index > 0) { .rating-@{_index} { - z-index: @_icon-count - (@_index - 2); + z-index: (@_icon-count - (@_index - 2)); &:before { .lib-rating-icons-content(@_index, @_icon-content); } } // Next iteration - .loopingClass(@_index - 1); + .loopingClass((@_index - 1)); } .loopingClass (0) {} diff --git a/lib/web/css/source/lib/_utilities.less b/lib/web/css/source/lib/_utilities.less index 222eb4741e85e..cf39394adde6d 100644 --- a/lib/web/css/source/lib/_utilities.less +++ b/lib/web/css/source/lib/_utilities.less @@ -14,7 +14,7 @@ .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; + @fontValue: (unit(((@_value) * 1), @font-size-unit) / @font-size-unit-ratio); } .lib-font-size-value( @_value @@ -296,7 +296,7 @@ and not (extract(@_value, 3) = false) and not (extract(@_value, 4) = false) and not (extract(@_value, 5) = false) { - @{_property}: @_value; + @{_property}: (@_value); } // diff --git a/lib/web/css/source/lib/variables/_layout.less b/lib/web/css/source/lib/variables/_layout.less index 243f5468f4ede..805522068326c 100644 --- a/lib/web/css/source/lib/variables/_layout.less +++ b/lib/web/css/source/lib/variables/_layout.less @@ -31,10 +31,10 @@ // Variables for layout columns depending on layout used @layout-column-main__width-1: 100%; -@layout-column-main__width-2-left: @layout-column__width - @layout-column__left-width; -@layout-column-main__width-2-right: @layout-column__width - @layout-column__right-width; -@layout-column-main__width-3: @layout-column__width - @layout-column__left-width - @layout-column__right-width; +@layout-column-main__width-2-left: (@layout-column__width - @layout-column__left-width); +@layout-column-main__width-2-right: (@layout-column__width - @layout-column__right-width); +@layout-column-main__width-3: (@layout-column__width - @layout-column__left-width - @layout-column__right-width); // Checkout columns width @layout-column-checkout__width-left: 3; -@layout-column-checkout__width-main: @layout-column__width - @layout-column-checkout__width-left; +@layout-column-checkout__width-main: (@layout-column__width - @layout-column-checkout__width-left); diff --git a/lib/web/css/source/lib/variables/_messages.less b/lib/web/css/source/lib/variables/_messages.less index 687fde40168c2..176388be28f29 100644 --- a/lib/web/css/source/lib/variables/_messages.less +++ b/lib/web/css/source/lib/variables/_messages.less @@ -17,7 +17,7 @@ @message__font-weight: false; @message__line-height: 1.2em; -@message-icon__font-size: ceil(@message__font-size * 2 + 2); +@message-icon__font-size: ceil((@message__font-size * 2 + 2)); @message-icon__font-line-height: @message-icon__font-size; @message-icon__inner-padding-left: 40px; @message-icon__lateral-width: 30px; diff --git a/lib/web/css/source/lib/variables/_sections.less b/lib/web/css/source/lib/variables/_sections.less index 05226d8aa3a3c..4f3e35b6744bf 100644 --- a/lib/web/css/source/lib/variables/_sections.less +++ b/lib/web/css/source/lib/variables/_sections.less @@ -46,7 +46,7 @@ @tab-content__background-color: @tab-control__active__background-color; @tab-content__border-top-status: false; @tab-content__border: @tab-control__border-width solid @tab-control__border-color; -@tab-content__margin-top: @tab-control__height + @tab-control__border-width + @tab-control__padding-top + @tab-control__padding-bottom; +@tab-content__margin-top: (@tab-control__height + @tab-control__border-width + @tab-control__padding-top + @tab-control__padding-bottom); @tab-content__padding-top: @indent__base; @tab-content__padding-right: @indent__base; @tab-content__padding-bottom: @tab-content__padding-top; diff --git a/lib/web/css/source/lib/variables/_structure.less b/lib/web/css/source/lib/variables/_structure.less index 568cd88cf1864..5d901e5967d02 100644 --- a/lib/web/css/source/lib/variables/_structure.less +++ b/lib/web/css/source/lib/variables/_structure.less @@ -23,7 +23,7 @@ @z-index-10: 1000; // z-index 8 -@overlay__z-index: @modal__z-index - 1; +@overlay__z-index: (@modal__z-index - 1); // z-index 9 @modal__z-index: @z-index-9; diff --git a/lib/web/css/source/lib/variables/_typography.less b/lib/web/css/source/lib/variables/_typography.less index 224f96137f117..9442be70d0266 100644 --- a/lib/web/css/source/lib/variables/_typography.less +++ b/lib/web/css/source/lib/variables/_typography.less @@ -32,11 +32,11 @@ @font-size-unit-ratio: unit((@root__font-size * 16/100)); // Ratio of the root font-size to the font-size unit @font-size-unit-convert: true; // Controls whether font-size values are converted to the specified font-size unit -@font-size__base: unit(@font-size-unit-ratio * @font-size-ratio__base, px); // Base font size value in px -@font-size__xl: ceil(1.5 * @font-size__base); // 21px -@font-size__l: ceil(1.25 * @font-size__base); // 18px -@font-size__s: ceil(.85 * @font-size__base); // 12px -@font-size__xs: floor(.75 * @font-size__base); // 11px +@font-size__base: unit((@font-size-unit-ratio * @font-size-ratio__base), px); // Base font size value in px +@font-size__xl: ceil((1.5 * @font-size__base)); // 21px +@font-size__l: ceil((1.25 * @font-size__base)); // 18px +@font-size__s: ceil((.85 * @font-size__base)); // 12px +@font-size__xs: floor((.75 * @font-size__base)); // 11px // Weights @font-weight__hairline: 100; @@ -55,7 +55,7 @@ // Line heights @line-height__base: 1.428571429; -@line-height__computed: floor(@font-size__base * @line-height__base); +@line-height__computed: floor((@font-size__base * @line-height__base)); @line-height__xl: 1.7; @line-height__l: 1.5; @line-height__s: 1.33; @@ -70,9 +70,9 @@ // --------------------------------------------- @indent__base: @line-height__computed; // 20px -@indent__xl: @indent__base * 2; // 40px -@indent__l: @indent__base * 1.5; // 30px -@indent__m: @indent__base * 1.25; // 25px +@indent__xl: (@indent__base * 2); // 40px +@indent__l: (@indent__base * 1.5); // 30px +@indent__m: (@indent__base * 1.25); // 25px @indent__s: (@indent__base / 2); // 10px @indent__xs: (@indent__base / 4); // 5px @@ -172,7 +172,7 @@ @h3__font-weight: @heading__font-weight__base; @h3__font-style: @heading__font-style__base; @h3__line-height: @heading__line-height__base; -@h3__margin-top: @indent__base * .75; +@h3__margin-top: (@indent__base * .75); @h3__margin-bottom: @indent__s; @h4__font-size: @font-size__base; // 14px @@ -204,7 +204,7 @@ @heading__small-color: @primary__color; @heading__small-line-height: 1; -@heading__small-size: (@font-size__xs/@font-size__base) * 100%; +@heading__small-size: ((@font-size__xs/@font-size__base) * 100%); // Code blocks @code__background-color: @panel__background-color;