Skip to content

Commit 5a526f8

Browse files
tuna2smcmrtuvn
tuna2smc
authored and
mrtuvn
committed
Clean up ruleset mixins at less file luma theme
1 parent 5b009cd commit 5a526f8

File tree

1 file changed

+102
-98
lines changed

1 file changed

+102
-98
lines changed

‎app/design/frontend/Magento/luma/web/css/source/_extends.less

Lines changed: 102 additions & 98 deletions
Original file line numberDiff line numberDiff line change
@@ -254,10 +254,10 @@
254254
& when (@media-common = true) {
255255
.abs-dropdown-simple {
256256
.lib-dropdown(
257-
@_dropdown-list-item-padding: 5px 5px 5px 23px,
258-
@_dropdown-list-min-width: 200px,
259-
@_icon-font-margin: 0 0 0 5px,
260-
@_icon-font-vertical-align: middle
257+
@_dropdown-list-item-padding: 5px 5px 5px 23px,
258+
@_dropdown-list-min-width: 200px,
259+
@_icon-font-margin: 0 0 0 5px,
260+
@_icon-font-vertical-align: middle
261261
);
262262

263263
ul.items {
@@ -300,13 +300,13 @@
300300
& when (@media-common = true) {
301301
.abs-remove-button-for-blocks {
302302
.lib-icon-font(
303-
@icon-remove,
304-
@_icon-font-size: 12px,
305-
@_icon-font-line-height: 15px,
306-
@_icon-font-text-hide: true,
307-
@_icon-font-color: @color-gray46,
308-
@_icon-font-color-hover: @color-gray-darken4,
309-
@_icon-font-color-active: @color-gray60
303+
@icon-remove,
304+
@_icon-font-size: 12px,
305+
@_icon-font-line-height: 15px,
306+
@_icon-font-text-hide: true,
307+
@_icon-font-color: @color-gray46,
308+
@_icon-font-color-hover: @color-gray-darken4,
309+
@_icon-font-color-active: @color-gray60
310310
);
311311
}
312312
}
@@ -318,16 +318,17 @@
318318
& when (@media-common = true) {
319319
.abs-product-link {
320320
font-weight: @font-weight__regular;
321+
321322
> a {
322323
.lib-link(
323-
@_link-color: @product-name-link__color,
324-
@_link-text-decoration: @product-name-link__text-decoration,
325-
@_link-color-visited: @product-name-link__color__visited,
326-
@_link-text-decoration-visited: @product-name-link__text-decoration__visited,
327-
@_link-color-hover: @product-name-link__color__hover,
328-
@_link-text-decoration-hover: @product-name-link__text-decoration__hover,
329-
@_link-color-active: @product-name-link__color__active,
330-
@_link-text-decoration-active: @product-name-link__text-decoration__active
324+
@_link-color: @product-name-link__color,
325+
@_link-text-decoration: @product-name-link__text-decoration,
326+
@_link-color-visited: @product-name-link__color__visited,
327+
@_link-text-decoration-visited: @product-name-link__text-decoration__visited,
328+
@_link-color-hover: @product-name-link__color__hover,
329+
@_link-text-decoration-hover: @product-name-link__text-decoration__hover,
330+
@_link-color-active: @product-name-link__color__active,
331+
@_link-text-decoration-active: @product-name-link__text-decoration__active
331332
);
332333
}
333334
}
@@ -662,8 +663,8 @@
662663
& when (@media-common = true) {
663664
.abs-split-button {
664665
.lib-dropdown-split(
665-
@_options-selector : ~'.items',
666-
@_dropdown-split-button-border-radius-fix: true
666+
@_options-selector : ~'.items',
667+
@_dropdown-split-button-border-radius-fix: true
667668
);
668669
vertical-align: middle;
669670
}
@@ -743,6 +744,7 @@
743744
.abs-checkout-order-review {
744745
tbody > tr {
745746
&:extend(.abs-add-clearfix-mobile all);
747+
746748
&:not(:last-child) {
747749
.lib-css(border-bottom, @border-width__base solid @border-color__base);
748750
}
@@ -795,11 +797,11 @@
795797
letter-spacing: .05em;
796798
text-transform: uppercase;
797799
.lib-icon-font(
798-
@_icon-font-content: '',
799-
@_icon-font-size: 16px,
800-
@_icon-font-line-height: 16px,
801-
@_icon-font-margin: -2px 5px 0 0,
802-
@_icon-font-vertical-align: middle
800+
@_icon-font-content: '',
801+
@_icon-font-size: 16px,
802+
@_icon-font-line-height: 16px,
803+
@_icon-font-margin: -2px 5px 0 0,
804+
@_icon-font-vertical-align: middle
803805
);
804806

805807
&:hover {
@@ -874,13 +876,13 @@
874876
@abs-toggling-title();
875877
.lib-css(padding, @indent__s @indent__xl @indent__s @mobile-cart-padding);
876878
.lib-icon-font(
877-
@icon-down,
878-
@_icon-font-size: 12px,
879-
@_icon-font-line-height: 12px,
880-
@_icon-font-text-hide: true,
881-
@_icon-font-margin: 3px 0 0,
882-
@_icon-font-position: after,
883-
@_icon-font-display: block
879+
@icon-down,
880+
@_icon-font-size: 12px,
881+
@_icon-font-line-height: 12px,
882+
@_icon-font-text-hide: true,
883+
@_icon-font-margin: 3px 0 0,
884+
@_icon-font-position: after,
885+
@_icon-font-display: block
884886
);
885887
}
886888
}
@@ -891,18 +893,18 @@
891893
.lib-css(border-bottom, @border-width__base solid @border-color__base);
892894
.lib-css(padding, @indent__s @indent__xl @indent__s @layout__width-xs-indent);
893895
.lib-icon-font(
894-
@icon-down,
895-
@_icon-font-size: 12px,
896-
@_icon-font-text-hide: false,
897-
@_icon-font-margin: 3px 0 0 0,
898-
@_icon-font-position: after,
899-
@_icon-font-display: block
896+
@icon-down,
897+
@_icon-font-size: 12px,
898+
@_icon-font-text-hide: false,
899+
@_icon-font-margin: 3px 0 0 0,
900+
@_icon-font-position: after,
901+
@_icon-font-display: block
900902
);
901903

902904
&.active {
903905
.lib-icon-font-symbol(
904-
@_icon-font-content: @icon-up,
905-
@_icon-font-position: after
906+
@_icon-font-content: @icon-up,
907+
@_icon-font-position: after
906908
);
907909
}
908910
}
@@ -918,6 +920,7 @@
918920

919921
> .title {
920922
&:extend(.abs-toggling-title all);
923+
921924
&:after {
922925
color: @color-gray52;
923926
}
@@ -932,8 +935,8 @@
932935
&.active {
933936
> .title {
934937
.lib-icon-font-symbol(
935-
@_icon-font-content: @icon-up,
936-
@_icon-font-position: after
938+
@_icon-font-content: @icon-up,
939+
@_icon-font-position: after
937940
);
938941
}
939942

@@ -983,7 +986,7 @@
983986
padding: @indent__s 0 0;
984987

985988
&:last-child {
986-
padding-bottom: @indent__s
989+
padding-bottom: @indent__s;
987990
}
988991
}
989992
}
@@ -1024,19 +1027,18 @@
10241027
// Account pages: title
10251028
// ---------------------------------------------
10261029

1027-
& when (@media-common = true) {
1028-
.abs-account-title {
1029-
> strong,
1030-
> span {
1031-
.lib-font-size(22);
1032-
.lib-css(font-weight, @font-weight__light);
1033-
}
1034-
1035-
.lib-css(border-bottom, 1px solid @account-title-border-color);
1036-
.lib-css(margin-bottom, @indent__m);
1037-
.lib-css(padding-bottom, @indent__s);
1030+
@abs-account-title: {
1031+
> strong,
1032+
> span {
1033+
.lib-font-size(22);
1034+
.lib-css(font-weight, @font-weight__light);
10381035
}
1039-
}
1036+
1037+
.lib-css(border-bottom, 1px solid @account-title-border-color);
1038+
.lib-css(margin-bottom, @indent__m);
1039+
.lib-css(padding-bottom, @indent__s);
1040+
};
1041+
10401042

10411043
//
10421044
// Account pages: block font size
@@ -1103,11 +1105,11 @@
11031105

11041106
@abs-action-print: {
11051107
.lib-icon-font(
1106-
@icon-print,
1107-
@_icon-font-size: 16px,
1108-
@_icon-font-line-height: 16px,
1109-
@_icon-font-margin: 0 4px 0 0,
1110-
@_icon-font-position: before
1108+
@icon-print,
1109+
@_icon-font-size: 16px,
1110+
@_icon-font-line-height: 16px,
1111+
@_icon-font-margin: 0 4px 0 0,
1112+
@_icon-font-position: before
11111113
);
11121114

11131115
&:hover {
@@ -1180,11 +1182,11 @@
11801182
position: relative;
11811183

11821184
.lib-icon-font(
1183-
@icon-down,
1184-
@_icon-font-size: 8px,
1185-
@_icon-font-line-height: 8px,
1186-
@_icon-font-margin: 3px 0 0 0,
1187-
@_icon-font-position: after
1185+
@icon-down,
1186+
@_icon-font-size: 8px,
1187+
@_icon-font-line-height: 8px,
1188+
@_icon-font-margin: 3px 0 0 0,
1189+
@_icon-font-position: after
11881190
);
11891191

11901192
&:after {
@@ -1196,8 +1198,8 @@
11961198

11971199
.abs-tax-total-expanded {
11981200
.lib-icon-font-symbol(
1199-
@_icon-font-content: @icon-up,
1200-
@_icon-font-position: after
1201+
@_icon-font-content: @icon-up,
1202+
@_icon-font-position: after
12011203
);
12021204
}
12031205
}
@@ -1269,7 +1271,7 @@
12691271
& when (@media-common = true) {
12701272
.abs-account-blocks {
12711273
.block-title {
1272-
&:extend(.abs-account-title all);
1274+
@abs-account-title();
12731275

12741276
> .action {
12751277
margin-left: 15px;
@@ -1311,23 +1313,23 @@
13111313
& when (@media-common = true) {
13121314
.abs-icon-add {
13131315
.lib-icon-font(
1314-
@_icon-font-content: @icon-expand,
1315-
@_icon-font-size: 10px,
1316-
@_icon-font-line-height: 10px,
1317-
@_icon-font-vertical-align: middle
1316+
@_icon-font-content: @icon-expand,
1317+
@_icon-font-size: 10px,
1318+
@_icon-font-line-height: 10px,
1319+
@_icon-font-vertical-align: middle
13181320
);
13191321
}
13201322
}
13211323

13221324
.media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) {
13231325
.abs-icon-add-mobile {
13241326
.lib-icon-font(
1325-
@_icon-font-content: @icon-expand,
1326-
@_icon-font-size: 10px,
1327-
@_icon-font-line-height: 10px,
1328-
@_icon-font-vertical-align: middle,
1329-
@_icon-font-margin: 0 5px 0 0,
1330-
@_icon-font-display: block
1327+
@_icon-font-content: @icon-expand,
1328+
@_icon-font-size: 10px,
1329+
@_icon-font-line-height: 10px,
1330+
@_icon-font-vertical-align: middle,
1331+
@_icon-font-margin: 0 5px 0 0,
1332+
@_icon-font-display: block
13311333
);
13321334
}
13331335
}
@@ -1346,6 +1348,7 @@
13461348

13471349
.action.new {
13481350
&:extend(.abs-icon-add all);
1351+
13491352
&:before {
13501353
margin-left: -17px;
13511354
margin-right: @indent__xs;
@@ -1488,8 +1491,8 @@
14881491
.media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) {
14891492
.abs-table-bordered-desktop {
14901493
.lib-table-bordered(
1491-
@_table_type: light,
1492-
@_table_border-width: 1px
1494+
@_table_type: light,
1495+
@_table_border-width: 1px
14931496
);
14941497
}
14951498
}
@@ -1507,6 +1510,7 @@
15071510
position: relative;
15081511
z-index: 1;
15091512
}
1513+
15101514
.limiter {
15111515
display: inline-block;
15121516
float: right;
@@ -1638,7 +1642,7 @@
16381642
& when (@media-common = true) {
16391643
.abs-field-date-input {
16401644
.lib-css(margin-right, @indent__s);
1641-
width: calc(~'100% -' @icon-calendar__font-size + @indent__s);
1645+
width: calc(~'100% ' - (@icon-calendar__font-size + @indent__s));
16421646
}
16431647
}
16441648

@@ -1653,7 +1657,7 @@
16531657

16541658
input {
16551659
.lib-css(margin-right, @indent__s);
1656-
width: calc(~'100% -' @checkout-tooltip-icon__font-size + @indent__s + @indent__xs);
1660+
width: calc(~'100%' - (@checkout-tooltip-icon__font-size + @indent__s + @indent__xs));
16571661
}
16581662
}
16591663
}
@@ -1670,9 +1674,9 @@
16701674
&:before,
16711675
&:after {
16721676
.lib-arrow(
1673-
@_position: top,
1674-
@_size: @checkout-tooltip-icon-arrow__font-size,
1675-
@_color: @checkout-tooltip-content__background-color
1677+
@_position: top,
1678+
@_size: @checkout-tooltip-icon-arrow__font-size,
1679+
@_color: @checkout-tooltip-content__background-color
16761680
);
16771681
.lib-css(margin-top, @checkout-tooltip-icon-arrow__left);
16781682
.lib-css(right, @indent__s);
@@ -1710,11 +1714,11 @@
17101714
.abs-checkout-title {
17111715
.lib-css(padding-bottom, @checkout-step-title__padding);
17121716
.lib-typography(
1713-
@_font-size: @checkout-step-title__font-size,
1714-
@_font-weight: @checkout-step-title__font-weight,
1715-
@_font-family: false,
1716-
@_font-style: false,
1717-
@_line-height: false
1717+
@_font-size: @checkout-step-title__font-size,
1718+
@_font-weight: @checkout-step-title__font-weight,
1719+
@_font-family: false,
1720+
@_font-style: false,
1721+
@_line-height: false
17181722
);
17191723
}
17201724
}
@@ -1794,11 +1798,11 @@
17941798
padding-right: @indent__base;
17951799
position: relative;
17961800
.lib-icon-font(
1797-
@icon-down,
1798-
@_icon-font-size: 12px,
1799-
@_icon-font-line-height: 12px,
1800-
@_icon-font-text-hide: true,
1801-
@_icon-font-position: after
1801+
@icon-down,
1802+
@_icon-font-size: 12px,
1803+
@_icon-font-line-height: 12px,
1804+
@_icon-font-text-hide: true,
1805+
@_icon-font-position: after
18021806
);
18031807

18041808
&:after {
@@ -1816,8 +1820,8 @@
18161820

18171821
.amount .price {
18181822
.lib-icon-font-symbol(
1819-
@_icon-font-content: @icon-up,
1820-
@_icon-font-position: after
1823+
@_icon-font-content: @icon-up,
1824+
@_icon-font-position: after
18211825
);
18221826
}
18231827
}

0 commit comments

Comments
 (0)