Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

nuxt and tailwind attempt

DerekL 225

@DplusK

Desktop design screenshot for the REST Countries API with color theme switcher coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
4advanced
View challenge

Design comparison


SolutionDesign

Solution retrospective


using the nuxt-color-mode, I have an issue with the transition, where the color mode will temporarily revert back to the original state when navigating to the next page. and yes I know I haven't added the before icons for the search and back, after battling with the API and JS I think I deserve a little break (jk, I am just plain lazy lol)

Community feedback

Adarsh Pratap 5,515

@adarshcodes

Posted

Hey @DplusK, you did amazing work here. Great work👏.

  • I love the animations and the design is pretty similar to the original one.
  • Everything is working perfectly.
  • Responsiveness is also working smoothly.
  • After taking a break try to give a shot to solve the HTML and Accessibility issues😜(It's a lot). Keep it up bro👍. Happy Coding
2

DerekL 225

@DplusK

Posted

@adarshcodes Hey man thanks for the kind words, yeah have those things to worry about, I kinda new to tailwind, I think somehow its causing those issues, regarding the transform transition, don't really know why, would love your take on it.

anyway thanks again and happy coding to you too

0
DerekL 225

@DplusK

Posted

@adarshcodes oh i realized whats going on with the src part, kinda silly really, cause I used lazy loading, the image tag does not have the src before its needed, well I suppose to earn me some better report score I would need to change it to non-lazy, but thanks for the nudge for me to do it

0

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord