Product details page layout is fixed
This commit is contained in:
parent
9cea4133f7
commit
477dded06e
|
|
@ -292,7 +292,8 @@ class Cart {
|
|||
* and sync the cookies products
|
||||
* with the existing data of cart
|
||||
* in the cart tables;
|
||||
*/
|
||||
*/
|
||||
|
||||
public function mergeCart() {
|
||||
|
||||
if(Cookie::has('cart_session_id')) {
|
||||
|
|
|
|||
|
|
@ -71,6 +71,9 @@ class SessionController extends Controller
|
|||
public function destroy($id)
|
||||
{
|
||||
auth()->guard('customer')->logout();
|
||||
|
||||
Event::fire('customer.after.logout', 1);
|
||||
|
||||
return redirect()->route($this->_config['redirect']);
|
||||
}
|
||||
}
|
||||
|
|
@ -30,6 +30,10 @@ class CustomerEventsHandler {
|
|||
Cart::mergeCart();
|
||||
}
|
||||
|
||||
//use this when there is very uttermost need to use it.
|
||||
public function onCustomerLogout($event) {
|
||||
}
|
||||
|
||||
/**
|
||||
* Register the listeners for the subscriber.
|
||||
*
|
||||
|
|
@ -39,5 +43,7 @@ class CustomerEventsHandler {
|
|||
public function subscribe($events)
|
||||
{
|
||||
$events->listen('customer.after.login', 'Webkul\Customer\Http\Listeners\CustomerEventsHandler@onCustomerLogin');
|
||||
|
||||
$events->listen('customer.after.logout', 'Webkul\Customer\Http\Listeners\CustomerEventsHandler@onCustomerLogout');
|
||||
}
|
||||
}
|
||||
|
|
@ -23,9 +23,9 @@ Route::group(['middleware' => ['web']], function () {
|
|||
|
||||
// //Routes for product cart
|
||||
|
||||
Route::post('products/guest/cart/add/{id}', 'Webkul\Cart\Http\Controllers\CartController@add')->name('cart.add');
|
||||
Route::post('products/add/{id}', 'Webkul\Cart\Http\Controllers\CartController@add')->name('cart.add');
|
||||
|
||||
Route::post('product/guest/cart/remove/{id}', 'Webkul\Cart\Http\Controllers\CartController@remove')->name('cart.remove');
|
||||
Route::post('product/remove/{id}', 'Webkul\Cart\Http\Controllers\CartController@remove')->name('cart.remove');
|
||||
|
||||
// Route::post('product/customer/cart/add/{id}', 'Webkul\Cart\Http\Controllers\CartController@add')->name('cart.customer.add');
|
||||
|
||||
|
|
|
|||
|
|
@ -1313,347 +1313,337 @@ section.product-detail {
|
|||
}
|
||||
|
||||
div.layouter {
|
||||
display: block;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
|
||||
.mixed-group {
|
||||
form {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
|
||||
.single-image {
|
||||
padding: 2px;
|
||||
div.product-image-group {
|
||||
margin-right: 36px;
|
||||
|
||||
img {
|
||||
height: 280px;
|
||||
width: 280px;
|
||||
div {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
|
||||
.thumb-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-right: 4px;
|
||||
height: 480px;
|
||||
width: 120px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
justify-content: flex-start;
|
||||
|
||||
.thumb-frame {
|
||||
border: 2px solid transparent;
|
||||
background: #F2F2F2;
|
||||
max-width: 120px;
|
||||
width: auto;
|
||||
height: 120px;
|
||||
|
||||
&.active {
|
||||
border-color: #979797;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.gallery-control {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
|
||||
.overlay {
|
||||
opacity: 0.3;
|
||||
background: #000000;
|
||||
width: 100%;
|
||||
height: 18px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.icon {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
&.top {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&.bottom {
|
||||
bottom: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.product-hero-image {
|
||||
display: block;
|
||||
position: relative;
|
||||
background: #F2F2F2;
|
||||
width: 480px;
|
||||
max-height: 480px;
|
||||
|
||||
.wishlist {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 12px;
|
||||
}
|
||||
|
||||
.share {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 45px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.cart-fav-seg {
|
||||
display: block;
|
||||
float: right;
|
||||
}
|
||||
}
|
||||
|
||||
.details {
|
||||
|
||||
.product-name {
|
||||
margin-top: 20px;
|
||||
font-size: 24px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
width: 50%;
|
||||
|
||||
.product-price {
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rating-reviews {
|
||||
margin-top: 0px;
|
||||
width: 50%;
|
||||
margin-left: 20px;
|
||||
|
||||
.title-inline {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20px;
|
||||
width: 100%;
|
||||
|
||||
button {
|
||||
float: right;
|
||||
border-radius: 0px !important;
|
||||
}
|
||||
}
|
||||
|
||||
.overall {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
height: 150px;
|
||||
|
||||
.left-side {
|
||||
.product-ratings {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.number{
|
||||
font-size: 34px;
|
||||
}
|
||||
}
|
||||
|
||||
.right-side {
|
||||
display: block;
|
||||
|
||||
.rater {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
|
||||
.star {
|
||||
width: 50px;
|
||||
height: 20px;
|
||||
padding: 1px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
.line-bar {
|
||||
height: 4px;
|
||||
width: 158px;
|
||||
margin-right: 12px;
|
||||
background: $bar-color;
|
||||
|
||||
.line-value {
|
||||
background-color: $dark-blue-shade;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.reviews {
|
||||
margin-top: 34px;
|
||||
margin-bottom: 90px;
|
||||
|
||||
.review {
|
||||
margin-bottom: 25px;
|
||||
|
||||
.title {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.stars {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.message {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
}
|
||||
.view-all {
|
||||
margin-top:15px;
|
||||
color: $logo-color;
|
||||
margin-bottom:15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
div.product-image-group {
|
||||
width: 43%;
|
||||
float: left;
|
||||
min-height: 1px;
|
||||
position: relative;
|
||||
|
||||
.thumb-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
margin-right: 4px;
|
||||
height: 480px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
float: left;
|
||||
|
||||
.thumb-frame {
|
||||
border: 2px solid transparent;
|
||||
background: #F2F2F2;
|
||||
width: 120px;
|
||||
height: 120px;
|
||||
|
||||
&.active {
|
||||
border-color: #979797;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.gallery-control {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
z-index: 1;
|
||||
|
||||
.overlay {
|
||||
opacity: 0.3;
|
||||
background: #000000;
|
||||
width: 100%;
|
||||
height: 18px;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
z-index: -1;
|
||||
}
|
||||
|
||||
.icon {
|
||||
z-index: 2;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
&.top {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
&.bottom {
|
||||
bottom: 0;
|
||||
.total-reviews {
|
||||
display: inline-block;
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.product-hero-image {
|
||||
display: block;
|
||||
position: relative;
|
||||
background: #F2F2F2;
|
||||
width: 480px;
|
||||
max-height: 480px;
|
||||
float: left;
|
||||
|
||||
.wishlist {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 12px;
|
||||
}
|
||||
|
||||
.share {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 45px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.details {
|
||||
width: 57%;
|
||||
float: left;
|
||||
|
||||
.product-price {
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.product-ratings {
|
||||
margin-bottom: 20px;
|
||||
|
||||
.icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.total-reviews {
|
||||
display: inline-block;
|
||||
margin-left: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.product-heading {
|
||||
font-size: 24px;
|
||||
color: $product-font-color;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.product-price {
|
||||
margin-bottom: 15px;
|
||||
font-size: 24px;
|
||||
|
||||
.special-price {
|
||||
.product-heading {
|
||||
font-size: 24px;
|
||||
color: $product-font-color;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
.stock-status {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
.product-price {
|
||||
margin-bottom: 15px;
|
||||
font-size: 24px;
|
||||
|
||||
.description {
|
||||
margin-bottom: 15px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: solid 1px rgba(162, 162, 162, 0.2)
|
||||
}
|
||||
|
||||
.full-specifications {
|
||||
td {
|
||||
padding: 10px 0;
|
||||
color: #5E5E5E;
|
||||
|
||||
&:first-child {
|
||||
padding-right: 40px;
|
||||
.special-price {
|
||||
font-size: 24px;
|
||||
}
|
||||
}
|
||||
|
||||
.stock-status {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
.description {
|
||||
margin-bottom: 15px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: solid 1px rgba(162, 162, 162, 0.2)
|
||||
}
|
||||
|
||||
.full-specifications {
|
||||
td {
|
||||
padding: 10px 0;
|
||||
color: #5E5E5E;
|
||||
|
||||
&:first-child {
|
||||
padding-right: 40px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.accordian .accordian-header {
|
||||
font-size: 16px;
|
||||
padding-left: 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.attributes {
|
||||
display: block;
|
||||
width: 100%;
|
||||
border-bottom: solid 1px rgba(162, 162, 162, 0.2);
|
||||
}
|
||||
|
||||
.full-description {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.accordian .accordian-header {
|
||||
font-size: 16px;
|
||||
padding-left: 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
// .rating-reviews {
|
||||
// margin-top: 0px;
|
||||
// width: 50%;
|
||||
// margin-left: 20px;
|
||||
|
||||
// .title-inline {
|
||||
// display: inline-flex;
|
||||
// align-items: center;
|
||||
// justify-content: space-between;
|
||||
// margin-bottom: 20px;
|
||||
// width: 100%;
|
||||
|
||||
// button {
|
||||
// float: right;
|
||||
// border-radius: 0px !important;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .overall {
|
||||
// display: flex;
|
||||
// flex-direction: row;
|
||||
// align-items: center;
|
||||
// justify-content: space-between;
|
||||
// height: 150px;
|
||||
|
||||
// .left-side {
|
||||
// margin-bottom: 20px;
|
||||
|
||||
// .number{
|
||||
// font-size: 34px;
|
||||
// }
|
||||
// }
|
||||
|
||||
// .right-side {
|
||||
// display: block;
|
||||
|
||||
// .rater {
|
||||
// display: inline-flex;
|
||||
// align-items: center;
|
||||
|
||||
// .star {
|
||||
// width: 50px;
|
||||
// height: 20px;
|
||||
// padding: 1px;
|
||||
// margin-right: 8px;
|
||||
// }
|
||||
|
||||
// .line-bar {
|
||||
// height: 4px;
|
||||
// width: 158px;
|
||||
// margin-right: 12px;
|
||||
// background: $bar-color;
|
||||
|
||||
// .line-value {
|
||||
// background-color: $dark-blue-shade;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
// .reviews {
|
||||
// margin-top: 34px;
|
||||
// margin-bottom: 90px;
|
||||
|
||||
// .review {
|
||||
// margin-bottom: 25px;
|
||||
|
||||
// .title {
|
||||
// margin-bottom: 5px;
|
||||
// }
|
||||
|
||||
// .stars {
|
||||
// margin-bottom: 15px;
|
||||
// }
|
||||
// .message {
|
||||
// margin-bottom: 10px;
|
||||
// }
|
||||
// }
|
||||
// .view-all {
|
||||
// margin-top:15px;
|
||||
// color: $logo-color;
|
||||
// margin-bottom:15px;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
.attributes {
|
||||
display: block;
|
||||
width: 100%;
|
||||
border-bottom: solid 1px rgba(162, 162, 162, 0.2);
|
||||
}
|
||||
|
||||
.full-description {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.rating-reviews {
|
||||
// .rating-reviews {
|
||||
|
||||
.rating-header {
|
||||
font-weight: 600;
|
||||
padding: 20px 0;
|
||||
}
|
||||
// .rating-header {
|
||||
// font-weight: 600;
|
||||
// padding: 20px 0;
|
||||
// }
|
||||
|
||||
.stars {
|
||||
.icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
}
|
||||
// .stars {
|
||||
// .icon {
|
||||
// width: 16px;
|
||||
// height: 16px;
|
||||
// }
|
||||
// }
|
||||
|
||||
.overall {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
// .overall {
|
||||
// display: flex;
|
||||
// flex-direction: row;
|
||||
// align-items: center;
|
||||
// justify-content: space-between;
|
||||
|
||||
.review-info {
|
||||
.number {
|
||||
font-size: 34px;
|
||||
}
|
||||
// .review-info {
|
||||
// .number {
|
||||
// font-size: 34px;
|
||||
// }
|
||||
|
||||
.total-reviews {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
// .total-reviews {
|
||||
// margin-top: 10px;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
.reviews {
|
||||
margin-top: 40px;
|
||||
margin-bottom: 40px;
|
||||
// .reviews {
|
||||
// margin-top: 40px;
|
||||
// margin-bottom: 40px;
|
||||
|
||||
.review {
|
||||
margin-bottom: 25px;
|
||||
// .review {
|
||||
// margin-bottom: 25px;
|
||||
|
||||
.title {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
// .title {
|
||||
// margin-bottom: 5px;
|
||||
// }
|
||||
|
||||
.stars {
|
||||
margin-bottom: 15px;
|
||||
display: inline-block;
|
||||
}
|
||||
// .stars {
|
||||
// margin-bottom: 15px;
|
||||
// display: inline-block;
|
||||
// }
|
||||
|
||||
.message {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
// .message {
|
||||
// margin-bottom: 10px;
|
||||
// }
|
||||
|
||||
.reviewer-details {
|
||||
color: #5E5E5E;
|
||||
}
|
||||
}
|
||||
// .reviewer-details {
|
||||
// color: #5E5E5E;
|
||||
// }
|
||||
// }
|
||||
|
||||
.view-all {
|
||||
margin-top:15px;
|
||||
color: $logo-color;
|
||||
margin-bottom:15px;
|
||||
}
|
||||
}
|
||||
}
|
||||
// .view-all {
|
||||
// margin-top:15px;
|
||||
// color: $logo-color;
|
||||
// margin-bottom:15px;
|
||||
// }
|
||||
// }
|
||||
// }
|
||||
|
||||
/* cart pages and elements css begins here */
|
||||
section.cart {
|
||||
|
|
|
|||
|
|
@ -5,9 +5,7 @@
|
|||
<div class="product-image-group">
|
||||
|
||||
<product-gallery></product-gallery>
|
||||
|
||||
@include ('shop::products.add-to')
|
||||
|
||||
</div>
|
||||
@push('scripts')
|
||||
|
||||
|
|
|
|||
|
|
@ -1378,57 +1378,12 @@ section.product-detail div.category-breadcrumbs {
|
|||
}
|
||||
|
||||
section.product-detail div.layouter {
|
||||
display: block;
|
||||
margin-top: 20px;
|
||||
margin-bottom: 20px;
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .mixed-group .single-image {
|
||||
padding: 2px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .mixed-group .single-image img {
|
||||
height: 280px;
|
||||
width: 280px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .mixed-group .details .product-name {
|
||||
margin-top: 20px;
|
||||
font-size: 24px;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .mixed-group .details .product-price {
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews {
|
||||
margin-top: 0px;
|
||||
width: 50%;
|
||||
margin-left: 20px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .title-inline {
|
||||
display: -webkit-inline-box;
|
||||
display: -ms-inline-flexbox;
|
||||
display: inline-flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: justify;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 20px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .title-inline button {
|
||||
float: right;
|
||||
border-radius: 0px !important;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .overall {
|
||||
section.product-detail div.layouter form {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
|
|
@ -1436,89 +1391,27 @@ section.product-detail div.layouter .rating-reviews .overall {
|
|||
-webkit-box-direction: normal;
|
||||
-ms-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: justify;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
height: 150px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .overall .left-side {
|
||||
margin-bottom: 20px;
|
||||
section.product-detail div.layouter form div.product-image-group {
|
||||
margin-right: 36px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .overall .left-side .number {
|
||||
font-size: 34px;
|
||||
section.product-detail div.layouter form div.product-image-group div {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: normal;
|
||||
-ms-flex-direction: row;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .overall .right-side {
|
||||
display: block;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .overall .right-side .rater {
|
||||
display: -webkit-inline-box;
|
||||
display: -ms-inline-flexbox;
|
||||
display: inline-flex;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .overall .right-side .rater .star {
|
||||
width: 50px;
|
||||
height: 20px;
|
||||
padding: 1px;
|
||||
margin-right: 8px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .overall .right-side .rater .line-bar {
|
||||
height: 4px;
|
||||
width: 158px;
|
||||
margin-right: 12px;
|
||||
background: #D8D8D8;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .overall .right-side .rater .line-bar .line-value {
|
||||
background-color: #0031F0;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .reviews {
|
||||
margin-top: 34px;
|
||||
margin-bottom: 90px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .reviews .review {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .reviews .review .title {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .reviews .review .stars {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .reviews .review .message {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .rating-reviews .reviews .view-all {
|
||||
margin-top: 15px;
|
||||
color: #0031f0;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group {
|
||||
width: 43%;
|
||||
float: left;
|
||||
min-height: 1px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .thumb-list {
|
||||
section.product-detail div.layouter form div.product-image-group div .thumb-list {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
|
|
@ -1528,28 +1421,32 @@ section.product-detail div.layouter div.product-image-group .thumb-list {
|
|||
flex-direction: column;
|
||||
margin-right: 4px;
|
||||
height: 480px;
|
||||
width: 120px;
|
||||
overflow: hidden;
|
||||
position: relative;
|
||||
float: left;
|
||||
-webkit-box-pack: start;
|
||||
-ms-flex-pack: start;
|
||||
justify-content: flex-start;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .thumb-list .thumb-frame {
|
||||
section.product-detail div.layouter form div.product-image-group div .thumb-list .thumb-frame {
|
||||
border: 2px solid transparent;
|
||||
background: #F2F2F2;
|
||||
width: 120px;
|
||||
max-width: 120px;
|
||||
width: auto;
|
||||
height: 120px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .thumb-list .thumb-frame.active {
|
||||
section.product-detail div.layouter form div.product-image-group div .thumb-list .thumb-frame.active {
|
||||
border-color: #979797;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .thumb-list .thumb-frame img {
|
||||
section.product-detail div.layouter form div.product-image-group div .thumb-list .thumb-frame img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .thumb-list .gallery-control {
|
||||
section.product-detail div.layouter form div.product-image-group div .thumb-list .gallery-control {
|
||||
width: 100%;
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
|
|
@ -1557,7 +1454,7 @@ section.product-detail div.layouter div.product-image-group .thumb-list .gallery
|
|||
z-index: 1;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .thumb-list .gallery-control .overlay {
|
||||
section.product-detail div.layouter form div.product-image-group div .thumb-list .gallery-control .overlay {
|
||||
opacity: 0.3;
|
||||
background: #000000;
|
||||
width: 100%;
|
||||
|
|
@ -1567,178 +1464,115 @@ section.product-detail div.layouter div.product-image-group .thumb-list .gallery
|
|||
z-index: -1;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .thumb-list .gallery-control .icon {
|
||||
section.product-detail div.layouter form div.product-image-group div .thumb-list .gallery-control .icon {
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .thumb-list .gallery-control.top {
|
||||
section.product-detail div.layouter form div.product-image-group div .thumb-list .gallery-control.top {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .thumb-list .gallery-control.bottom {
|
||||
section.product-detail div.layouter form div.product-image-group div .thumb-list .gallery-control.bottom {
|
||||
bottom: 0;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .product-hero-image {
|
||||
section.product-detail div.layouter form div.product-image-group div .product-hero-image {
|
||||
display: block;
|
||||
position: relative;
|
||||
background: #F2F2F2;
|
||||
width: 480px;
|
||||
max-height: 480px;
|
||||
float: left;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .product-hero-image .wishlist {
|
||||
section.product-detail div.layouter form div.product-image-group div .product-hero-image .wishlist {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 12px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter div.product-image-group .product-hero-image .share {
|
||||
section.product-detail div.layouter form div.product-image-group div .product-hero-image .share {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 45px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details {
|
||||
width: 57%;
|
||||
float: left;
|
||||
section.product-detail div.layouter form div.product-image-group .cart-fav-seg {
|
||||
display: block;
|
||||
float: right;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .product-price {
|
||||
section.product-detail div.layouter form .details {
|
||||
width: 50%;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter form .details .product-price {
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .product-ratings {
|
||||
section.product-detail div.layouter form .details .product-ratings {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .product-ratings .icon {
|
||||
section.product-detail div.layouter form .details .product-ratings .icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .product-ratings .total-reviews {
|
||||
section.product-detail div.layouter form .details .product-ratings .total-reviews {
|
||||
display: inline-block;
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .product-heading {
|
||||
section.product-detail div.layouter form .details .product-heading {
|
||||
font-size: 24px;
|
||||
color: #242424;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .product-price {
|
||||
section.product-detail div.layouter form .details .product-price {
|
||||
margin-bottom: 15px;
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .product-price .special-price {
|
||||
section.product-detail div.layouter form .details .product-price .special-price {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .stock-status {
|
||||
section.product-detail div.layouter form .details .stock-status {
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .description {
|
||||
section.product-detail div.layouter form .details .description {
|
||||
margin-bottom: 15px;
|
||||
padding-bottom: 15px;
|
||||
border-bottom: solid 1px rgba(162, 162, 162, 0.2);
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .full-specifications td {
|
||||
section.product-detail div.layouter form .details .full-specifications td {
|
||||
padding: 10px 0;
|
||||
color: #5E5E5E;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .full-specifications td:first-child {
|
||||
section.product-detail div.layouter form .details .full-specifications td:first-child {
|
||||
padding-right: 40px;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .accordian .accordian-header {
|
||||
section.product-detail div.layouter form .details .accordian .accordian-header {
|
||||
font-size: 16px;
|
||||
padding-left: 0;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .attributes {
|
||||
section.product-detail div.layouter form .details .attributes {
|
||||
display: block;
|
||||
width: 100%;
|
||||
border-bottom: solid 1px rgba(162, 162, 162, 0.2);
|
||||
}
|
||||
|
||||
section.product-detail div.layouter .details .full-description {
|
||||
section.product-detail div.layouter form .details .full-description {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.rating-reviews .rating-header {
|
||||
font-weight: 600;
|
||||
padding: 20px 0;
|
||||
}
|
||||
|
||||
.rating-reviews .stars .icon {
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
}
|
||||
|
||||
.rating-reviews .overall {
|
||||
display: -webkit-box;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-box-orient: horizontal;
|
||||
-webkit-box-direction: normal;
|
||||
-ms-flex-direction: row;
|
||||
flex-direction: row;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: justify;
|
||||
-ms-flex-pack: justify;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.rating-reviews .overall .review-info .number {
|
||||
font-size: 34px;
|
||||
}
|
||||
|
||||
.rating-reviews .overall .review-info .total-reviews {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.rating-reviews .reviews {
|
||||
margin-top: 40px;
|
||||
margin-bottom: 40px;
|
||||
}
|
||||
|
||||
.rating-reviews .reviews .review {
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
|
||||
.rating-reviews .reviews .review .title {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
||||
.rating-reviews .reviews .review .stars {
|
||||
margin-bottom: 15px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.rating-reviews .reviews .review .message {
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
|
||||
.rating-reviews .reviews .review .reviewer-details {
|
||||
color: #5E5E5E;
|
||||
}
|
||||
|
||||
.rating-reviews .reviews .view-all {
|
||||
margin-top: 15px;
|
||||
color: #0031f0;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
|
||||
/* cart pages and elements css begins here */
|
||||
section.cart {
|
||||
color: #242424;
|
||||
|
|
|
|||
Loading…
Reference in New Issue