Ch/bg color change #456
Ch/bg color change #456
Conversation
…ange color as well
|
@leobauza, yeah I'll wait til @nhunzaker is back to merge! |
| <h3 | ||
| className={'section__content__subheading -top' + browserClass} | ||
| > | ||
| <h3 className={'section__content__subheading -top' + browserClass}> |
There was a problem hiding this comment.
Should there be a space here? Like will this turn into -top<browserClass>?
There was a problem hiding this comment.
nope because there is a space built into browserClass but I can see why that's confusing so I will change it
There was a problem hiding this comment.
Ah sorry :(. I must have missed it.
| changeBgColor(oldSection, newSection) { | ||
| this.body.classList.remove(`bg-color-${oldSection}`) | ||
| this.body.classList.add(`bg-color-${newSection}`) | ||
| } |
There was a problem hiding this comment.
Any concerns with the background color staying the section color when the user transitions to another page? Are there any other pages?
There was a problem hiding this comment.
there are no other pages so should be okay! I'll keep an eye on that
|
@nhunzaker the CI audit test keeps failing for all my PRs even though I've run |
|
@nhunzaker the CI audit test keeps failing for all my PRs even though I've run |
Codecov Report
@@ Coverage Diff @@
## ch/2-col-option #456 +/- ##
===================================================
+ Coverage 73.68% 76.51% +2.83%
===================================================
Files 44 44
Lines 1368 1367 -1
Branches 255 253 -2
===================================================
+ Hits 1008 1046 +38
+ Misses 295 263 -32
+ Partials 65 58 -7
Continue to review full report at Codecov.
|
* starting styling layout and structure of mobile * added styling for desktop layout * tweaked heading margin * ran yarn format * ran yarn format * removed prettier dev dependency * Ch/qa scrolling (#458)
* started implementing functionality to change bg color * refactored footer for changing bg color, refactored scss to be more modular * rebased branch, refactored to take advantage of rerender * refactored color changing functionality so that nav and footer can change color as well * ran yarn format * removed prettier as dev dependency to use root rules instead * Ch/layout (#457) * Ch/qa scrolling (#458)
* trial 1 for locked scroll behavior * trying out two columns layout * experimenting with react-intersection-observer * set up IntersectionObserver and have it pull from json file * restructured base layout for new design and did basic styling * implementing intersection observer to change text on scroll * added functionality to change view by button and started refactoring * tweaked Intersection Observer to run smoother, added third section * removed unnecessary comments * remove comment * ran yarn format * fixed weird formatting by yarn * fixed more weird formatting by yarn * tweaking based on PR comments * finished refactoring to change classnames on rerender * refactored to rerender based on one state property only * changed var name to be more clear * got rid of unnecessary ids * ran yarn format * removed prettier as dev dependency and ran yarn format * Ch/bg color change (#456) * Ch/layout (#457) * Ch/qa scrolling (#458) * moved polyfill inside componentDidMount * trying new way to import polyfill
This PR implements functionality to change background color on scroll. Each section has its own background color. This changes color for the
body,nav, andfooter.