diff --git a/CHANGELOG.md b/CHANGELOG.md index cf21e0b926..d9d71fded0 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,9 @@ way to update this template, but currently, we follow a pattern: ## Upcoming version 2018-11-XX +* [fix] PriceFilter styles + [#954](https://github.com/sharetribe/flex-template-web/pull/954) + ## v2.3.1 2018-11-16 * [fix] Don't set currentUserHasListings if fetched listing is in draft state. diff --git a/src/components/PriceFilter/PriceFilterPlain.css b/src/components/PriceFilter/PriceFilterPlain.css index 1fae6d29c8..15239cd2e7 100644 --- a/src/components/PriceFilter/PriceFilterPlain.css +++ b/src/components/PriceFilter/PriceFilterPlain.css @@ -34,6 +34,10 @@ cursor: pointer; } +.formWrapper { + padding-left: 20px; +} + .clearButton { @apply --marketplaceH5FontStyles; font-weight: var(--fontWeightMedium); diff --git a/src/components/PriceFilter/PriceFilterPlain.js b/src/components/PriceFilter/PriceFilterPlain.js index 89711b2299..560a652ef6 100644 --- a/src/components/PriceFilter/PriceFilterPlain.js +++ b/src/components/PriceFilter/PriceFilterPlain.js @@ -73,20 +73,22 @@ class PriceFilterPlainComponent extends Component { - { - this.filterContent = node; - }} - min={min} - max={max} - step={step} - liveEdit - isOpen={this.state.isOpen} - /> +
+ { + this.filterContent = node; + }} + min={min} + max={max} + step={step} + liveEdit + isOpen={this.state.isOpen} + /> +
); } diff --git a/src/forms/PriceFilterForm/PriceFilterForm.css b/src/forms/PriceFilterForm/PriceFilterForm.css index 3d9aea457e..adaafd09c5 100644 --- a/src/forms/PriceFilterForm/PriceFilterForm.css +++ b/src/forms/PriceFilterForm/PriceFilterForm.css @@ -106,7 +106,13 @@ } .priceSeparator { - margin: 0 8px; + margin: 4px 8px 0 8px; +} + +@media (--viewportMedium) { + .priceSeparator { + margin: 2px 8px 0 8px; + } } .sliderWrapper {