Commit 2ec5cd86 by dhn

购物车页优化

parent d1a7b8c1
...@@ -33,15 +33,13 @@ $hasCouponCode = (bool) strlen($block->getCouponCode()); ...@@ -33,15 +33,13 @@ $hasCouponCode = (bool) strlen($block->getCouponCode());
> >
--> -->
<div class="block discount" <div class="block discount"
id="block-discount" id="block-discount">
data-mage-init='{"collapsible":{"active":"true", "openedState": "active", "saveState": false}}'
>
<!-- <!--
<div class="title" data-role="title" aria-controls="block-summary" role="tab" aria-selected="true" aria-expanded="true" tabindex="0"> <div class="title" data-role="title" aria-controls="block-summary" role="tab" aria-selected="true" aria-expanded="true" tabindex="0">
<strong id="block-shipping-coupon" role="heading" aria-level="2"><?= __("Coupon Code") ?> </strong> <strong id="block-shipping-coupon" role="heading" aria-level="2"><?= __("Coupon Code") ?> </strong>
</div> </div>
--> -->
<div class="content" data-role="content" aria-labelledby="block-discount-heading" style="display: block;"> <div class="content" style="display: block;">
<form id="discount-coupon-form" <form id="discount-coupon-form"
action="<?= $block->escapeUrl($block->getUrl('checkout/cart/couponPost')) ?>" action="<?= $block->escapeUrl($block->getUrl('checkout/cart/couponPost')) ?>"
method="post" method="post"
...@@ -52,7 +50,6 @@ $hasCouponCode = (bool) strlen($block->getCouponCode()); ...@@ -52,7 +50,6 @@ $hasCouponCode = (bool) strlen($block->getCouponCode());
<div class="fieldset coupon<?= $hasCouponCode ? ' applied' : '' ?>"> <div class="fieldset coupon<?= $hasCouponCode ? ' applied' : '' ?>">
<input type="hidden" name="remove" id="remove-coupon" value="0" /> <input type="hidden" name="remove" id="remove-coupon" value="0" />
<div class="field" style="width: 70%;"> <div class="field" style="width: 70%;">
<label for="coupon_code" class="label"><span><?= $block->escapeHtml(__('Enter discount code')) ?></span></label>
<div class="control" style="float: left;margin-top: 0px;width: 100%;"> <div class="control" style="float: left;margin-top: 0px;width: 100%;">
<input type="text" <input type="text"
class="input-text" class="input-text"
...@@ -66,7 +63,7 @@ $hasCouponCode = (bool) strlen($block->getCouponCode()); ...@@ -66,7 +63,7 @@ $hasCouponCode = (bool) strlen($block->getCouponCode());
/> />
</div> </div>
</div> </div>
<div class="actions-toolbar" style="clear: none;"> <div class="actions-toolbar" style="clear: none;margin-top: 1.25rem;margin-bottom: 0px;">
<?php if (!$hasCouponCode) :?> <?php if (!$hasCouponCode) :?>
<div class="primary"> <div class="primary">
<button class="action apply primary" style="padding: 0.5rem 1rem;width:100%;background-color: #444;" type="button" value="<?= $block->escapeHtmlAttr(__('Apply Discount')) ?>"> <button class="action apply primary" style="padding: 0.5rem 1rem;width:100%;background-color: #444;" type="button" value="<?= $block->escapeHtmlAttr(__('Apply Discount')) ?>">
......
...@@ -71,7 +71,6 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec ...@@ -71,7 +71,6 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec
display:none; display:none;
} }
.cart-title{ .cart-title{
order: -4;
margin-top:50px; margin-top:50px;
color: #444; color: #444;
width: 100%!important; width: 100%!important;
...@@ -98,8 +97,8 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec ...@@ -98,8 +97,8 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec
z-index: 1; z-index: 1;
border-top: 1px solid #fff; border-top: 1px solid #fff;
} }
.cart-title{ .cart-title{
order: -4;
margin-top: 1rem; margin-top: 1rem;
color: #444; color: #444;
width: 100%!important; width: 100%!important;
...@@ -108,7 +107,15 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec ...@@ -108,7 +107,15 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec
font-size: 26px; font-size: 26px;
} }
} }
.cart-top{
order: -4;
text-align: center;
width:100%!important;
}
.msg-content{
margin: 2rem 0px;
color: #AB3F3F;
}
.item-options-line span{ .item-options-line span{
display: inline-block; display: inline-block;
} }
...@@ -119,9 +126,6 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec ...@@ -119,9 +126,6 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec
.cart-container .cart.table-wrapper .item-options { .cart-container .cart.table-wrapper .item-options {
min-width: 100px; min-width: 100px;
} }
.product-image-photo{
border:1px solid #ddd;
}
} }
.is_mobile .item-info{ .is_mobile .item-info{
...@@ -160,7 +164,7 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec ...@@ -160,7 +164,7 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec
font-size: 16px; font-size: 16px;
font-weight: 400; font-weight: 400;
font-style: normal; font-style: normal;
color: #5c5c5c; color: #000000;
-webkit-transition: color .2s ease-in-out; -webkit-transition: color .2s ease-in-out;
transition: color .2s ease-in-out; transition: color .2s ease-in-out;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
...@@ -259,12 +263,10 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec ...@@ -259,12 +263,10 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec
.price-final_price .price{ .price-final_price .price{
font-size: 18px; font-size: 18px;
} }
}
.is_mobile .item-info:first-child{ .is_mobile .item-info:first-child{
margin:0px 0px 3rem 0; margin:0px 0px 3rem 0;
} }
}
.item-info-right,.item-info-left{ .item-info-right,.item-info-left{
padding-bottom:0px; padding-bottom:0px;
position:relative; position:relative;
...@@ -277,40 +279,18 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec ...@@ -277,40 +279,18 @@ $mobileDetect = $objectManager->get(\Joshine\Common\Lib\MobileDetect\MobileDetec
</style> </style>
<?php $mergedCells = ($this->helper(Magento\Tax\Helper\Data::class)->displayCartBothPrices() ? 2 : 1); ?> <?php $mergedCells = ($this->helper(Magento\Tax\Helper\Data::class)->displayCartBothPrices() ? 2 : 1); ?>
<?= $block->getChildHtml('form_before') ?> <?= $block->getChildHtml('form_before') ?>
<h1 class="cart-title">Shipping Cart</h1> <div class="cart-top">
<?php if (!$is_free_shipping): ?> <h1 class="cart-title">Shipping Cart</h1>
<div class="free-shipping-area area-blk"> <?php if (!$is_free_shipping): ?>
<img alt="" class="cart-icon" src="/media/wysiwyg/free-shipping-cart.png">
<div class="content-wrap">
<div class="free_message">
<div class="msg-title">
<p style="font-weight: bold;"><?= $block->escapeHtml(__('Shipping Fee')) ?> </p>
</div>
<div class="msg-content"> <div class="msg-content">
<?= $block->escapeHtml(__('Spend')) ?> <span style="color:#EB001B;font-size: 16px;font-weight: bold;"><?= $block->escapeHtml(
$this->helper(Magento\Checkout\Helper\Data::class)->formatPrice($difference_price),
['span']
) ?></span> <?= $block->escapeHtml(__('more and get')) ?> <span style="font-weight: bold;"><?= $block->escapeHtml(__('FREE SHIPPING')) ?></span>!
</div>
</div>
</div>
</div>
<?php endif ?>
<?php if (!$is_free_shipping): ?> <?= $block->escapeHtml(__('Spend')) ?> <?= $block->escapeHtml(
<div class="free-shipping-area area-blk-notitle">
<div class="content-wrap">
<div class="free_message">
<div class="msg-content">
<?= $block->escapeHtml(__('Spend')) ?> <span style="color:#EB001B;font-size: 18px;"><?= $block->escapeHtml(
$this->helper(Magento\Checkout\Helper\Data::class)->formatPrice($difference_price), $this->helper(Magento\Checkout\Helper\Data::class)->formatPrice($difference_price),
['span'] ['span']
) ?></span><?= $block->escapeHtml(__(' more and get')) ?> <span style="font-weight: bold;"><?= $block->escapeHtml(__('FREE SHIPPING')) ?></span> ) ?> <?= $block->escapeHtml(__('more and get free shipping!')) ?>
</div>
</div> </div>
</div> <?php endif ?>
</div> </div>
<?php endif ?>
<form action="<?= $block->escapeUrl($block->getUrl('checkout/cart/updatePost')) ?>" <form action="<?= $block->escapeUrl($block->getUrl('checkout/cart/updatePost')) ?>"
method="post" method="post"
......
...@@ -28,7 +28,7 @@ ...@@ -28,7 +28,7 @@
<?php if ($block->getContinueShoppingUrl()): ?> <?php if ($block->getContinueShoppingUrl()): ?>
<div class="continue-content" style="height:40px;"> <div class="continue-content" style="height:40px;margin-top: 1rem;">
<button class="action continue" style="width:100%;" onclick="window.location.href='<?= $block->escapeUrl($block->getContinueShoppingUrl()) ?>'">Continue shopping</button> <button class="action continue" style="width:100%;" onclick="window.location.href='<?= $block->escapeUrl($block->getContinueShoppingUrl()) ?>'">Continue shopping</button>
</div> </div>
......
...@@ -918,11 +918,20 @@ p.shopbycate-title { ...@@ -918,11 +918,20 @@ p.shopbycate-title {
background-color: rgba(0,0,0,.03); background-color: rgba(0,0,0,.03);
padding-bottom: 1rem; padding-bottom: 1rem;
} }
.checkout-cart-index #discount-coupon-form .fieldset{
margin-bottom:0px;
}
.checkout-cart-index #block-discount .content{
padding:0px 1rem;
}
@media (max-width: 768px){ @media (max-width: 768px){
.checkout-cart-index .cart-container .cart-summary { .checkout-cart-index .cart-container .cart-summary {
margin:0; margin:0;
background-color: #ffffff; background-color: #ffffff;
} }
.checkout-cart-index #block-discount .content{
padding:0;
}
.checkout-index-index .method-content .method-msg{ .checkout-index-index .method-content .method-msg{
padding: 5px 0 5px 2.2rem; padding: 5px 0 5px 2.2rem;
font-size: 12px; font-size: 12px;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment