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
Request path contains unescaped characters
Not Found
Not Found
Not Found
Not Found

Submitted

Todo app

Duyen Nguyen• 950

@Duyen-codes

Desktop design screenshot for the Todo app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


I'm stuck with deleting item from the list. Could you please help give me some hints on this please. I'm still a beginner but wanna challenge myself with this. Thanks for your help!

Community feedback

P
Matthias• 630

@astragenius

Posted

Hey your bg-images and icons dont load correctly.

Remove "/" on all your img url path.

for example:

body {
    --bg-img: url("/images/bg-mobile-dark.jpg");
}

to

body {

    --bg-img: url("images/bg-mobile-dark.jpg");
}

do this on all your image urls. After this all images should load correctly.

Marked as helpful

0

Duyen Nguyen• 950

@Duyen-codes

Posted

@astragenius Hey! Thanks very much for your help! I was wondering why my images don't load correctly even though they show just fine through live server on my pc. Thanks again!

0
Progress Aienobe• 565

@Paienobe

Posted

To do the deleting, you could push all the items added to the list to an array and then when you want to delete something, you can use filter method and return only the items not equal to the item you want to delete. Hope this helps

Marked as helpful

0

Duyen Nguyen• 950

@Duyen-codes

Posted

@Paienobe Hey! Thanks for your time helping! I basically know the logic of deleting items from array, but visually somehow when I click the cross icon, the whole thing does not disappear. I'm still trying to figure out why. When adding the todo item, I use insertAdjacentHTML, I dont know if that affects the thing. This challenge seems to be over my head :(

0
imNotAli• 230

@AliNaderii

Posted

Hey there :) Well, I tested your code and this is what I found.

  • Your querySelectorAll is not working as it should and when I used getElementsByTagName it worked properly.
  • The way that you are using spread syntax is not needed, querySelectorAll returns an array by default.
  • What you are pushing to todoItems is not necessary, you could just use querySelectorAll.
  • I think it's better to use createElement and then appendChild instead of insertAdjacentHTML.

I hope you find it helpful :)

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