From 790b3781b275b9a85e944c1ed50823f6c525ba5a Mon Sep 17 00:00:00 2001 From: "alex.saiannyi" Date: Wed, 9 Sep 2020 11:43:45 +0300 Subject: [PATCH] fix(storefront)bctheme-225:fix filter top outline on focus --- CHANGELOG.md | 1 + .../scss/components/foundation/inlineList/_inlineList.scss | 6 ++++++ .../components/stencil/facetedSearch/_facetedSearch.scss | 3 ++- 3 files changed, 9 insertions(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 38f3f391be..fbb26af892 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,6 +1,7 @@ # Changelog ## Draft +- Fixed missing top outline on chosen filter's focused. [#1829](https://github.com/bigcommerce/cornerstone/pull/1829) - Create unified focus styling in Cornerstone. [#1812](https://github.com/bigcommerce/cornerstone/pull/1812) - Review link in quick modal focused twice. [#1797](https://github.com/bigcommerce/cornerstone/pull/1797) - Fixed product image doesn't change on click when viewing a product with multiple images in IE11 [#1748](https://github.com/bigcommerce/cornerstone/pull/1748) diff --git a/assets/scss/components/foundation/inlineList/_inlineList.scss b/assets/scss/components/foundation/inlineList/_inlineList.scss index c2fe893dea..185d5f73c5 100644 --- a/assets/scss/components/foundation/inlineList/_inlineList.scss +++ b/assets/scss/components/foundation/inlineList/_inlineList.scss @@ -1,7 +1,13 @@ // ============================================================================= // INLINE LIST (CSS) // ============================================================================= +// 1. It prevents from missing top outline on refine filters on focus; +// +// ----------------------------------------------------------------------------- +ul.inlineList { // 1 + overflow: visible; +} .inlineList--labels { margin-bottom: 0; diff --git a/assets/scss/components/stencil/facetedSearch/_facetedSearch.scss b/assets/scss/components/stencil/facetedSearch/_facetedSearch.scss index e32a8baa42..eea254218a 100644 --- a/assets/scss/components/stencil/facetedSearch/_facetedSearch.scss +++ b/assets/scss/components/stencil/facetedSearch/_facetedSearch.scss @@ -115,7 +115,8 @@ display: none; @include breakpoint("medium") { - display: block; // 1 + display: flex; // 1 + flex-direction: column; } }