change depandeciy of slider component, hide attribute with option
This commit is contained in:
parent
bfd55c345f
commit
b6cdcad01d
|
|
@ -25,6 +25,6 @@
|
|||
"ez-plus": "^1.2.1",
|
||||
"vee-validate": "^2.2.15",
|
||||
"vue-flatpickr": "^2.3.0",
|
||||
"vue-slider-component": "^2.7.5"
|
||||
"vue-slider-component": "^3.1.0"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
|
@ -39,3 +39,9 @@
|
|||
*
|
||||
* Date: 2019-05-01T21:04Z
|
||||
*/
|
||||
|
||||
/**
|
||||
* vue-class-component v7.0.1
|
||||
* (c) 2015-present Evan You
|
||||
* @license MIT
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -1,4 +1,4 @@
|
|||
{
|
||||
"/js/shop.js": "/js/shop.js?id=6d8ea335fbfa47e80e72",
|
||||
"/css/shop.css": "/css/shop.css?id=66ee90f14efb050a20e5"
|
||||
"/js/shop.js": "/js/shop.js?id=d6e76f2c8f75d4217522",
|
||||
"/css/shop.css": "/css/shop.css?id=3e715efc0eb756fd1e79"
|
||||
}
|
||||
|
|
|
|||
|
|
@ -32,6 +32,7 @@ $shadow-color: #ccc;
|
|||
$shadow-color1: #cccccc;
|
||||
$outline-hvr: #eaeaec;
|
||||
$review-details: #5e5e5e;
|
||||
$slider-color: rgb(255, 100, 114);
|
||||
//shop variables ends here
|
||||
|
||||
//
|
||||
|
|
|
|||
|
|
@ -2156,6 +2156,56 @@ section.product-detail {
|
|||
}
|
||||
}
|
||||
|
||||
.vue-slider {
|
||||
.vue-slider-rail {
|
||||
background-color: #ccc;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.vue-slider-dot-handle {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
background-color: $btn-background-color;
|
||||
box-shadow: 0.5px 0.5px 2px 1px rgba(0,0,0,.32);
|
||||
}
|
||||
|
||||
.vue-slider-dot-tooltip-inner {
|
||||
border-color: $slider-color !important;
|
||||
background-color: $slider-color !important;
|
||||
}
|
||||
|
||||
.vue-slider-dot-tooltip-text {
|
||||
display: block;
|
||||
font-size: 14px;
|
||||
min-width: 20px;
|
||||
padding: 2px 5px;
|
||||
text-align: center;
|
||||
border-radius: 5px;
|
||||
white-space: nowrap;
|
||||
color: $btn-background-color;
|
||||
border-color: $slider-color !important;
|
||||
background-color: $slider-color !important;
|
||||
}
|
||||
|
||||
.vue-slider-dot-tooltip-text::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
bottom: -10px;
|
||||
left: 50%;
|
||||
width: 0;
|
||||
height: 0;
|
||||
border: 5px solid transparent;
|
||||
border: 6px solid transparent\0;
|
||||
border-top-color: inherit;
|
||||
transform: translate(-50%);
|
||||
}
|
||||
|
||||
.vue-slider-process {
|
||||
background-color: $slider-color !important;
|
||||
}
|
||||
}
|
||||
|
||||
// product pages responsive css start here
|
||||
@media only screen and (max-width: 720px) {
|
||||
section.product-detail div.layouter .form-container {
|
||||
|
|
|
|||
|
|
@ -30,6 +30,18 @@
|
|||
} else {
|
||||
$filterAttributes = $attributeRepository->getFilterAttributes();
|
||||
}
|
||||
|
||||
foreach ($filterAttributes as $attribute) {
|
||||
if ($attribute->code <> 'price') {
|
||||
if (! $attribute->options->isEmpty()) {
|
||||
$attributes[] = $attribute;
|
||||
}
|
||||
} else {
|
||||
$attributes[] = $attribute;
|
||||
}
|
||||
}
|
||||
|
||||
$filterAttributes = collect($attributes);
|
||||
?>
|
||||
|
||||
<div class="layered-filter-wrapper">
|
||||
|
|
@ -99,7 +111,7 @@
|
|||
:tooltip-style="sliderConfig.tooltipStyle"
|
||||
:max="sliderConfig.max"
|
||||
:lazy="true"
|
||||
@callback="priceRangeUpdated($event)"
|
||||
@change="priceRangeUpdated($event)"
|
||||
></vue-slider>
|
||||
</div>
|
||||
|
||||
|
|
@ -116,7 +128,7 @@
|
|||
data: function() {
|
||||
return {
|
||||
attributes: @json($filterAttributes),
|
||||
|
||||
|
||||
appliedFilters: {}
|
||||
}
|
||||
},
|
||||
|
|
@ -187,7 +199,7 @@
|
|||
|
||||
created: function () {
|
||||
if (!this.index)
|
||||
this.active = false;
|
||||
this.active = true;
|
||||
|
||||
if (this.appliedFilterValues && this.appliedFilterValues.length) {
|
||||
this.appliedFilters = this.appliedFilterValues;
|
||||
|
|
|
|||
Loading…
Reference in New Issue