In this initial release, I deviated from the design in a couple of ways:

• I left out the DarkMode label. I think it looks better as a single icon.

I still need to fix the blinding darkmode flash. It's annoying on the initial load, but it becomes downright infuriating when you rapidly navigate between border countries (while in darkmode).

I'm planning to use this Josh Comeau post as a guide The Quest for the Perfect Dark Mode, but I'm going to need to overhaul my themes and darkmode to fix the flash. 💥

Addressed:

• I used flex box for the grid, so I couldn't get the cards to justify along the sides (justify-content: space-between) with a gap. Should I refactor using css grid? (Safari now supports gap with flexbox as of last month)

I'm looking for feedback on my React code and anything else that stands out (good or bad).

This is another refactored project. I submitted a HTML/CSS/JS solution last year.

I am revising my earlier html/css challenges using React and Styled Components.

Even if you're not familiar with React, you can make sense of the CSS here because Styled Components uses regular CSS code.

I am interested in any and all feedback. Specifically:

• How's my component code look? (JSX, PropTypes, naming, etc)
• Do I need to improve my CSS rules? I've used REM everywhere except the media query and when vw worked better.
• What's your impression of my readme? Too long? Not detailed enough? I'd like it to be useful for FEM members thinking about moving from html/css to React.

Thanks in advance! Aaron

👋 I will be updating this app (refactoring state using Redux, writing more tests), so I am interested in any and all feedback!

• The timer mode is controlled by a form containing three radio inputs. There's no submit button because the form is never meant to be submitted. What's the best approach to this accessibility issue?
• Why is Firefox rendering my colors differently than Chrome/Safari?
• Is there too much transition bling on the buttons?