updates & initial responsive
This commit is contained in:
parent
d15128f85e
commit
c28b2a0cbd
|
|
@ -724,7 +724,7 @@
|
|||
}
|
||||
|
||||
.btn-add-to-cart {
|
||||
padding: 8px !important;
|
||||
padding: 3px 14px !important;
|
||||
border-radius: 0px !important;
|
||||
color: #FFFFFF !important;
|
||||
border-color: #26A37C !important;
|
||||
|
|
@ -858,12 +858,13 @@
|
|||
top: 12px;
|
||||
height: 5px;
|
||||
position: relative;
|
||||
background-color: #F7F7F9;
|
||||
}
|
||||
|
||||
.customer-rating .rating-bar > div {
|
||||
width: 0px;
|
||||
height: 100%;
|
||||
background-color: black;
|
||||
background-color: #111111;
|
||||
}
|
||||
|
||||
.customer-rating .btn-write-review {
|
||||
|
|
@ -926,6 +927,11 @@
|
|||
vertical-align: super;
|
||||
}
|
||||
|
||||
.filters-container .limiter::after {
|
||||
margin-left: 10px;
|
||||
content: 'per page';
|
||||
}
|
||||
|
||||
.view-mode {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
|
@ -1011,7 +1017,6 @@
|
|||
}
|
||||
|
||||
.product-card-new {
|
||||
width: 22.5rem;
|
||||
border: none !important;
|
||||
margin: 0 5px 10px 10px;
|
||||
}
|
||||
|
|
@ -1039,6 +1044,10 @@
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.product-card-new .product-rating .material-icons {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.product-card-new .card-body > div:not(:last-child) {
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
|
|
@ -1664,11 +1673,7 @@
|
|||
}
|
||||
|
||||
.wishlist-icon i {
|
||||
color: #F05153;
|
||||
}
|
||||
|
||||
.wishlist-icon i:hover::before {
|
||||
content: "\E93D";
|
||||
color: #111111;
|
||||
}
|
||||
|
||||
.checkout-process {
|
||||
|
|
@ -1684,7 +1689,7 @@
|
|||
margin-bottom: 30px;
|
||||
}
|
||||
|
||||
.checkout-process .scrollable {
|
||||
.checkout-process .scrollable, .checkout-process .layered-filter-wrapper {
|
||||
padding-top: 25px;
|
||||
}
|
||||
|
||||
|
|
@ -1882,6 +1887,10 @@
|
|||
margin-left: 0px !important;
|
||||
}
|
||||
|
||||
.product-price span:nth-child(1) {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.product-price .price-label {
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
|
@ -1917,8 +1926,16 @@
|
|||
min-height: 65vh;
|
||||
}
|
||||
|
||||
.search-container {
|
||||
padding: 30px 20px;
|
||||
}
|
||||
|
||||
.search-container .lg-card-container.list-card {
|
||||
margin: 0 15px;
|
||||
}
|
||||
|
||||
.search-container :first-child {
|
||||
margin-left: 0px;
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.method-sticker {
|
||||
|
|
@ -2018,7 +2035,6 @@
|
|||
#sidebar-level-0 {
|
||||
display: none;
|
||||
z-index: 100000;
|
||||
border-top: 1px solid #CCCCCC;
|
||||
}
|
||||
|
||||
.grouped-product-container .grouped-product-list {
|
||||
|
|
@ -2230,6 +2246,7 @@
|
|||
}
|
||||
|
||||
.category-container {
|
||||
min-height: 670px;
|
||||
margin-left: 15px;
|
||||
padding: 40px 15px !important;
|
||||
}
|
||||
|
|
@ -2324,6 +2341,10 @@
|
|||
background-color: #26A37C !important;
|
||||
}
|
||||
|
||||
.slides-container .VueCarousel .VueCarousel-inner {
|
||||
padding-top: 0;
|
||||
}
|
||||
|
||||
.filter-attributes-item {
|
||||
margin-bottom: 10px;
|
||||
border-bottom: 1px solid #CCCCCC;
|
||||
|
|
@ -2357,9 +2378,19 @@
|
|||
}
|
||||
|
||||
.layered-filter-wrapper {
|
||||
max-height: 670px;
|
||||
margin-bottom: 42px;
|
||||
padding: 42px 10px 0 10px;
|
||||
}
|
||||
|
||||
.layered-filter-wrapper .recently-viewed {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.layered-filter-wrapper .recently-viewed h2 {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.selective-div {
|
||||
-webkit-appearance: none;
|
||||
}
|
||||
|
|
@ -2576,6 +2607,13 @@ header #search-form > *:focus {
|
|||
|
||||
/* product policy section */
|
||||
/* category with custom option */
|
||||
.category-with-custom-options img {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.category-with-custom-options .row:nth-child(1) {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
|
|
@ -2591,14 +2629,10 @@ header #search-form > *:focus {
|
|||
|
||||
.category-with-custom-options .row:nth-child(1) > div:first-child {
|
||||
max-height: 345px;
|
||||
background-size: cover;
|
||||
background-image: url("../images/girl.png");
|
||||
}
|
||||
|
||||
.category-with-custom-options .row:nth-child(1) > div:nth-child(3) {
|
||||
max-height: 345px;
|
||||
background-size: cover;
|
||||
background-image: url("../images/man.png");
|
||||
}
|
||||
|
||||
.category-with-custom-options .row:nth-child(2) .category-image {
|
||||
|
|
@ -2612,26 +2646,24 @@ header #search-form > *:focus {
|
|||
|
||||
.category-with-custom-options .row:nth-child(2) > div:nth-child(2) {
|
||||
max-height: 345px;
|
||||
background-size: cover;
|
||||
background-image: url("../images/man.png");
|
||||
}
|
||||
|
||||
.category-with-custom-options .row:nth-child(2) > div:nth-child(4) {
|
||||
max-height: 345px;
|
||||
background-size: cover;
|
||||
background-image: url("../images/girl.png");
|
||||
}
|
||||
|
||||
.category-with-custom-options .categories-collection {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 330px;
|
||||
display: table;
|
||||
min-height: 310px;
|
||||
max-height: 345px;
|
||||
padding-left: 36px;
|
||||
background: #2B2B2B;
|
||||
}
|
||||
|
||||
.category-with-custom-options .categories-collection h2 {
|
||||
color: white;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.category-with-custom-options .categories-collection li {
|
||||
|
|
@ -2639,10 +2671,9 @@ header #search-form > *:focus {
|
|||
}
|
||||
|
||||
.category-with-custom-options .categories-collection .category-text-content {
|
||||
top: 50%;
|
||||
position: relative;
|
||||
-webkit-transform: translateY(-50%);
|
||||
transform: translateY(-50%);
|
||||
height: 100%;
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
/* category with custom option */
|
||||
|
|
@ -2772,23 +2803,23 @@ header #search-form > *:focus {
|
|||
|
||||
/* Customer Reviews */
|
||||
/* sidebar */
|
||||
.categories-sidebar-container {
|
||||
.general-container {
|
||||
margin: 0;
|
||||
margin-bottom: 60px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.categories-sidebar-container > .row.disabled {
|
||||
.general-container > .row.disabled {
|
||||
cursor: not-allowed;
|
||||
}
|
||||
|
||||
.categories-sidebar-container .main-category {
|
||||
.general-container .main-category {
|
||||
padding: 8px 15px;
|
||||
border-top: 1px solid #CCCCCC;
|
||||
border-bottom: 1px solid #CCCCCC;
|
||||
}
|
||||
|
||||
.categories-sidebar-container .content-list {
|
||||
.general-container .content-list {
|
||||
margin: 0;
|
||||
width: 100%;
|
||||
height: 42px;
|
||||
|
|
@ -2799,7 +2830,7 @@ header #search-form > *:focus {
|
|||
display: inline-block;
|
||||
}
|
||||
|
||||
.categories-sidebar-container .content-list ul {
|
||||
.general-container .content-list ul {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: -webkit-inline-box;
|
||||
|
|
@ -2808,7 +2839,7 @@ header #search-form > *:focus {
|
|||
background-color: #4D7EA8;
|
||||
}
|
||||
|
||||
.categories-sidebar-container .content-list ul li a {
|
||||
.general-container .content-list ul li a {
|
||||
display: block;
|
||||
cursor: pointer;
|
||||
font-size: 16px;
|
||||
|
|
@ -2820,7 +2851,7 @@ header #search-form > *:focus {
|
|||
text-decoration: none;
|
||||
}
|
||||
|
||||
.categories-sidebar-container .content-list ul li:hover {
|
||||
.general-container .content-list ul li:hover {
|
||||
background-color: #42719a;
|
||||
}
|
||||
|
||||
|
|
@ -3186,7 +3217,7 @@ body::after {
|
|||
font-size: 13px !important;
|
||||
}
|
||||
|
||||
.fs14, .categories-sidebar-container {
|
||||
.fs14, .general-container {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
|
|
@ -3578,7 +3609,7 @@ body::after {
|
|||
}
|
||||
|
||||
.lg-card-container #quick-view-btn-container :hover {
|
||||
color: white !important;
|
||||
color: #FFFFFF !important;
|
||||
}
|
||||
|
||||
.lg-card-container .background-image-group {
|
||||
|
|
@ -3635,11 +3666,11 @@ body::after {
|
|||
}
|
||||
|
||||
.lg-card-container.list-card .product-rating span {
|
||||
vertical-align: middle;
|
||||
vertical-align: top;
|
||||
}
|
||||
|
||||
.lg-card-container.list-card .product-information {
|
||||
height: 150px;
|
||||
height: 200px;
|
||||
display: table;
|
||||
}
|
||||
|
||||
|
|
@ -3653,7 +3684,7 @@ body::after {
|
|||
}
|
||||
|
||||
.lg-card-container.list-card .wishlist-icon {
|
||||
height: 34px;
|
||||
height: 40px;
|
||||
display: table;
|
||||
}
|
||||
|
||||
|
|
@ -3662,6 +3693,10 @@ body::after {
|
|||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.lg-card-container.list-card .add-to-cart-btn {
|
||||
max-width: 140px;
|
||||
}
|
||||
|
||||
.lg-card-container.grid-card {
|
||||
padding: 15px;
|
||||
}
|
||||
|
|
@ -3693,8 +3728,8 @@ body::after {
|
|||
.product-card-new:hover,
|
||||
.lg-card-container:hover,
|
||||
.general-container:hover {
|
||||
-webkit-box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.14);
|
||||
box-shadow: 0 6px 14px 0 rgba(0, 0, 0, 0.14);
|
||||
-webkit-box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16), 0 3px 6px rgba(0, 0, 0, 0.23);
|
||||
}
|
||||
|
||||
.lg-card-container:hover .quick-view-btn-container {
|
||||
|
|
@ -3726,6 +3761,7 @@ body::after {
|
|||
|
||||
.small-card-container .product-image {
|
||||
height: 100%;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.small-card-container .card-body {
|
||||
|
|
@ -3853,8 +3889,12 @@ a.default {
|
|||
cursor: pointer;
|
||||
}
|
||||
|
||||
.VueCarousel .VueCarousel-inner {
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.VueCarousel .VueCarousel-slide:nth-of-type(1) .product-card-new {
|
||||
margin-left: 0px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.navigation-hide .VueCarousel-navigation {
|
||||
|
|
@ -3865,14 +3905,14 @@ a.default {
|
|||
display: none;
|
||||
}
|
||||
|
||||
.scrollable {
|
||||
.scrollable, .layered-filter-wrapper {
|
||||
max-height: 100vh;
|
||||
overflow-y: scroll;
|
||||
scrollbar-width: none;
|
||||
-ms-overflow-style: none;
|
||||
}
|
||||
|
||||
.scrollable::-webkit-scrollbar {
|
||||
.scrollable::-webkit-scrollbar, .layered-filter-wrapper::-webkit-scrollbar {
|
||||
width: 0 !important;
|
||||
}
|
||||
|
||||
|
|
@ -3953,6 +3993,10 @@ button[disabled] {
|
|||
max-height: 350px;
|
||||
}
|
||||
|
||||
.border-normal {
|
||||
border: 1px solid #DCDCDC;
|
||||
}
|
||||
|
||||
.product-detail {
|
||||
padding-top: 20px;
|
||||
margin-bottom: 60px;
|
||||
|
|
@ -4026,14 +4070,16 @@ button[disabled] {
|
|||
|
||||
.product-detail .right .add-to-cart-btn {
|
||||
padding: 0px;
|
||||
max-width: 130px;
|
||||
}
|
||||
|
||||
.product-detail .right .add-to-cart-btn button {
|
||||
padding: 9px 15px;
|
||||
text-transform: uppercase;
|
||||
padding: 9px 15px !important;
|
||||
}
|
||||
|
||||
.product-detail .right .add-to-cart-btn button span {
|
||||
top: 0;
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
|
|
@ -4087,6 +4133,7 @@ button[disabled] {
|
|||
.product-detail .wishlist-icon {
|
||||
height: 46px;
|
||||
display: table;
|
||||
padding-left: 10px;
|
||||
}
|
||||
|
||||
.product-detail .wishlist-icon i {
|
||||
|
|
@ -4104,6 +4151,10 @@ button[disabled] {
|
|||
max-height: 300px;
|
||||
}
|
||||
|
||||
.velocity-small-screen {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1100px) {
|
||||
.footer .footer-content .newsletter-subscription .newsletter-wrapper .social-icons {
|
||||
width: 100%;
|
||||
|
|
@ -4120,6 +4171,163 @@ button[disabled] {
|
|||
}
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 576px) {
|
||||
.velocity-divide-page {
|
||||
position: static;
|
||||
}
|
||||
.velocity-divide-page .left {
|
||||
position: static;
|
||||
}
|
||||
.velocity-divide-page .right {
|
||||
padding-left: 0;
|
||||
}
|
||||
.general-container .vc-header > div {
|
||||
display: none;
|
||||
}
|
||||
.general-container .vc-header > div.velocity-small-screen {
|
||||
display: block;
|
||||
}
|
||||
.general-container .vc-header > div.velocity-small-screen img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-height: 50px;
|
||||
}
|
||||
.general-container .vc-header .right-vc-header {
|
||||
height: 50px;
|
||||
display: table;
|
||||
}
|
||||
.general-container .vc-header .right-vc-header * {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
#top {
|
||||
display: none;
|
||||
}
|
||||
#top + header {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format("woff2");
|
||||
}
|
||||
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons Outlined';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialiconsoutlined/v14/gok-H7zzDkdnRel8-DQ6KAXJ69wP1tGnf4ZGhUce.woff2) format("woff2");
|
||||
}
|
||||
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons Round';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialiconsround/v14/LDItaoyNOAY6Uewc665JcIzCKsKc_M9flwmP.woff2) format("woff2");
|
||||
}
|
||||
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons Sharp';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialiconssharp/v15/oPWQ_lt5nv4pWNJpghLP75WiFR4kLh3kvmvR.woff2) format("woff2");
|
||||
}
|
||||
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons Two Tone';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialiconstwotone/v13/hESh6WRmNCxEqUmNyh3JDeGxjVVyMg4tHGctNCu0.woff2) format("woff2");
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.material-icons-outlined {
|
||||
font-family: 'Material Icons Outlined';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.material-icons-round {
|
||||
font-family: 'Material Icons Round';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.material-icons-sharp {
|
||||
font-family: 'Material Icons Sharp';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.material-icons-two-tone {
|
||||
font-family: 'Material Icons Two Tone';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
/*!
|
||||
* Bootstrap v3.4.1 (https://getbootstrap.com/)
|
||||
* Copyright 2011-2019 Twitter, Inc.
|
||||
|
|
@ -12076,38 +12284,6 @@ button.close {
|
|||
}
|
||||
}
|
||||
|
||||
@font-face {
|
||||
font-family: "Material Icons";
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url("../material-icons/iconfont/MaterialIcons-Regular.eot");
|
||||
/* For IE6-8 */
|
||||
src: local("Material Icons"), local("MaterialIcons-Regular"), url("../material-icons/iconfont/MaterialIcons-Regular.woff2") format("woff2"), url("../material-icons/iconfont/MaterialIcons-Regular.woff") format("woff"), url("../material-icons/iconfont/MaterialIcons-Regular.ttf") format("truetype");
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: "Material Icons";
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
text-transform: none;
|
||||
letter-spacing: normal;
|
||||
word-wrap: normal;
|
||||
white-space: nowrap;
|
||||
direction: ltr;
|
||||
/* Support for all WebKit browsers. */
|
||||
-webkit-font-smoothing: antialiased;
|
||||
/* Support for Safari and Chrome. */
|
||||
text-rendering: optimizeLegibility;
|
||||
/* Support for Firefox. */
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
/* Support for IE. */
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
font-feature-settings: 'liga';
|
||||
}
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
|
@ -12463,7 +12639,7 @@ header #search-form .btn-group .selectdiv, header #search-form .quantity .select
|
|||
}
|
||||
|
||||
header #search-form .btn-group .selectdiv:before, header #search-form .quantity .selectdiv:before {
|
||||
top: 13px;
|
||||
top: 10px;
|
||||
left: 108px;
|
||||
z-index: 10;
|
||||
font-size: 16px;
|
||||
|
|
@ -12536,7 +12712,7 @@ header .mini-cart-container #mini-cart .mini-cart-content {
|
|||
position: relative;
|
||||
width: 75px;
|
||||
text-align: right;
|
||||
font-family: "SourceSansPro-Semibold";
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: rgba(0, 0, 0, 0.83);
|
||||
letter-spacing: 0;
|
||||
|
|
@ -12588,7 +12764,7 @@ header .dropdown-menu-large .dropdown-content .item .item-image .thumbnail {
|
|||
}
|
||||
|
||||
header .dropdown-menu-large .dropdown-content .item .item-name {
|
||||
font-family: "SourceSansPro-Semibold";
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
color: rgba(0, 0, 0, 0.83);
|
||||
letter-spacing: 0;
|
||||
|
|
@ -12612,7 +12788,6 @@ header .dropdown-menu-large .dropdown-content .item .item-details .item-qty-pric
|
|||
}
|
||||
|
||||
header .dropdown-menu-large .dropdown-content .item .item-details .item-qty-price .item-qty {
|
||||
font-family: "SourceSansPro-Regular";
|
||||
font-size: 16px;
|
||||
color: rgba(0, 0, 0, 0.83);
|
||||
letter-spacing: 0;
|
||||
|
|
@ -12620,7 +12795,7 @@ header .dropdown-menu-large .dropdown-content .item .item-details .item-qty-pric
|
|||
}
|
||||
|
||||
header .dropdown-menu-large .dropdown-content .item .item-details .item-qty-price .item-price {
|
||||
font-family: "SourceSansPro-Semibold";
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: rgba(0, 0, 0, 0.83);
|
||||
letter-spacing: 0;
|
||||
|
|
@ -12633,14 +12808,14 @@ header .dropdown-menu-large .dropdown-header {
|
|||
}
|
||||
|
||||
header .dropdown-menu-large .dropdown-header .sub-total-text {
|
||||
font-family: "SourceSansPro-Semibold";
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: rgba(0, 0, 0, 0.83);
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
header .dropdown-menu-large .dropdown-header .cart-sub-total {
|
||||
font-family: "SourceSansPro-Bold";
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
color: rgba(0, 0, 0, 0.83);
|
||||
letter-spacing: 0;
|
||||
|
|
@ -12650,7 +12825,7 @@ header .dropdown-menu-large .dropdown-header .cart-sub-total {
|
|||
header .dropdown-menu-large .dropdown-footer {
|
||||
padding: 10px 10px 0px 10px;
|
||||
border-top: 1px solid #CCCCCC;
|
||||
font-family: "SourceSansPro-Bold";
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
color: rgba(0, 0, 0, 0.83);
|
||||
letter-spacing: 0;
|
||||
|
|
@ -12725,7 +12900,7 @@ header .dropdown-menu-large .dropdown-footer .checkout-link {
|
|||
#nav-menu .navbar .category-dropdown li.category-list a {
|
||||
padding: 10px 0px;
|
||||
position: relative;
|
||||
font-family: "SourceSansPro-Semibold";
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
color: rgba(0, 0, 0, 0.83);
|
||||
letter-spacing: 0;
|
||||
|
|
|
|||
|
|
@ -1156,6 +1156,11 @@ $(document).ready(function () {
|
|||
} else if (type == "mouseout") {
|
||||
this.hide(subCategories1);
|
||||
}
|
||||
} else {
|
||||
if (type == "mouseout") {
|
||||
var _sidebar = $('#' + id);
|
||||
_sidebar.hide();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -36839,6 +36844,20 @@ Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
|
|||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
//
|
||||
|
||||
/* harmony default export */ __webpack_exports__["default"] = ({
|
||||
props: ['heading', 'headerContent', 'isEnabled']
|
||||
|
|
@ -36854,8 +36873,27 @@ var render = function() {
|
|||
var _c = _vm._self._c || _h
|
||||
return _c(
|
||||
"div",
|
||||
{ staticClass: "row velocity-divide-page remove-padding-margin" },
|
||||
{ staticClass: "row velocity-divide-page remove-padding-margin vc-header" },
|
||||
[
|
||||
_c("div", { staticClass: "velocity-small-screen container" }, [
|
||||
_c("div", { staticClass: "row" }, [
|
||||
_c("div", { staticClass: "col-8" }, [
|
||||
_c(
|
||||
"div",
|
||||
{ staticClass: "row" },
|
||||
[
|
||||
_c("logo-component", {
|
||||
attrs: { "add-class": "col-8 offset-3" }
|
||||
})
|
||||
],
|
||||
1
|
||||
)
|
||||
]),
|
||||
_vm._v(" "),
|
||||
_vm._m(0)
|
||||
])
|
||||
]),
|
||||
_vm._v(" "),
|
||||
_c(
|
||||
"div",
|
||||
{
|
||||
|
|
@ -36913,7 +36951,20 @@ var render = function() {
|
|||
]
|
||||
)
|
||||
}
|
||||
var staticRenderFns = []
|
||||
var staticRenderFns = [
|
||||
function() {
|
||||
var _vm = this
|
||||
var _h = _vm.$createElement
|
||||
var _c = _vm._self._c || _h
|
||||
return _c("div", { staticClass: "col-4 right-vc-header" }, [
|
||||
_c("i", { staticClass: "fs16 fw6 rango-search" }),
|
||||
_vm._v(" "),
|
||||
_c("i", { staticClass: "material-icons text-down-3" }, [
|
||||
_vm._v("shopping_cart")
|
||||
])
|
||||
])
|
||||
}
|
||||
]
|
||||
render._withStripped = true
|
||||
module.exports = { render: render, staticRenderFns: staticRenderFns }
|
||||
if (false) {
|
||||
|
|
|
|||
|
|
@ -1,5 +1,19 @@
|
|||
<template>
|
||||
<div class="row velocity-divide-page remove-padding-margin">
|
||||
<div class="row velocity-divide-page remove-padding-margin vc-header">
|
||||
<div class="velocity-small-screen container">
|
||||
<div class="row">
|
||||
<div class="col-8">
|
||||
<div class="row">
|
||||
<logo-component add-class="col-8 offset-3"></logo-component>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-4 right-vc-header">
|
||||
<i class="fs16 fw6 rango-search"></i>
|
||||
<i class="material-icons text-down-3">shopping_cart</i>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div
|
||||
@mouseout="toggleSidebar('0', $event, 'mouseout')"
|
||||
@mouseover="toggleSidebar('0', $event, 'mouseover')"
|
||||
|
|
|
|||
|
|
@ -75,6 +75,11 @@ $(document).ready(function () {
|
|||
} else if (type == "mouseout") {
|
||||
this.hide(subCategories1);
|
||||
}
|
||||
} else {
|
||||
if (type == "mouseout") {
|
||||
let sidebar = $(`#${id}`);
|
||||
sidebar.hide();
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
@import url('https://fonts.googleapis.com/css?family=Source+Sans+Pro&display=swap');
|
||||
//velocity variables
|
||||
$white-color: #FFFFFF;
|
||||
$black-color: #111111;
|
||||
$font-color: rgba(0,0,0,0.83);
|
||||
$button-primary-bg: #21A179;
|
||||
$border-primary: #269c77;
|
||||
|
|
@ -24,8 +25,7 @@ $light-grey-clr: rgb(158, 158, 158);
|
|||
$light-background: #F7F7F9;
|
||||
$sidebar-width: 230px;
|
||||
$box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
|
||||
$material-icons-font-path: "../material-icons/iconfont/" !default;
|
||||
$border-normal: 1px solid $border-dark;
|
||||
|
||||
$font-family-pro: 'Source Sans Pro', sans-serif;
|
||||
$font-family-regular: 'SourceSansPro-Regular';
|
||||
$font-family-semibold: 'SourceSansPro-Semibold';
|
||||
$font-family-bold: 'SourceSansPro-Bold';
|
||||
|
|
|
|||
|
|
@ -10,10 +10,9 @@
|
|||
@import "components/product-view";
|
||||
@import "components/media";
|
||||
|
||||
@import "static/material-icons";
|
||||
@import "node_modules/bootstrap-sass/assets/stylesheets/bootstrap";
|
||||
|
||||
$material-icons-font-path: "../material-icons/iconfont/" !default;
|
||||
@import '../../../../publishable/assets/material-icons/iconfont/material-icons.scss';
|
||||
// @import '../../../../publishable/assets/material-icons/iconfont/material-icons.scss';
|
||||
|
||||
* {
|
||||
margin: 0;
|
||||
|
|
@ -363,7 +362,7 @@ header {
|
|||
}
|
||||
|
||||
.selectdiv:before {
|
||||
top: 13px;
|
||||
top: 10px;
|
||||
left: 108px;
|
||||
z-index: 10;
|
||||
font-size: 16px;
|
||||
|
|
@ -439,7 +438,7 @@ header {
|
|||
position: relative;
|
||||
width: 75px;
|
||||
text-align: right;
|
||||
font-family: $font-family-semibold;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: $font-color;
|
||||
letter-spacing: 0;
|
||||
|
|
@ -488,7 +487,7 @@ header {
|
|||
}
|
||||
|
||||
.item-name {
|
||||
font-family: $font-family-semibold;
|
||||
font-weight: 600;
|
||||
font-size: 18px;
|
||||
color: $font-color;
|
||||
letter-spacing: 0;
|
||||
|
|
@ -510,14 +509,13 @@ header {
|
|||
display: inline-block;
|
||||
|
||||
.item-qty {
|
||||
font-family: $font-family-regular;
|
||||
font-size: 16px;
|
||||
color: $font-color;
|
||||
letter-spacing: 0;
|
||||
text-align: left;
|
||||
}
|
||||
.item-price {
|
||||
font-family: $font-family-semibold;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: $font-color;
|
||||
letter-spacing: 0;
|
||||
|
|
@ -532,14 +530,14 @@ header {
|
|||
border-top: 1px solid $border-common;
|
||||
|
||||
.sub-total-text {
|
||||
font-family: $font-family-semibold;
|
||||
font-weight: 600;
|
||||
font-size: 16px;
|
||||
color: $font-color;
|
||||
letter-spacing: 0;
|
||||
}
|
||||
|
||||
.cart-sub-total {
|
||||
font-family: $font-family-bold;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
color: $font-color;
|
||||
letter-spacing: 0;
|
||||
|
|
@ -549,7 +547,7 @@ header {
|
|||
.dropdown-footer {
|
||||
padding: 10px 10px 0px 10px;
|
||||
border-top: 1px solid $border-common;
|
||||
font-family: $font-family-bold;
|
||||
font-weight: 700;
|
||||
font-size: 16px;
|
||||
color: $font-color;
|
||||
letter-spacing: 0;
|
||||
|
|
@ -621,7 +619,7 @@ header {
|
|||
a {
|
||||
padding: 10px 0px;
|
||||
position: relative;
|
||||
font-family: $font-family-semibold;
|
||||
font-weight: 600;
|
||||
font-size: 14px;
|
||||
color: rgba(0,0,0,0.83);
|
||||
letter-spacing: 0;
|
||||
|
|
|
|||
|
|
@ -30,7 +30,7 @@
|
|||
}
|
||||
|
||||
.btn-add-to-cart {
|
||||
padding: 8px !important;
|
||||
padding: 3px 14px !important;
|
||||
border-radius: 0px !important;
|
||||
color: $white-color !important;
|
||||
border-color: $theme-color !important;
|
||||
|
|
|
|||
|
|
@ -50,11 +50,12 @@
|
|||
top: 12px;
|
||||
height: 5px;
|
||||
position: relative;
|
||||
background-color: $light-background;
|
||||
|
||||
> div {
|
||||
width: 0px;
|
||||
height: 100%;
|
||||
background-color: black;
|
||||
background-color: $black-color;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -116,6 +117,11 @@
|
|||
> div:not(:first-child) {
|
||||
vertical-align: super;
|
||||
}
|
||||
|
||||
.limiter::after {
|
||||
margin-left: 10px;
|
||||
content: 'per page';
|
||||
}
|
||||
}
|
||||
|
||||
.view-mode {
|
||||
|
|
@ -204,7 +210,7 @@
|
|||
}
|
||||
|
||||
.product-card-new {
|
||||
width: 22.5rem;
|
||||
// width: 19rem;
|
||||
border: none !important;
|
||||
margin: 0 5px 10px 10px;
|
||||
|
||||
|
|
@ -233,6 +239,10 @@
|
|||
font-size: 14px;
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
||||
.card-body {
|
||||
|
|
@ -941,11 +951,11 @@
|
|||
vertical-align: middle;
|
||||
|
||||
i {
|
||||
color: $button-danger;
|
||||
color: $black-color;
|
||||
}
|
||||
|
||||
i:hover::before {
|
||||
content: "\E93D";
|
||||
// content: "\E93D";
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1160,6 +1170,10 @@
|
|||
}
|
||||
|
||||
.product-price {
|
||||
span:nth-child(1) {
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.price-label {
|
||||
margin-right: 6px;
|
||||
}
|
||||
|
|
@ -1197,8 +1211,16 @@
|
|||
}
|
||||
|
||||
.search-container {
|
||||
padding: 30px 20px;
|
||||
|
||||
.lg-card-container {
|
||||
&.list-card {
|
||||
margin: 0 15px;
|
||||
}
|
||||
}
|
||||
|
||||
:first-child {
|
||||
margin-left: 0px;
|
||||
margin-top: 0px;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -1311,7 +1333,6 @@
|
|||
#sidebar-level-0 {
|
||||
display: none;
|
||||
z-index: 100000;
|
||||
border-top: 1px solid $border-common;
|
||||
}
|
||||
|
||||
.grouped-product-container {
|
||||
|
|
@ -1547,6 +1568,7 @@
|
|||
}
|
||||
|
||||
.category-container {
|
||||
min-height: 670px;
|
||||
margin-left: 15px;
|
||||
padding: 40px 15px !important;
|
||||
|
||||
|
|
@ -1642,6 +1664,11 @@
|
|||
.VueCarousel-dot--active {
|
||||
background-color: $theme-color !important;
|
||||
}
|
||||
.VueCarousel {
|
||||
.VueCarousel-inner {
|
||||
padding-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.filter-attributes-item {
|
||||
|
|
@ -1679,7 +1706,19 @@
|
|||
}
|
||||
|
||||
.layered-filter-wrapper {
|
||||
@extend .scrollable;
|
||||
|
||||
max-height: 670px;
|
||||
margin-bottom: 42px;
|
||||
padding: 42px 10px 0 10px;
|
||||
|
||||
.recently-viewed {
|
||||
margin-top: 20px;
|
||||
|
||||
h2 {
|
||||
font-size: 18px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.selective-div {
|
||||
|
|
|
|||
|
|
@ -210,6 +210,13 @@ header #search-form > *:focus {
|
|||
|
||||
.category-with-custom-options {
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
max-width: 100%;
|
||||
height: 100%;
|
||||
max-height: 100%;
|
||||
}
|
||||
|
||||
.row:nth-child(1) {
|
||||
margin-bottom: 0px;
|
||||
|
||||
|
|
@ -223,14 +230,10 @@ header #search-form > *:focus {
|
|||
|
||||
&:first-child() {
|
||||
max-height: 345px;
|
||||
background-size: cover;
|
||||
background-image: url('../images/girl.png');
|
||||
}
|
||||
|
||||
&:nth-child(3) {
|
||||
max-height: 345px;
|
||||
background-size: cover;
|
||||
background-image: url('../images/man.png');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -246,27 +249,25 @@ header #search-form > *:focus {
|
|||
|
||||
&:nth-child(2) {
|
||||
max-height: 345px;
|
||||
background-size: cover;
|
||||
background-image: url('../images/man.png');
|
||||
}
|
||||
|
||||
&:nth-child(4) {
|
||||
max-height: 345px;
|
||||
background-size: cover;
|
||||
background-image: url('../images/girl.png');
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.categories-collection {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
min-height: 330px;
|
||||
display: table;
|
||||
min-height: 310px;
|
||||
max-height: 345px;
|
||||
padding-left: 36px;
|
||||
background:#2B2B2B;
|
||||
|
||||
h2 {
|
||||
color: white;
|
||||
color: $white-color;
|
||||
}
|
||||
|
||||
li {
|
||||
|
|
@ -274,9 +275,9 @@ header #search-form > *:focus {
|
|||
}
|
||||
|
||||
.category-text-content {
|
||||
top: 50%;
|
||||
position: relative;
|
||||
transform: translateY(-50%);
|
||||
height: 100%;
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -425,7 +426,7 @@ header #search-form > *:focus {
|
|||
/* Customer Reviews */
|
||||
|
||||
/* sidebar */
|
||||
.categories-sidebar-container {
|
||||
.general-container {
|
||||
@extend .fs14;
|
||||
|
||||
margin: 0;
|
||||
|
|
|
|||
|
|
@ -1,3 +1,7 @@
|
|||
.velocity-small-screen {
|
||||
display: none;
|
||||
}
|
||||
|
||||
@media only screen and (max-width: 1100px) {
|
||||
.footer {
|
||||
.footer-content {
|
||||
|
|
@ -40,4 +44,57 @@
|
|||
// body {
|
||||
// display: block;
|
||||
// }
|
||||
|
||||
.velocity-divide-page {
|
||||
position: static;
|
||||
|
||||
.left {
|
||||
position: static;
|
||||
}
|
||||
|
||||
.right {
|
||||
padding-left: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.general-container {
|
||||
.vc-header {
|
||||
> div {
|
||||
display: none;
|
||||
}
|
||||
|
||||
> div.velocity-small-screen {
|
||||
display: block;
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
max-height: 50px;
|
||||
}
|
||||
}
|
||||
|
||||
.right-vc-header {
|
||||
height: 50px;
|
||||
display: table;
|
||||
|
||||
* {
|
||||
display: table-cell;
|
||||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
#top {
|
||||
display: none;
|
||||
|
||||
+ header {
|
||||
display: none;
|
||||
}
|
||||
|
||||
// + .categories-sidebar-container {
|
||||
// display: none;
|
||||
// }
|
||||
}
|
||||
}
|
||||
|
|
@ -139,12 +139,14 @@
|
|||
|
||||
.add-to-cart-btn {
|
||||
padding: 0px;
|
||||
max-width: 130px;
|
||||
|
||||
button {
|
||||
padding: 9px 15px;
|
||||
text-transform: uppercase;
|
||||
padding: 9px 15px !important;
|
||||
|
||||
span {
|
||||
top: 0;
|
||||
font-size: 16px;
|
||||
}
|
||||
}
|
||||
|
|
@ -203,6 +205,7 @@
|
|||
.wishlist-icon {
|
||||
height: 46px;
|
||||
display: table;
|
||||
padding-left: 10px;
|
||||
|
||||
i {
|
||||
display: table-cell;
|
||||
|
|
|
|||
|
|
@ -355,7 +355,7 @@
|
|||
|
||||
#quick-view-btn-container {
|
||||
:hover {
|
||||
color: white !important;
|
||||
color: $white-color !important;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -420,12 +420,12 @@
|
|||
}
|
||||
|
||||
span {
|
||||
vertical-align: middle;
|
||||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
|
||||
.product-information {
|
||||
height: 150px;
|
||||
height: 200px;
|
||||
display: table;
|
||||
|
||||
> div {
|
||||
|
|
@ -441,7 +441,7 @@
|
|||
}
|
||||
|
||||
.wishlist-icon {
|
||||
height: 34px;
|
||||
height: 40px;
|
||||
display: table;
|
||||
|
||||
i {
|
||||
|
|
@ -449,6 +449,10 @@
|
|||
vertical-align: middle;
|
||||
}
|
||||
}
|
||||
|
||||
.add-to-cart-btn {
|
||||
max-width: 140px;
|
||||
}
|
||||
}
|
||||
|
||||
&.grid-card {
|
||||
|
|
@ -484,7 +488,7 @@
|
|||
.product-card-new:hover,
|
||||
.lg-card-container:hover,
|
||||
.general-container:hover {
|
||||
box-shadow: 0 6px 14px 0 rgba(0,0,0,0.14);
|
||||
box-shadow: 0 3px 6px rgba(0,0,0,0.16), 0 3px 6px rgba(0,0,0,0.23);
|
||||
}
|
||||
|
||||
.lg-card-container:hover {
|
||||
|
|
@ -519,6 +523,7 @@
|
|||
@extend .bg-image;
|
||||
|
||||
height: 100%;
|
||||
background-position: center;
|
||||
}
|
||||
|
||||
.card-body {
|
||||
|
|
@ -648,9 +653,13 @@ a {
|
|||
width: 100%;
|
||||
cursor: pointer;
|
||||
|
||||
.VueCarousel-inner {
|
||||
padding-top: 5px;
|
||||
}
|
||||
|
||||
.VueCarousel-slide:nth-of-type(1) {
|
||||
.product-card-new {
|
||||
margin-left: 0px;
|
||||
margin-left: 5px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -749,4 +758,8 @@ button[disabled] {
|
|||
|
||||
.max-height-350 {
|
||||
max-height: 350px;
|
||||
}
|
||||
|
||||
.border-normal {
|
||||
border: $border-normal;
|
||||
}
|
||||
115
packages/Webkul/Velocity/src/Resources/assets/sass/static/material-icons.scss
vendored
Normal file
115
packages/Webkul/Velocity/src/Resources/assets/sass/static/material-icons.scss
vendored
Normal file
|
|
@ -0,0 +1,115 @@
|
|||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialicons/v48/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
|
||||
}
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons Outlined';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialiconsoutlined/v14/gok-H7zzDkdnRel8-DQ6KAXJ69wP1tGnf4ZGhUce.woff2) format('woff2');
|
||||
}
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons Round';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialiconsround/v14/LDItaoyNOAY6Uewc665JcIzCKsKc_M9flwmP.woff2) format('woff2');
|
||||
}
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons Sharp';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialiconssharp/v15/oPWQ_lt5nv4pWNJpghLP75WiFR4kLh3kvmvR.woff2) format('woff2');
|
||||
}
|
||||
/* fallback */
|
||||
@font-face {
|
||||
font-family: 'Material Icons Two Tone';
|
||||
font-style: normal;
|
||||
font-weight: 400;
|
||||
src: url(https://fonts.gstatic.com/s/materialiconstwotone/v13/hESh6WRmNCxEqUmNyh3JDeGxjVVyMg4tHGctNCu0.woff2) format('woff2');
|
||||
}
|
||||
|
||||
.material-icons {
|
||||
font-family: 'Material Icons';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.material-icons-outlined {
|
||||
font-family: 'Material Icons Outlined';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.material-icons-round {
|
||||
font-family: 'Material Icons Round';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.material-icons-sharp {
|
||||
font-family: 'Material Icons Sharp';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
||||
.material-icons-two-tone {
|
||||
font-family: 'Material Icons Two Tone';
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
font-size: 24px;
|
||||
line-height: 1;
|
||||
letter-spacing: normal;
|
||||
text-transform: none;
|
||||
display: inline-block;
|
||||
white-space: nowrap;
|
||||
word-wrap: normal;
|
||||
direction: ltr;
|
||||
-webkit-font-feature-settings: 'liga';
|
||||
-webkit-font-smoothing: antialiased;
|
||||
}
|
||||
|
|
@ -39,7 +39,7 @@
|
|||
|
||||
<div class="mini-cart-content">
|
||||
<i class="icon fs16 cell rango-arrow-down down-icon-position down-arrow-margin"></i>
|
||||
<i class="rango-cart-1 fs24 text-down-3"></i>
|
||||
<i class="material-icons-outlined text-down-3">shopping_cart</i>
|
||||
<span class="badge" v-text="itemCount"></span>
|
||||
<span class="fs18 fw6 cart-text">{{ __('velocity::app.minicart.cart') }}</span>
|
||||
</div>
|
||||
|
|
@ -66,6 +66,19 @@
|
|||
</div>
|
||||
</script>
|
||||
|
||||
<script type="text/x-template" id="logo-template">
|
||||
<a
|
||||
:class="`left ${addClass}`"
|
||||
href="{{ route('shop.home.index') }}">
|
||||
|
||||
@if ($logo = core()->getCurrentChannel()->logo_url)
|
||||
<img class="logo" src="{{ $logo }}" />
|
||||
@else
|
||||
<img class="logo" src="{{ asset('themes/velocity/assets/images/logo-text.png') }}" />
|
||||
@endif
|
||||
</a>
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
(() => {
|
||||
Vue.component('star-ratings', {
|
||||
|
|
@ -178,5 +191,10 @@
|
|||
}
|
||||
}
|
||||
});
|
||||
|
||||
Vue.component('logo-component', {
|
||||
template: '#logo-template',
|
||||
props: ['addClass'],
|
||||
});
|
||||
})()
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -24,7 +24,7 @@
|
|||
|
||||
@push('css')
|
||||
<style type="text/css">
|
||||
.categories-sidebar-container {
|
||||
.general-container {
|
||||
margin-bottom: 0px;
|
||||
min-height: 100vh;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,112 @@
|
|||
<div class="container-fluid category-with-custom-options">
|
||||
@php
|
||||
$category[0] = app('Webkul\Category\Repositories\CategoryRepository')->findByPath($category[0]);
|
||||
$category[1] = app('Webkul\Category\Repositories\CategoryRepository')->findByPath($category[1]);
|
||||
$category[2] = app('Webkul\Category\Repositories\CategoryRepository')->findByPath($category[2]);
|
||||
$category[3] = app('Webkul\Category\Repositories\CategoryRepository')->findByPath($category[3]);
|
||||
@endphp
|
||||
|
||||
<div class="row">
|
||||
<div class="col pr15">
|
||||
<img src="{{ asset ('/storage/' . $category['2']->image) }}" />
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="card-arrow-container">
|
||||
<div class="card-arrow card-arrow-rt"></div>
|
||||
</div>
|
||||
|
||||
<div class="categories-collection">
|
||||
<div class="category-text-content">
|
||||
<h2 class="text-uppercase">{{ $category[0]->name }}</h2>
|
||||
<ul type="none" class="fs14">
|
||||
@foreach ($category[0]->children as $subCategory)
|
||||
<li>
|
||||
<a href="{{ $subCategory->slug }}" class="unset">
|
||||
{{ $subCategory->name }}
|
||||
</a>
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col pr15">
|
||||
<img src="{{ asset ('/storage/' . $category['0']->image) }}" />
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<div class="card-arrow-container">
|
||||
<div class="card-arrow card-arrow-bt"></div>
|
||||
</div>
|
||||
|
||||
<div class="categories-collection">
|
||||
<div class="category-text-content">
|
||||
<h2 class="text-uppercase">{{ $category[1]->name }}</h2>
|
||||
<ul type="none" class="fs14">
|
||||
@foreach ($category[1]->children as $subCategory)
|
||||
<li>
|
||||
<a href="{{ $subCategory->slug }}" class="unset">
|
||||
{{ $subCategory->name }}
|
||||
</a>
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
<div class="col mr15">
|
||||
<div class="card-arrow-container">
|
||||
<div class="card-arrow card-arrow-tp"></div>
|
||||
</div>
|
||||
|
||||
<div class="categories-collection">
|
||||
<div class="category-text-content">
|
||||
<h2 class="text-uppercase">{{ $category[2]->name }}</h2>
|
||||
<ul type="none" class="fs14">
|
||||
@foreach ($category[2]->children as $subCategory)
|
||||
<li>
|
||||
<a href="{{ $subCategory->slug }}" class="unset">
|
||||
{{ $subCategory->name }}
|
||||
</a>
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col mt15">
|
||||
<img src="{{ asset ('/storage/' . $category['3']->image) }}" />
|
||||
</div>
|
||||
|
||||
<div class="col mt15 mr15">
|
||||
<div class="card-arrow-container">
|
||||
<div class="card-arrow card-arrow-lt"></div>
|
||||
</div>
|
||||
|
||||
<div class="categories-collection">
|
||||
<div class="category-text-content">
|
||||
<h2 class="text-uppercase">{{ $category[3]->name }}</h2>
|
||||
<ul type="none" class="fs14">
|
||||
@foreach ($category[3]->children as $subCategory)
|
||||
<li>
|
||||
<a href="{{ $subCategory->slug }}" class="unset">
|
||||
{{ $subCategory->name }}
|
||||
</a>
|
||||
</li>
|
||||
@endforeach
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col">
|
||||
<img src="{{ asset ('/storage/' . $category['1']->image) }}" />
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -17,7 +17,7 @@
|
|||
</div>
|
||||
|
||||
<div class="right">
|
||||
<h3 class="fs20 clr-light">{{ $categoryDetails->name }}</h3>
|
||||
<h3 class="fs20 clr-light text-uppercase">{{ $categoryDetails->name }}</h3>
|
||||
|
||||
<ul type="none">
|
||||
@foreach ($categoryDetails->children as $subCategory)
|
||||
|
|
|
|||
|
|
@ -1,98 +0,0 @@
|
|||
<div class="container-fluid category-with-custom-options">
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col bg-image mr15"></div>
|
||||
|
||||
<div class="col">
|
||||
|
||||
<div class="card-arrow-container">
|
||||
<div class="card-arrow card-arrow-rt"></div>
|
||||
</div>
|
||||
|
||||
<div class="categories-collection">
|
||||
<div class="category-text-content">
|
||||
<h2>WOMEN</h2>
|
||||
<ul type="none" class="fs14">
|
||||
<li>Clothing</li>
|
||||
<li>Top Brands</li>
|
||||
<li>Watches</li>
|
||||
<li>Handbags & Clutches</li>
|
||||
<li>Gold & Diamond Jewellery</li>
|
||||
<li>Fashion & Silver Jewellery</li>
|
||||
<li>Sunglasses</li>
|
||||
<li>Handloom & Handicraft Store</li>
|
||||
<li>Handbags & Clutches</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col bg-image mr15"></div>
|
||||
|
||||
<div class="col">
|
||||
<div class="card-arrow-container">
|
||||
<div class="card-arrow card-arrow-bt"></div>
|
||||
</div>
|
||||
|
||||
<div class="categories-collection">
|
||||
<div class="category-text-content">
|
||||
<h2>Kids</h2>
|
||||
<ul type="none" class="fs14">
|
||||
<li>Clothing</li>
|
||||
<li>Top Brands</li>
|
||||
<li>Watches</li>
|
||||
<li>Handbags & Clutches</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="row">
|
||||
|
||||
<div class="col mr15">
|
||||
<div class="card-arrow-container">
|
||||
<div class="card-arrow card-arrow-tp"></div>
|
||||
</div>
|
||||
|
||||
<div class="categories-collection">
|
||||
<div class="category-text-content">
|
||||
<h2>Women Apparel</h2>
|
||||
<ul type="none" class="fs14">
|
||||
<li>Hoodies & Sweatshirts</li>
|
||||
<li>Jackets</li>
|
||||
<li>Tees</li>
|
||||
<li>Tanks</li>
|
||||
<li>Pants</li>
|
||||
<li>Shorts</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col bg-image mt10"></div>
|
||||
|
||||
<div class="col mt10 mr15">
|
||||
<div class="card-arrow-container">
|
||||
<div class="card-arrow card-arrow-lt"></div>
|
||||
</div>
|
||||
|
||||
<div class="categories-collection">
|
||||
<div class="category-text-content">
|
||||
<h2>Electronics</h2>
|
||||
<ul type="none" class="fs14">
|
||||
<li>Clothing</li>
|
||||
<li>Top Brands</li>
|
||||
<li>Watches</li>
|
||||
<li>Handbags & Clutches</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col bg-image"></div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -50,7 +50,7 @@
|
|||
<div class="full-content-wrapper">
|
||||
{!! view_render_event('bagisto.shop.home.content.before') !!}
|
||||
|
||||
{!! DbView::make($velocityMetaData)->field('home_page_content')->render() !!}
|
||||
{{-- {!! DbView::make($velocityMetaData)->field('home_page_content')->render() !!} --}}
|
||||
|
||||
{{ view_render_event('bagisto.shop.home.content.after') }}
|
||||
</div>
|
||||
|
|
@ -63,8 +63,7 @@
|
|||
<!-- Show Product Policy -->
|
||||
{{-- @include('shop::home.product-policy') --}}
|
||||
|
||||
<!-- trending products -->
|
||||
{{-- @include('shop::home.category-with-custom-option') --}}
|
||||
|
||||
|
||||
<!-- advertisement two -->
|
||||
{{-- @include('shop::home.advertisements.advertisement-two') --}}
|
||||
|
|
|
|||
|
|
@ -1,12 +1,6 @@
|
|||
<header>
|
||||
<div class="row col-12 remove-padding-margin velocity-divide-page">
|
||||
<a id="logo" class="left" href="{{ route('shop.home.index') }}">
|
||||
@if ($logo = core()->getCurrentChannel()->logo_url)
|
||||
<img class="logo" src="{{ $logo }}" class="img-responsive" title="" alt="" />
|
||||
@else
|
||||
<img class="logo" src="{{ asset('themes/velocity/assets/images/logo-text.png') }}" class="img-responsive" />
|
||||
@endif
|
||||
</a>
|
||||
<logo-component></logo-component>
|
||||
|
||||
<div class="row no-margin right">
|
||||
<div class="col-8 no-padding input-group">
|
||||
|
|
|
|||
|
|
@ -63,7 +63,7 @@
|
|||
@include('shop::layouts.top-nav.index')
|
||||
@include('shop::layouts.header.index', ['categories' => $categories])
|
||||
|
||||
<div class="categories-sidebar-container col-12 no-padding">
|
||||
<div class="general-container col-12 no-padding">
|
||||
|
||||
@php
|
||||
$velocityContent = app('Webkul\Velocity\Repositories\ContentRepository')->getAllContents();
|
||||
|
|
|
|||
|
|
@ -15,10 +15,11 @@
|
|||
{{ ! $product->isSaleable() ? 'disabled' : '' }}>
|
||||
|
||||
@if (! (isset($showCartIcon) && !$showCartIcon))
|
||||
<span class="rango-cart-1 fs20"></span>
|
||||
{{-- <span class="rango-cart-1 fs20"></span> --}}
|
||||
<i class="material-icons text-down-3">shopping_cart</i>
|
||||
@endif
|
||||
|
||||
<span class="fs14 align-vertical-top fw6">
|
||||
<span class="fs14 fw6 text-uppercase text-up-4">
|
||||
{{ __('shop::app.products.add-to-cart') }}
|
||||
</span>
|
||||
</button>
|
||||
|
|
@ -26,7 +27,9 @@
|
|||
</div>
|
||||
|
||||
@if (! (isset($showWishlist) && !$showWishlist))
|
||||
@include('shop::products.wishlist')
|
||||
@include('shop::products.wishlist', [
|
||||
'addClass' => $addWishlistClass ?? ''
|
||||
])
|
||||
@endif
|
||||
|
||||
{!! view_render_event('bagisto.shop.products.add_to_cart.after', ['product' => $product]) !!}
|
||||
|
|
@ -1,3 +1,4 @@
|
|||
@inject ('toolbarHelper', 'Webkul\Product\Helpers\Toolbar')
|
||||
@inject ('productRepository', 'Webkul\Product\Repositories\ProductRepository')
|
||||
|
||||
@extends('shop::layouts.master')
|
||||
|
|
@ -54,7 +55,6 @@
|
|||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
@if ($products->count())
|
||||
<div class="filters-container">
|
||||
@include ('shop::products.list.toolbar')
|
||||
|
|
@ -74,17 +74,11 @@
|
|||
</div>
|
||||
|
||||
@if ($isDisplayMode)
|
||||
|
||||
@if ($products->count())
|
||||
|
||||
@inject ('toolbarHelper', 'Webkul\Product\Helpers\Toolbar')
|
||||
|
||||
@if ($toolbarHelper->getCurrentMode() == 'grid')
|
||||
<div class="row">
|
||||
@foreach ($products as $productFlat)
|
||||
|
||||
@include ('shop::products.list.card', ['product' => $productFlat])
|
||||
|
||||
@endforeach
|
||||
</div>
|
||||
@else
|
||||
|
|
|
|||
|
|
@ -89,7 +89,7 @@
|
|||
@if ($totalReviews)
|
||||
<div class="product-rating">
|
||||
<star-ratings ratings="{{ $avgRatings }}"></star-ratings>
|
||||
<span>{{ $totalReviews }} Ratings</span>
|
||||
<span class="align-top">{{ $totalReviews }} Ratings</span>
|
||||
</div>
|
||||
@else
|
||||
<div class="product-rating">
|
||||
|
|
@ -98,7 +98,10 @@
|
|||
@endif
|
||||
|
||||
<div class="cart-wish-wrap row">
|
||||
@include ('shop::products.add-to-cart', ['product' => $product])
|
||||
@include ('shop::products.add-to-cart', [
|
||||
'product' => $product,
|
||||
'addWishlistClass' => 'col-4 offset-4'
|
||||
])
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -36,6 +36,10 @@
|
|||
|
||||
<layered-navigation></layered-navigation>
|
||||
|
||||
@if ($showRecentlyViewed)
|
||||
@include ('shop::products.list.recently-viewed')
|
||||
@endif
|
||||
|
||||
{!! view_render_event('bagisto.shop.products.list.layered-nagigation.after') !!}
|
||||
|
||||
</div>
|
||||
|
|
@ -50,7 +54,13 @@
|
|||
|
||||
<div class="filter-content">
|
||||
<div class="filter-attributes">
|
||||
<filter-attribute-item v-for='(attribute, index) in attributes' :attribute="attribute" :key="index" :index="index" @onFilterAdded="addFilters(attribute.code, $event)" :appliedFilterValues="appliedFilters[attribute.code]">
|
||||
<filter-attribute-item
|
||||
:key="index"
|
||||
:index="index"
|
||||
:attribute="attribute"
|
||||
v-for='(attribute, index) in attributes'
|
||||
@onFilterAdded="addFilters(attribute.code, $event)"
|
||||
:appliedFilterValues="appliedFilters[attribute.code]">
|
||||
</filter-attribute-item>
|
||||
|
||||
</div>
|
||||
|
|
@ -74,13 +84,21 @@
|
|||
|
||||
<div class="filter-attributes-content">
|
||||
<ul type="none" class="items ml15" v-if="attribute.type != 'price'">
|
||||
<li class="item" v-for='(option, index) in attribute.options'>
|
||||
|
||||
<span class="checkbox">
|
||||
<input type="checkbox" :id="option.id" v-bind:value="option.id" v-model="appliedFilters" @change="addFilter($event)"/>
|
||||
@{{ option.label ? option.label : option.admin_name }}
|
||||
</span>
|
||||
<li
|
||||
class="item"
|
||||
v-for='(option, index) in attribute.options'>
|
||||
|
||||
<div
|
||||
class="checkbox"
|
||||
@click="optionClicked(option.id, $event)">
|
||||
<input
|
||||
type="checkbox"
|
||||
:id="option.id"
|
||||
v-bind:value="option.id"
|
||||
v-model="appliedFilters"
|
||||
@change="addFilter($event)" />
|
||||
<span>@{{ option.label ? option.label : option.admin_name }}</span>
|
||||
</div>
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
|
|
@ -112,32 +130,25 @@
|
|||
id="price_to">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</script>
|
||||
|
||||
<script>
|
||||
<script type="text/javascript">
|
||||
Vue.component('layered-navigation', {
|
||||
|
||||
template: '#layered-navigation-template',
|
||||
|
||||
data: function() {
|
||||
return {
|
||||
appliedFilters: {},
|
||||
attributes: @json($filterAttributes),
|
||||
|
||||
appliedFilters: {}
|
||||
}
|
||||
},
|
||||
|
||||
created: function () {
|
||||
var urlParams = new URLSearchParams(window.location.search);
|
||||
let urlParams = new URLSearchParams(window.location.search);
|
||||
|
||||
var this_this = this;
|
||||
|
||||
urlParams.forEach(function (value, index) {
|
||||
this_this.appliedFilters[index] = value.split(',');
|
||||
urlParams.forEach((value, index) => {
|
||||
this.appliedFilters[index] = value.split(',');
|
||||
});
|
||||
},
|
||||
|
||||
|
|
@ -162,14 +173,12 @@
|
|||
}
|
||||
|
||||
window.location.href = "?" + params.join('&');
|
||||
}
|
||||
},
|
||||
}
|
||||
});
|
||||
|
||||
Vue.component('filter-attribute-item', {
|
||||
|
||||
template: '#filter-attribute-item-template',
|
||||
|
||||
props: [
|
||||
'index',
|
||||
'attribute',
|
||||
|
|
@ -219,7 +228,6 @@
|
|||
|
||||
methods: {
|
||||
addFilter: function (e) {
|
||||
|
||||
this.$emit('onFilterAdded', this.appliedFilters)
|
||||
},
|
||||
|
||||
|
|
@ -236,10 +244,28 @@
|
|||
this.appliedFilters = [];
|
||||
|
||||
this.$emit('onFilterAdded', this.appliedFilters)
|
||||
},
|
||||
|
||||
optionClicked: function (id, {target}) {
|
||||
let checkbox = $(`#${id}`);
|
||||
if (checkbox && checkbox.length > 0 && target.type != "checkbox") {
|
||||
checkbox = checkbox[0];
|
||||
checkbox.checked = !checkbox.checked;
|
||||
|
||||
if (checkbox.checked) {
|
||||
this.appliedFilters.push(id);
|
||||
} else {
|
||||
let idPosition = this.appliedFilters.indexOf(id);
|
||||
if (idPosition == -1)
|
||||
idPosition = this.appliedFilters.indexOf(id.toString());
|
||||
|
||||
this.appliedFilters.splice(idPosition, 1);
|
||||
}
|
||||
|
||||
this.addFilter(event);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
});
|
||||
|
||||
</script>
|
||||
@endpush
|
||||
|
|
@ -46,6 +46,12 @@
|
|||
</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span
|
||||
class="fs16"
|
||||
v-if="!recentlyViewed"
|
||||
v-text="'Not available'">
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</script>
|
||||
|
|
@ -60,19 +66,24 @@
|
|||
return {
|
||||
baseURL: '{{ url()->to('/') }}',
|
||||
recentlyViewed: (() => {
|
||||
let slugs = JSON.parse(window.localStorage.recentlyViewed);
|
||||
let updatedSlugs = {};
|
||||
let storedRecentlyViewed = window.localStorage.recentlyViewed;
|
||||
if (storedRecentlyViewed) {
|
||||
var slugs = JSON.parse(storedRecentlyViewed);
|
||||
var updatedSlugs = {};
|
||||
|
||||
slugs.forEach(slug => {
|
||||
updatedSlugs[slug] = {};
|
||||
});
|
||||
slugs.forEach(slug => {
|
||||
updatedSlugs[slug] = {};
|
||||
});
|
||||
|
||||
return updatedSlugs;
|
||||
return updatedSlugs;
|
||||
}
|
||||
})(),
|
||||
}
|
||||
},
|
||||
|
||||
created: function () {
|
||||
// @TODO:- current product and recentlyViewed
|
||||
|
||||
for (slug in this.recentlyViewed) {
|
||||
if (slug) {
|
||||
this.$http(`${this.baseURL}/product-details/${slug}`)
|
||||
|
|
|
|||
|
|
@ -42,7 +42,7 @@
|
|||
<div class="sorter">
|
||||
<label>{{ __('shop::app.products.sort-by') }}</label>
|
||||
<i class="icon fs16 cell rango-arrow-down select-icon-margin down-icon-position"></i>
|
||||
<select class="selective-div" onchange="window.location.href = this.value">
|
||||
<select class="selective-div border-normal" onchange="window.location.href = this.value">
|
||||
|
||||
@foreach ($toolbarHelper->getAvailableOrders() as $key => $order)
|
||||
|
||||
|
|
@ -58,7 +58,7 @@
|
|||
<div class="limiter">
|
||||
<label>{{ __('shop::app.products.show') }}</label>
|
||||
<i class="icon fs16 cell rango-arrow-down select-icon-show-margin down-icon-position"></i>
|
||||
<select class="selective-div" onchange="window.location.href = this.value" style="width: 57px;">
|
||||
<select class="selective-div border-normal" onchange="window.location.href = this.value" style="width: 57px;">
|
||||
|
||||
@foreach ($toolbarHelper->getAvailableLimits() as $limit)
|
||||
|
||||
|
|
|
|||
|
|
@ -29,7 +29,7 @@
|
|||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.categories-sidebar-container {
|
||||
.general-container {
|
||||
margin-bottom: 0px;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -84,7 +84,7 @@
|
|||
|
||||
@include ('shop::products.add-to-cart', [
|
||||
'product' => $product,
|
||||
'showCartIcon' => false
|
||||
'showCartIcon' => false,
|
||||
])
|
||||
</div>
|
||||
|
||||
|
|
@ -201,7 +201,7 @@
|
|||
if (existingViewed.indexOf(currentProductId) == -1) {
|
||||
existingViewed.push(currentProductId);
|
||||
|
||||
if (existingViewed.length >= 4)
|
||||
if (existingViewed.length > 4)
|
||||
existingViewed = existingViewed.slice(Math.max(existingViewed.length - 4, 1));
|
||||
|
||||
window.localStorage.setItem('recentlyViewed', JSON.stringify(existingViewed));
|
||||
|
|
|
|||
|
|
@ -7,7 +7,7 @@
|
|||
@endphp
|
||||
|
||||
<a
|
||||
class="unset wishlist-icon col-4 offset-4 text-right"
|
||||
class="unset wishlist-icon text-right {{ $addWishlistClass ?? '' }}"
|
||||
@if (! $isWished)
|
||||
href="{{ route('customer.wishlist.add', $product->product_id) }}"
|
||||
@elseif (isset($itemId) && $itemId)
|
||||
|
|
@ -15,15 +15,41 @@
|
|||
@endif
|
||||
>
|
||||
|
||||
<i class="fs24 {{ $isWished ? 'rango-heart-fill' : 'rango-heart'}}"></i>
|
||||
<wishlist-component active="{{ !$isWished }}"></wishlist-component>
|
||||
</a>
|
||||
@endauth
|
||||
|
||||
@guest('customer')
|
||||
<a
|
||||
href="{{ route('customer.session.index') }}"
|
||||
class="unset wishlist-icon col-4 offset-4 text-right">
|
||||
<i class="fs24 rango-heart"></i>
|
||||
class="unset wishlist-icon text-right {{ $addWishlistClass ?? '' }}">
|
||||
<wishlist-component active="false"></wishlist-component>
|
||||
</a>
|
||||
@endauth
|
||||
{!! view_render_event('bagisto.shop.products.wishlist.after') !!}
|
||||
|
||||
@push('scripts')
|
||||
<script type="text/x-template" id="wishlist-template">
|
||||
<i
|
||||
:class="`material-icons ${isActive} ${active}`"
|
||||
@mouseover="isActive ? isActive = !isActive : ''"
|
||||
@mouseout="active !== '' && !isActive ? isActive = !isActive : ''">
|
||||
|
||||
@{{ isActive ? 'favorite_border' : 'favorite' }}
|
||||
</i>
|
||||
</script>
|
||||
|
||||
<script type="text/javascript">
|
||||
(() => {
|
||||
Vue.component('wishlist-component', {
|
||||
props: ['active'],
|
||||
template: '#wishlist-template',
|
||||
data: function () {
|
||||
return {
|
||||
isActive: this.active
|
||||
}
|
||||
},
|
||||
});
|
||||
})()
|
||||
</script>
|
||||
@endpush
|
||||
|
|
|
|||
|
|
@ -1,3 +1,5 @@
|
|||
@inject ('toolbarHelper', 'Webkul\Product\Helpers\Toolbar')
|
||||
|
||||
@extends('shop::layouts.master')
|
||||
|
||||
@section('page_title')
|
||||
|
|
@ -5,28 +7,39 @@
|
|||
@endsection
|
||||
|
||||
@section('content-wrapper')
|
||||
<section class="search-container cart-details row offset-1">
|
||||
<section class="search-container cart-details row">
|
||||
@if ($results->count())
|
||||
<div class="filters-container col-12">
|
||||
@include ('shop::products.list.toolbar')
|
||||
</div>
|
||||
@endif
|
||||
|
||||
@if (! $results)
|
||||
<h1 class="fw6 row col-12">{{ __('shop::app.search.no-results') }}</h1>
|
||||
<h1 class="fw6 col-12">{{ __('shop::app.search.no-results') }}</h1>
|
||||
@else
|
||||
@if ($results->isEmpty())
|
||||
<h1 class="fw6 row col-12">{{ __('shop::app.products.whoops') }}</h1>
|
||||
<h1 class="fw6 col-12">{{ __('shop::app.products.whoops') }}</h1>
|
||||
<span>{{ __('shop::app.search.no-results') }}</span>
|
||||
@else
|
||||
@if ($results->total() == 1)
|
||||
<h2 class="fw6 row col-12 mb20">
|
||||
<h2 class="fw6 col-12 mb20">
|
||||
{{ $results->total() }} {{ __('shop::app.search.found-result') }}
|
||||
</h2>
|
||||
@else
|
||||
<h2 class="fw6 row col-12 mb20">
|
||||
<h2 class="fw6 col-12 mb20">
|
||||
{{ $results->total() }} {{ __('shop::app.search.found-results') }}
|
||||
</h2>
|
||||
@endif
|
||||
|
||||
@foreach ($results as $productFlat)
|
||||
|
||||
@include('shop::products.list.card', ['product' => $productFlat->product])
|
||||
|
||||
@if ($toolbarHelper->getCurrentMode() == 'grid')
|
||||
@include('shop::products.list.card', ['product' => $productFlat->product])
|
||||
@else
|
||||
@include('shop::products.list.card', [
|
||||
'list' => true,
|
||||
'product' => $productFlat->product
|
||||
])
|
||||
@endif
|
||||
@endforeach
|
||||
|
||||
@include('ui::datagrid.pagination')
|
||||
|
|
|
|||
Loading…
Reference in New Issue