Drstrange373
@Drstrange373All comments
- @Abinandan1Submitted 3 months ago
- @Abinandan1Submitted 4 months ago@Drstrange373Posted 4 months ago
Solution looks cool but a concern about toggling theme. its not actually toggling when you click "toggle-btn-container". Inside that you should explicitly click those two input filed. So for example, if i click "toggle-btn-container" on center of the element then theme wont change. My suggestion is add click event listener to "toggle-btn-container" itself.
Navbar component line 60
<div className="toggle-btn-container" onClick={()=>setTheme(!theme)}> <span className={`${theme && "dark"}`}></span> <input type="radio" name="theme" id="theme" defaultChecked={!theme} /> <input type="radio" name="theme" id="theme" defaultChecked={theme} /> </div> <svg xmlns="http://www.w3.org/2000/svg" width="22" height="22" viewBox="0 0 22 22" > <path fill="none" stroke="#838383" strokeLinecap="round" strokeLinejoin="round" strokeWidth="1.5" d="M1 10.449a10.544 10.544 0 0 0 19.993 4.686C11.544 15.135 6.858 10.448 6.858 1A10.545 10.545 0 0 0 1 10.449Z" /> </svg> </div>
Make those input fields readonly. And also hoping that change wont cause any bug😅
Marked as helpful1 - @jen67Submitted 9 months ago
Hi Guys! 👋
I just finished this challenge. I was a bit difficult but at the end I finished. Your contributions and suggestions are invaluable. Thanks a bunch! 🌟
@Drstrange373Posted 9 months agoThis was awesome! knowing you didn't used js framework. Js code was so clean and easy to understand. But I didn't understand the significance of data.json file and update.mjs .
1