From a1a01474e3af95fd71f60d1ce8282ab06f05217c Mon Sep 17 00:00:00 2001 From: hitesh-wagento Date: Tue, 5 Jun 2018 10:22:12 +0530 Subject: [PATCH 1/4] [Code improvement] --- .../web/css/source/module/checkout/_shipping.less | 3 +++ 1 file changed, 3 insertions(+) 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 512751df1cb35..d0ce87beb6ad3 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 @@ -296,6 +296,7 @@ } } } + .opc-wrapper { .form-login, .form-shipping-address { @@ -307,6 +308,7 @@ padding-bottom: @indent__base; } } + .table-checkout-shipping-method { width: auto; } @@ -346,6 +348,7 @@ } } } + .table-checkout-shipping-method { min-width: 500px; } From bc9f15fe95fdc3f087d0451b6d3f177e56f3cb70 Mon Sep 17 00:00:00 2001 From: hitesh-wagento Date: Tue, 5 Jun 2018 10:48:22 +0530 Subject: [PATCH 2/4] [Changed indentation 2 to 4] --- .../web/css/source/_module.less | 30 +++++++++---------- 1 file changed, 15 insertions(+), 15 deletions(-) diff --git a/app/design/frontend/Magento/luma/Magento_InstantPurchase/web/css/source/_module.less b/app/design/frontend/Magento/luma/Magento_InstantPurchase/web/css/source/_module.less index 9877f6bbcea23..230cce3a9aeff 100644 --- a/app/design/frontend/Magento/luma/Magento_InstantPurchase/web/css/source/_module.less +++ b/app/design/frontend/Magento/luma/Magento_InstantPurchase/web/css/source/_module.less @@ -1,16 +1,16 @@ & when (@media-common = true) { - .box-tocart { - .action.instant-purchase { - &:extend(.abs-button-l all); - &:extend(.abs-button-responsive all); + .box-tocart { + .action.instant-purchase { + &:extend(.abs-button-l all); + &:extend(.abs-button-responsive all); - &:not(:last-child) { - margin-bottom: 15px; - } + &:not(:last-child) { + margin-bottom: 15px; + } - vertical-align: top; + vertical-align: top; + } } - } } // @@ -18,11 +18,11 @@ // _____________________________________________ .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__m) { - .box-tocart { - .action.instant-purchase { - margin-bottom: 0; - margin-right: 1%; - width: 49%; + .box-tocart { + .action.instant-purchase { + margin-bottom: 0; + margin-right: 1%; + width: 49%; + } } - } } From d1e4c1c4d0423e5ed5a9eacf970c51a3217fd13f Mon Sep 17 00:00:00 2001 From: hitesh-wagento Date: Tue, 5 Jun 2018 11:40:48 +0530 Subject: [PATCH 3/4] [Correct code formatting] --- .../web/css/source/_module.less | 753 +++++++++--------- 1 file changed, 379 insertions(+), 374 deletions(-) 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 03ff1fb09a3e4..4b5cd30a4a8ee 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 @@ -8,285 +8,290 @@ // _____________________________________________ & when (@media-common = true) { - .multicheckout { - &.results, &.success { - h3 { - font-size: 1.6rem; - margin-bottom: @indent__base; - margin-top: @indent__l; - a { - color: @text__color; - &:hover { - text-decoration: none; - } - } - } - - ul.orders-list { - list-style: none; - padding-left: 0; - } - - .orders-list { - margin-top: @indent__m; - padding-left: @indent__base - 4px; - - .shipping-list { - .shipping-item { - margin-left:84px; - } - .shipping-label { - font-weight: @font-weight__bold; - margin-right: @indent__s; - } - .shipping-address { - font-weight: @font-weight__regular; - } - .error-block { - color: @color-red10; - .error-label { - font-weight: @font-weight__bold; - margin-right: @indent__s; + .multicheckout { + &.results, &.success { + h3 { + font-size: 1.6rem; + margin-bottom: @indent__base; + margin-top: @indent__l; + a { + color: @text__color; + &:hover { + text-decoration: none; + } } - .error-description { - font-weight: @font-weight__regular; + } + + ul.orders-list { + list-style: none; + padding-left: 0; + } + + .orders-list { + margin-top: @indent__m; + padding-left: @indent__base - 4px; + + .shipping-list { + .shipping-item { + margin-left:84px; + } + + .shipping-label { + font-weight: @font-weight__bold; + margin-right: @indent__s; + } + + .shipping-address { + font-weight: @font-weight__regular; + } + + .error-block { + color: @color-red10; + + .error-label { + font-weight: @font-weight__bold; + margin-right: @indent__s; + } + + .error-description { + font-weight: @font-weight__regular; + } + } } - } } - } - .orders-succeed { - .orders-list { - margin-top: 0; + .orders-succeed { + .orders-list { + margin-top: 0; + + .shipping-list { + .order-id { + float:left; + } + .shipping-item { + margin-left:100px; + } + } + } + } + } - .shipping-list { - .order-id { - float:left; - } - .shipping-item { - margin-left:100px; - } + .title { + margin-bottom: @indent__l; + + strong { + font-weight: @font-weight__regular; } - } } - } - .title { - margin-bottom: @indent__l; + .table-wrapper { + margin-bottom: 0; - strong { - font-weight: @font-weight__regular; - } - } + .action.delete { + display: inline-block; + } + + .col { + .qty { + display: inline-block; + + .input-text { + &:extend(.abs-input-qty all); + } + } - .table-wrapper { - margin-bottom: 0; + .label { + &:extend(.abs-visually-hidden all); + } - .action.delete { - display: inline-block; - } + &.item { + .action.edit { + font-weight: @font-weight__regular; + margin-left: @indent__s; + } + } + } - .col { - .qty { - display: inline-block; + .cart-price { + &:extend(.abs-checkout-cart-price all); + } - .input-text { - &:extend(.abs-input-qty all); - } + .product-item-name { + &:extend(.abs-checkout-product-name all); + } } - .label { - &:extend(.abs-visually-hidden all); + &:not(.address) { + .table-wrapper { + .product-item-name { + margin: 0; + } + } } - &.item { - .action.edit { - font-weight: @font-weight__regular; - margin-left: @indent__s; - } + > .actions-toolbar { + margin-top: @indent__xl; } - } - .cart-price { - &:extend(.abs-checkout-cart-price all); - } + .actions-toolbar { + > .secondary { + display: block; - .product-item-name { - &:extend(.abs-checkout-product-name all); - } - } + .action { + margin-bottom: @indent__m; - &:not(.address) { - .table-wrapper { - .product-item-name { - margin: 0; - } - } - } + &.back { + display: block; + margin-left: 0; + } + } + } - > .actions-toolbar { - margin-top: @indent__xl; - } + > .primary { + margin-right: @indent__s; + } + } - .actions-toolbar { - > .secondary { - display: block; + .action.primary { + &:extend(.abs-button-l all); + } - .action { - margin-bottom: @indent__m; + .item-options { + margin: @indent__s 0 0; - &.back { - display: block; - margin-left: 0; - } + &:extend(.abs-product-options-list all); + &:extend(.abs-add-clearfix all); } - } - > .primary { - margin-right: @indent__s; - } - } + &:extend(.abs-account-blocks all); - .action.primary { - &:extend(.abs-button-l all); - } + .block { + &:extend(.abs-add-clearfix all); - .item-options { - margin: @indent__s 0 0; - - &:extend(.abs-product-options-list all); - &:extend(.abs-add-clearfix all); - } + .methods-shipping { + .item-content { + .fieldset { + > .legend { + &:extend(.abs-visually-hidden all); + } - &:extend(.abs-account-blocks all); + > .legend + br { + &:extend(.abs-no-display all); + } - .block { - &:extend(.abs-add-clearfix all); + > .field { + &:before { + display: none; + } - .methods-shipping { - .item-content { - .fieldset { - > .legend { - &:extend(.abs-visually-hidden all); + .control { + display: inline-block; + } + } + } + } } + } - > .legend + br { - &:extend(.abs-no-display all); - } + .block-title, + .block-content .title { + &:extend(.abs-account-title all); + border-bottom: @border-width__base solid @border-color__base; + padding-bottom: @indent__s; - > .field { - &:before { - display: none; - } + strong { + font-weight: @font-weight__regular; - .control { - display: inline-block; - } + span { + .lib-css(color, @primary__color__light); + } } - } } - } - } - - .block-title, - .block-content .title { - &:extend(.abs-account-title all); - border-bottom: @border-width__base solid @border-color__base; - padding-bottom: @indent__s; - - strong { - font-weight: @font-weight__regular; - span { - .lib-css(color, @primary__color__light); + .block-content { + &:extend(.abs-add-clearfix all); + .title { + border-bottom: none; + padding-bottom: 0; + } } - } - } - .block-content { - &:extend(.abs-add-clearfix all); - .title { - border-bottom: none; - padding-bottom: 0; - } - } + &.order-review { + .block-title > strong { + .lib-font-size(24); + } - &.order-review { - .block-title > strong { - .lib-font-size(24); - } + .block-shipping { + .block-content:not(:last-child) { + margin-bottom: @indent__xl; + } + } - .block-shipping { - .block-content:not(:last-child) { - margin-bottom: @indent__xl; + .error-description { + color: @color-red10; + font-weight: @font-weight__regular; + margin-bottom: @indent__s; + margin-top: -@indent__s; + } } - } - .error-description { - color: @color-red10; - font-weight: @font-weight__regular; - margin-bottom: @indent__s; - margin-top: -@indent__s; - } - } - - .box-title { - span { - margin-right: @indent__s; - } + .box-title { + span { + margin-right: @indent__s; + } - > .action { - margin: 0; - } - } + > .action { + margin: 0; + } + } - .box-shipping-method { - .price { - font-weight: @font-weight__bold; - } - } + .box-shipping-method { + .price { + font-weight: @font-weight__bold; + } + } - .box-billing-method { - .fieldset { - margin: 0; + .box-billing-method { + .fieldset { + margin: 0; - .legend.box-title { - margin: 0 0 @indent__xs; + .legend.box-title { + margin: 0 0 @indent__xs; + } + } } - } - } - .hidden { - &:extend(.abs-no-display all); - } + .hidden { + &:extend(.abs-no-display all); + } - .checkout-review .grand.totals { - .lib-font-size(@font-size__xl); - margin-bottom: @indent__xl; + .checkout-review .grand.totals { + .lib-font-size(@font-size__xl); + margin-bottom: @indent__xl; - .mark { - font-weight: @font-weight__regular; - } + .mark { + font-weight: @font-weight__regular; + } + } } - } - [class^='multishipping-'] { - .nav-sections, - .nav-toggle { - &:extend(.abs-no-display all); - } + [class^='multishipping-'] { + .nav-sections, + .nav-toggle { + &:extend(.abs-no-display all); + } - .logo { - margin-left: 0; + .logo { + margin-left: 0; + } } - } - .multishipping-checkout-success { - .nav-sections { - display: block; + .multishipping-checkout-success { + .nav-sections { + display: block; + } } - } } // @@ -294,200 +299,200 @@ // _____________________________________________ .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__s) { - .multicheckout { - .data.table { - .address { - &:before { - margin-bottom: @indent__xs; + .multicheckout { + .data.table { + .address { + &:before { + margin-bottom: @indent__xs; + } + } } - } - } - - .product-item-name, - .price-including-tax, - .price-excluding-tax { - display: inline-block; - } - .block-content .box { - &:not(:last-child) { - margin-bottom: @indent__xl; - } + .product-item-name, + .price-including-tax, + .price-excluding-tax { + display: inline-block; + } - &:last-child { - margin-bottom: 0; - } - } + .block-content .box { + &:not(:last-child) { + margin-bottom: @indent__xl; + } - &.order-review { - .box-items { - .data.table { - thead { - display: block; + &:last-child { + margin-bottom: 0; + } + } - tr { - display: block; + &.order-review { + .box-items { + .data.table { + thead { + display: block; + + tr { + display: block; + } + + .col.item { + display: block; + padding: 0; + } + } + } } - .col.item { - display: block; - padding: 0; + .data.table { + &:extend(.abs-checkout-order-review all); } - } } - } - - .data.table { - &:extend(.abs-checkout-order-review all); - } - } - .actions-toolbar { - .action { - margin-bottom: @indent__m; - } + .actions-toolbar { + .action { + margin-bottom: @indent__m; + } - > .primary { - margin-bottom: @indent__m; - margin-right: 0; - } + > .primary { + margin-bottom: @indent__m; + margin-right: 0; + } + } } - } } .media-width(@extremum, @break) when (@extremum = 'min') and (@break = @screen__s) { - .multicheckout { - .actions-toolbar { - .column:not(.sidebar-main) & { - &:extend(.abs-reset-left-margin-desktop-s all); - } + .multicheckout { + .actions-toolbar { + .column:not(.sidebar-main) & { + &:extend(.abs-reset-left-margin-desktop-s all); + } - .secondary { - float: none; - margin-top: 11px; - text-align: right; + .secondary { + float: none; + margin-top: 11px; + text-align: right; - .action { - margin-left: @indent__s; + .action { + margin-left: @indent__s; - &.back { - display: block; - float: left; - } + &.back { + display: block; + float: left; + } + } + } } - } - } - - .item-options { - margin: @indent__base 0 0; - } - - .block-content .box { - margin-bottom: 0; - } - .block-shipping { - .box { - &:extend(.abs-add-box-sizing-desktop-s all); - float: left; - width: 25%; - } + .item-options { + margin: @indent__base 0 0; + } - .box-shipping-method { - padding-left: @indent__m; - padding-right: @indent__m; - width: 50%; + .block-content .box { + margin-bottom: 0; + } - .fieldset { - .legend { - &:extend(.abs-reset-left-margin-desktop-s all); - } + .block-shipping { + .box { + &:extend(.abs-add-box-sizing-desktop-s all); + float: left; + width: 25%; + } - .field { - &:before { - display: none; + .box-shipping-method { + padding-left: @indent__m; + padding-right: @indent__m; + width: 50%; + + .fieldset { + .legend { + &:extend(.abs-reset-left-margin-desktop-s all); + } + + .field { + &:before { + display: none; + } + } + } } - } } - } - } - .block-billing { - &:extend(.abs-add-clearfix-desktop-s all); - .box-billing-address { - &:extend(.abs-add-box-sizing-desktop-s all); - float: left; - width: 25%; - } - - .box-billing-method { - &:extend(.abs-add-box-sizing-desktop-s all); - float: left; - padding-left: @indent__m; - width: 50%; - } - } + .block-billing { + &:extend(.abs-add-clearfix-desktop-s all); + .box-billing-address { + &:extend(.abs-add-box-sizing-desktop-s all); + float: left; + width: 25%; + } - &.form.address { - .table-wrapper { - .applicable { - margin: 7px 0 0; + .box-billing-method { + &:extend(.abs-add-box-sizing-desktop-s all); + float: left; + padding-left: @indent__m; + width: 50%; + } } - } - } - &.order-review { - .box-items { - clear: left; - float: none; - padding-top: @indent__xl; - width: auto; - } - - .col.item { - width: 75%; - } - } + &.form.address { + .table-wrapper { + .applicable { + margin: 7px 0 0; + } + } + } - // Payment methods - .methods-payment { - .item-content > .fieldset { - width: auto; + &.order-review { + .box-items { + clear: left; + float: none; + padding-top: @indent__xl; + width: auto; + } - .field { - &.cvv { - display: inline-block; - width: auto; - } + .col.item { + width: 75%; + } } - } - .fieldset > .field:not(.choice) { - > .label { - float: none; - margin-bottom: 8px; - text-align: left; - width: auto; - } + // Payment methods + .methods-payment { + .item-content > .fieldset { + width: auto; + + .field { + &.cvv { + display: inline-block; + width: auto; + } + } + } + + .fieldset > .field:not(.choice) { + > .label { + float: none; + margin-bottom: 8px; + text-align: left; + width: auto; + } - &:not(.cvv) { - .control { - width: 100%; - } + &:not(.cvv) { + .control { + width: 100%; + } + } + } } - } } - } } .media-width(@extremum, @break) when (@extremum = 'max') and (@break = @screen__m) { - .multishipping-checkout-success { - .nav-toggle { - display: block; - } + .multishipping-checkout-success { + .nav-toggle { + display: block; + } - .logo { - margin-left: @indent__xl; + .logo { + margin-left: @indent__xl; + } } - } } From b862e8630187360a35c88c06ced984388bb4148d Mon Sep 17 00:00:00 2001 From: hitesh-wagento Date: Tue, 5 Jun 2018 14:38:04 +0530 Subject: [PATCH 4/4] [Code formatting in Luma and Blank theme] --- .../web/css/source/module/checkout/_authentication.less | 1 + .../web/css/source/module/checkout/_payment-options.less | 1 + .../web/css/source/module/checkout/_shipping.less | 3 +++ .../blank/Magento_GiftRegistry/web/css/source/_module.less | 1 + .../blank/Magento_Multishipping/web/css/source/_module.less | 5 +++++ 5 files changed, 11 insertions(+) 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 e1e23a9ffbb15..c5a26b3bc83ac 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 @@ -25,6 +25,7 @@ padding: @block-auth__dropdown__padding; } } + .authentication-wrapper { float: right; margin-top: -1.5*@indent__xl; diff --git a/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_payment-options.less b/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_payment-options.less index 4e1156949de3a..3ce46a73a11c4 100644 --- a/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_payment-options.less +++ b/app/design/frontend/Magento/blank/Magento_Checkout/web/css/source/module/checkout/_payment-options.less @@ -198,6 +198,7 @@ .payment-option-title { .lib-css(padding-left, @checkout-payment-option-content__padding__xl); } + .payment-option-content { .payment-option-inner { + .actions-toolbar { 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 e7f0259fc9ce3..0a463a95e3182 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 @@ -188,6 +188,7 @@ } } } + .row-error { td { border-top: none; @@ -285,6 +286,7 @@ .lib-css(max-width, @checkout-shipping-address__max-width); } } + .table-checkout-shipping-method { width: auto; } @@ -324,6 +326,7 @@ } } } + .table-checkout-shipping-method { min-width: 500px; } 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 d05bcec38cbed..03a474012cb0c 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 @@ -15,6 +15,7 @@ .actions-toolbar:not(:last-child) { margin-bottom: @indent__xl; } + .fieldset { .nested { .field:not(.choice) { 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 1e5769f3d7396..47dcd045ed46d 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 @@ -35,13 +35,16 @@ .shipping-item { margin-left:84px; } + .shipping-label { font-weight: @font-weight__bold; margin-right: @indent__s; } + .shipping-address { font-weight: @font-weight__regular; } + .error-block { color: @color-red10; @@ -49,6 +52,7 @@ font-weight: @font-weight__bold; margin-right: @indent__s; } + .error-description { font-weight: @font-weight__regular; } @@ -64,6 +68,7 @@ .order-id { float:left; } + .shipping-item { margin-left:100px; }