Skip to content
OverviewSolutions
16
Comments
32

Jen

@En-JenDenver, Colorado1,230 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

I’m currently learning...

React, a11y, styled-components, Redux, animations 👩‍💻

Latest solutions

View more solutions

Latest comments

  • Jen•1,230
    @En-Jen

    Wowww I'm blown away by your creativity 🤯 Like who would think to include avatars of FM members as an easter egg? It works so well and is so clever though! This really makes me want to play around with ScrollTrigger now! Thanks so much for sharing your beautiful solutions with the community 🙌 Absolutely amazing job, keep it up!!

  • Jen•1,230
    @En-Jen

    Hey Aaron, really well done!!😊 I went ahead and bookmarked it so I can study it more and learn from it. I really like the country card loaders that are displayed during the initial API call and the sound effect on toggle between light and dark mode is a really nice touch 👏

    One suggestion I have is maybe have more of the country card loaders during the initial API call so that there aren't any big blank spaces on the screen without loaders if the user is viewing it on a wider desktop.

    Also, it looks like you're doing quite a bit of prop drilling with the prop handleSearch (it's passed to FilterableCountryList, then FilterControls, then SearchBar before it's actually used) Could you declare that function in the SearchBar component so that it lives in the component that actually uses it? You could use Redux to manage the state and access countryFilter in App.jsx and then dispatch the action to change the state from SearchBar.jsx. I realize learning Redux may seem daunting but it's worth it!

    Overall super awesome job and keep up the great work!! 💪

  • Jen•1,230
    @En-Jen

    Hey there, just came to check out your solution to this challenge after seeing that you left feedback on mine 😊 Really nice job on it! I love the little coffee cup favicon you included and the order summary message before the user selects any options. The detailed README is also really nice to see 👏 One thing I noticed is a bug when the user doesn't select the coffee subscription options in the order that they appear on the plan page. I tried selecting them out of order and then even when I had made a selection for every question, the button to open up the modal was still disabled. Something I would consider doing for future projects is to break up your scss into more files (organized by page, components, etc.) so that you don't have over 1000 lines of code in one big scss file. Overall you did a really nice job on this challenge! Keep up the good work 💪

    -Jen

  • Jen•1,230
    @En-Jen

    Hey Enayar, just want to return the favor and leave you a comment on your solution 😊 Absolutely amazing work, everything looks and functions beautifully and your use of animations is really impressive!! I loved the animations so much that I've been learning all about Framer Motion since I first peeked at your solution. Really the only suggestion I have for an improvement is to make the Designo logo in the footer into a link that routes to the home page like you've done for the Designo logo in the header.

  • Jen•1,230
    @En-Jen

    Hey Elisabeth, nice job on this challenge!! It definitely took me forever to position the images too, so not sure if I'll be much help in that regard. Looks like your accordion is working well and it's responsive. I also like the animation you included for the box image.

    I noticed that the text color isn't changing when the user hovers over the questions in the accordion. It looks like you just used the wrong CSS selector for that declaration. Instead of

    button:hover {
    color: $hover-color;
  }

    it should be

    .faq-button:hover {
    color: $hover-color;
  }

    It would also be nice to have the cursor set to pointer on the questions in the accordion. I'd also recommend changing your media query to a bit of a wider screen width because at 1000px width, the box image is getting cut off a little on the left side.

    Happy new year and happy coding! -Jen

  • Jen•1,230
    @En-Jen

    Really nice execution!! It looks very close to the design, is responsive, and the theme switcher works great. The hover states on the cards also look really nice. The only things I would really suggest would be to vertically-center the dashboard within the viewport height. Also the design shows that when on the light theme when you hover over the switcher, the pill-shaped part of it should turn to the linear-gradient. The design also shows that the 'Overview - Today' heading should be a gray color on the light theme. Keep up the great work!!

View more comments