Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Corrects mini cart display issues #1298

Merged
merged 2 commits into from
Aug 1, 2018
Merged

Corrects mini cart display issues #1298

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
6d1c20f
Corrects mini cart display issues
sacr3dc0w Jul 3, 2018
6d23620
Merge branch 'master' into mini-cart
Ubersmake Aug 1, 2018
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions CHANGELOG.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,7 @@
- Open correct product page tabs when URL contains a fragment identifier referring to that content [#1304](https://github.com/bigcommerce/cornerstone/pull/1304)
- Display product reviews in tabbed content region of product page. [#1302](https://github.com/bigcommerce/cornerstone/pull/1302)
- Show bulk discounts only if enabled through store settings. [#1310](https://github.com/bigcommerce/cornerstone/pull/1310)
- Corrects mini cart display issues [#1298](https://github.com/bigcommerce/cornerstone/pull/1298)
- Style active section in search results. [#1316](https://github.com/bigcommerce/cornerstone/pull/1316)
- Fix blog_post import statement in app.js [#1301](https://github.com/bigcommerce/cornerstone/pull/1301)
- Show carousel dots only when carousel has more than one slide. [#1319](https://github.com/bigcommerce/cornerstone/pull/1319)
Expand Down
27 changes: 25 additions & 2 deletions assets/scss/components/stencil/navUser/_navUser.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,10 @@
// 4. Needs to be 100% so its dropdown can take full width in mobile viewport
// 5. Needs to be lower than logo zIndex, otherwise, logo is not clickable
// 6. Make the triangle for currency dropdown right aligned
// 7. Corrects mini cart positioned outside viewport. Since this resets right
// position, nudge dropdown away from the side of viewport in mobile viewport.
// 8. This corrects mini cart dropdown arrow alignment in mobile viewport by
// setting the previous styles to medium breakpoint and adjusts for nudge in (7).
//
// -----------------------------------------------------------------------------

Expand Down Expand Up @@ -62,6 +66,12 @@
}
}

.navUser-section {
@include breakpoint("medium") {
position: relative; // 7
}
}

.navUser-action {
color: stencilColor("navUser-color");
font-weight: fontWeight("bold");
Expand Down Expand Up @@ -167,17 +177,30 @@

// scss-lint:disable NestingDepth
&.is-open {
top: auto !important; // 7
left: auto !important; // 7
right: remCalc(5px); // 7
@include breakpoint("medium") {
right: 0; // 7
}

&:before,
&:after {
left: auto;
}

&:before {
right: spacing("half");
right: spacing("half") - remCalc(5px); // 8
@include breakpoint("medium") {
right: spacing("half"); // 8
}
}

&:after {
right: spacing("half") + remCalc(2px);
right: spacing("half") - remCalc(3px); // 8
@include breakpoint("medium") {
right: spacing("half") + remCalc(2px); // 8
}
}
}
}
Expand Down