Clean code less vendor prefix appearance

mrtuvn · mrtuvn · commit 025e08ca07e4 · 2020-12-24T16:28:39.000+07:00
up


UPDATE


UP


update
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
@@ -43,9 +43,10 @@
         overflow-y: auto;
         padding-top: .25em;
         &::-webkit-scrollbar {
-            -webkit-appearance: none;
+            .lib-vendor-prefix-appearance(none);
             width: 7px;
         }
+        
         &::-webkit-scrollbar-thumb {
             background-color: rgba(0, 0, 0, .5);
             border-radius: 4px;
diff --git a/app/design/adminhtml/Magento/backend/Magento_Catalog/web/css/source/_module-old.less b/app/design/adminhtml/Magento/backend/Magento_Catalog/web/css/source/_module-old.less
@@ -90,8 +90,6 @@
     .field-gift_wrapping_price {
         &:not(.field-weight) {
             .addon {
-                .lib-vendor-prefix-display(inline-flex);
-                .lib-vendor-prefix-flex-direction(row);
                 color: #303030;
                 display: inline-flex;
                 flex-flow: row nowrap;
@@ -142,10 +140,10 @@
         }
 
         .admin__control-text {
-            .lib-css(appearance, none, 1);
-            .lib-vendor-prefix-flex-basis(auto);
-            .lib-vendor-prefix-flex-grow(1);
-            .lib-vendor-prefix-flex-shrink(1);
+            .lib-vendor-prefix-appearance(none);
+            flex-basis: auto;
+            flex-grow: 1;
+            flex-shrink: 1;
             background: none;
             border: 0;
         }
@@ -159,10 +157,10 @@
         }
 
         .addafter {
-            .lib-vendor-prefix-flex-basis(auto);
-            .lib-vendor-prefix-flex-grow(0);
-            .lib-vendor-prefix-flex-shrink(0);
-            .lib-vendor-prefix-order(0);
+            flex-basis: auto;
+            flex-grow: 0;
+            flex-shrink: 0;
+            order: 0;
             position: relative;
             z-index: 0;
 
diff --git a/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/components/_currency-addon.less b/app/design/adminhtml/Magento/backend/Magento_ConfigurableProduct/web/css/source/module/components/_currency-addon.less
@@ -25,12 +25,7 @@
     width: 100%;
 
     .admin__control-text {
-        -ms-flex-order: 1;
-        -webkit-appearance: none;
-        -webkit-flex-grow: 1;
-        -webkit-flex-shrink: 1;
-        -webkit-order: 1;
-        appearance: none;
+        .lib-vendor-prefix-appearance(none);
         background-color: transparent;
         border-color: transparent;
         box-shadow: none;
@@ -53,9 +48,6 @@
     }
 
     .currency-symbol {
-        -webkit-flex-basis: auto;
-        -webkit-flex-grow: 0;
-        -webkit-flex-shrink: 0;
         border: solid @currency-addon-symbol__border-color;
         border-width: 0;
         box-sizing: border-box;
diff --git a/app/design/adminhtml/Magento/backend/Magento_Customer/web/css/source/_module.less b/app/design/adminhtml/Magento/backend/Magento_Customer/web/css/source/_module.less
@@ -18,8 +18,6 @@
     *,
     *:after,
     *:before {
-        -moz-box-sizing: border-box;
-        -webkit-box-sizing: border-box;
         box-sizing: border-box;
     }
 
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
@@ -153,7 +153,11 @@
             &.field-video_swatch_image,
             &.field-new_video_disabled {
                 .admin__field-control {
+                    /**
+                     * @codingStandardsIgnoreStart
+                     */
                     #mix-grid .column(3, @field-grid__columns);
+                    //@codingStandardsIgnoreEnd
                     float: left;
                     margin-left: 80px;
                     position: relative;
@@ -197,7 +201,11 @@
                 height: 0;
 
                 .admin__field-control {
+                    /**
+                     * @codingStandardsIgnoreStart
+                     */
                     #mix-grid .column(3, @field-grid__columns);
+                    //@codingStandardsIgnoreEnd
                     float: left;
                     margin-left: 80px;
                     position: relative;
@@ -221,7 +229,7 @@
             }
 
             input[type='checkbox'] {
-                .lib-css(appearance, none, 1);
+                .lib-vendor-prefix-appearance(none);
                 background: @color-white;
                 border: 1px solid @color-gray68;
                 border-radius: 2px;
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
@@ -139,7 +139,7 @@
 
             //  Force a scroll bar to appear on IOS devices
             &::-webkit-scrollbar {
-                -webkit-appearance: none;
+                .lib-vendor-prefix-appearance(none);
                 height: 4px;
             }
 
diff --git a/app/design/adminhtml/Magento/backend/Magento_Tax/web/css/source/_module.less b/app/design/adminhtml/Magento/backend/Magento_Tax/web/css/source/_module.less
@@ -4,7 +4,7 @@
 //  */
 
 .block-footer .action-add {
-    -webkit-appearance: none;
+    .lib-vendor-prefix-appearance(none);
     &:extend(.action-default, button all);
 }
 
diff --git a/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-pager.less b/app/design/adminhtml/Magento/backend/Magento_Ui/web/css/source/module/data-grid/data-grid-header/_data-grid-pager.less
@@ -26,12 +26,12 @@
 
     .admin__control-text::-webkit-outer-spin-button,
     .admin__control-text::-webkit-inner-spin-button {
-        -webkit-appearance: none;
+        .lib-vendor-prefix-appearance(none);
         margin: 0;
     }
 
     .admin__control-text {
-        -moz-appearance: textfield;
+        .lib-vendor-prefix-appearance(textfield);
         text-align: center;
         width: @data-grid-pager-action__width;
     }
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/_actions.less b/app/design/adminhtml/Magento/backend/web/css/source/_actions.less
@@ -436,10 +436,7 @@ button {
         }
 
         &._parent {
-            .lib-vendor-prefix-display(flex);
-            .lib-vendor-prefix-flex-direction(row);
             display: flex;
-            flex-direction: row;
 
             > .action-menu-item {
                 min-width: 100%;
diff --git a/app/design/adminhtml/Magento/backend/web/css/source/_reset.less b/app/design/adminhtml/Magento/backend/web/css/source/_reset.less
@@ -232,8 +232,7 @@ button,
 html input[type='button'],
 input[type='reset'],
 input[type='submit'] {
-    -webkit-appearance: button;
-    appearance: button;
+    .lib-vendor-prefix-appearance(button);
     cursor: pointer;
 }
 
@@ -274,17 +273,15 @@ input[type='number'] {
 
 //  Address 'appearance' set to 'searchfield' in Safari and Chrome.
 input[type='search'] {
-    -webkit-appearance: textfield;
-    appearance: textfield;
+    .lib-vendor-prefix-appearance(textfield);
 }
 
 //  Remove inner padding and search cancel button in Safari and Chrome on OS X.
 //  Safari (but not Chrome) clips the cancel button when the search input has padding (and 'textfield' appearance).
 input[type='search'] {
     &::-webkit-search-cancel-button,
     &::-webkit-search-decoration {
-        -webkit-appearance: none;
-        appearance: none;
+        .lib-vendor-prefix-appearance(none);
     }
 }
 
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
@@ -230,7 +230,7 @@
     display: inline-block;
 
     input[type='text'] {
-        .lib-css(appearance, none, 1);
+        .lib-vendor-prefix-appearance(none);
         border: 0;
         display: inline;
         margin: 0;
@@ -320,10 +320,7 @@
     }
 
     li {
-        .lib-vendor-prefix-display(flex);
-        .lib-vendor-prefix-flex-direction(row);
         display: flex;
-        flex-direction: row;
         transition: background .2s linear;
 
         &:hover {
@@ -370,7 +367,7 @@
 }
 
 .selectmenu-item-action {
-    .lib-css(appearance, none, 1);
+    .lib-vendor-prefix-appearance(none);
     background: transparent;
     border: 0;
     color: @text__color;
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
@@ -15,7 +15,7 @@
 
 //  Common
 .__form-control-pattern() {
-    -webkit-appearance: none;
+    .lib-vendor-prefix-appearance(none);
     background-color: @field-control__background-color;
     border: @field-control__border-width solid @field-control__border-color;
     border-radius: @field-control__border-radius;
@@ -58,7 +58,7 @@
 //  Select styles
 .admin__control-select {
     &:extend(.abs-form-control-pattern all);
-    .lib-css(appearance, none, 1);
+    .lib-vendor-prefix-appearance(none);
     background-image+: url('../images/arrows-bg.svg');
     background-position+: ~'calc(100% - 12px)' -34px;
     background-size+: auto;
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
@@ -471,8 +471,7 @@ label.mage-error {
 
     .admin__data-grid-header-row {
         .action-select-multiselect {
-            -webkit-appearance: menulist-button;
-            appearance: menulist-button;
+            .lib-vendor-prefix-appearance(menulist-button);
             height: 38px;
             left: -1rem;
             min-width: 0;
diff --git a/app/design/adminhtml/Magento/backend/web/css/styles-old.less b/app/design/adminhtml/Magento/backend/web/css/styles-old.less
@@ -799,8 +799,7 @@
 
     select {
         &:not([multiple]) {
-            .lib-css(appearance, none, 1);
-
+            .lib-vendor-prefix-appearance(none);
             display: inline-block;
             line-height: normal;
             min-width: 80px;
@@ -858,7 +857,7 @@
 
     input[type="radio"],
     input[type="checkbox"] {
-        .lib-css(appearance, none, 1);
+        .lib-vendor-prefix-appearance(none);
         background: @color-white;
         border-radius: 2px;
         border: 1px solid #adadad;
diff --git a/app/design/frontend/Magento/luma/web/css/source/_forms.less b/app/design/frontend/Magento/luma/web/css/source/_forms.less
@@ -89,8 +89,7 @@
     }
 
     .select-styling() {
-        .lib-css(appearance, none, 1);
-        appearance: none;
+        .lib-vendor-prefix-appearance(none);
         background-size: 30px 60px;
         text-indent: .01em;
         text-overflow: '';

Original file line number	Diff line number	Diff line change
`@@ -18,8 +18,6 @@`
`18`	`18`	`*,`
`19`	`19`	`*:after,`
`20`	`20`	`*:before {`
`21`		`- -moz-box-sizing: border-box;`
`22`		`- -webkit-box-sizing: border-box;`
`23`	`21`	`box-sizing: border-box;`
`24`	`22`	`}`
`25`	`23`
Original file line number	Diff line number	Diff line change
`@@ -139,7 +139,7 @@`
`139`	`139`
`140`	`140`	`// Force a scroll bar to appear on IOS devices`
`141`	`141`	`&::-webkit-scrollbar {`
`142`		`- -webkit-appearance: none;`
	`142`	`+ .lib-vendor-prefix-appearance(none);`
`143`	`143`	`height: 4px;`
`144`	`144`	`}`
`145`	`145`
Original file line number	Diff line number	Diff line change
`@@ -4,7 +4,7 @@`
`4`	`4`	`// */`
`5`	`5`
`6`	`6`	`.block-footer .action-add {`
`7`		`- -webkit-appearance: none;`
	`7`	`+ .lib-vendor-prefix-appearance(none);`
`8`	`8`	`&:extend(.action-default, button all);`
`9`	`9`	`}`
`10`	`10`
Original file line number	Diff line number	Diff line change
`@@ -26,12 +26,12 @@`
`26`	`26`
`27`	`27`	`.admin__control-text::-webkit-outer-spin-button,`
`28`	`28`	`.admin__control-text::-webkit-inner-spin-button {`
`29`		`- -webkit-appearance: none;`
	`29`	`+ .lib-vendor-prefix-appearance(none);`
`30`	`30`	`margin: 0;`
`31`	`31`	`}`
`32`	`32`
`33`	`33`	`.admin__control-text {`
`34`		`- -moz-appearance: textfield;`
	`34`	`+ .lib-vendor-prefix-appearance(textfield);`
`35`	`35`	`text-align: center;`
`36`	`36`	`width: @data-grid-pager-action__width;`
`37`	`37`	`}`
Original file line number	Diff line number	Diff line change
`@@ -436,10 +436,7 @@ button {`
`436`	`436`	`}`
`437`	`437`
`438`	`438`	`&._parent {`
`439`		`- .lib-vendor-prefix-display(flex);`
`440`		`- .lib-vendor-prefix-flex-direction(row);`
`441`	`439`	`display: flex;`
`442`		`- flex-direction: row;`
`443`	`440`
`444`	`441`	`> .action-menu-item {`
`445`	`442`	`min-width: 100%;`
Original file line number	Diff line number	Diff line change
`@@ -89,8 +89,7 @@`
`89`	`89`	`}`
`90`	`90`
`91`	`91`	`.select-styling() {`
`92`		`- .lib-css(appearance, none, 1);`
`93`		`- appearance: none;`
	`92`	`+ .lib-vendor-prefix-appearance(none);`
`94`	`93`	`background-size: 30px 60px;`
`95`	`94`	`text-indent: .01em;`
`96`	`95`	`text-overflow: '';`