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

notification page

@soufianeoualla

Desktop design screenshot for the Notifications page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

@BeinRain06

Posted

@soufianeoualla yeah that's a pretty good work!

Your website is fully responsive in mobile

But it looks like something went wrong with image when submitting

You may want to find what's going on and make your project more beautiful!

I stepped inside your projects. Maybe try when building useState of notifications array to rather links your src image

like this model :

"src": "./assets/avatar-mark-webber.webp",

instead of that one

"src": "src/assets/avatar-mark-webber.webp",

hope it could be a help when trying out to display your images correctly @soufianeoualla

Have a nice night /day and keep doing amazing stuff like that. You have the will to make it beautiful

1

@soufianeoualla

Posted

thank you for your feedback I've tried so many paths but didn't work @BeinRain06

0

@soufianeoualla

Posted

@BeinRain06 I've tried to import images as variables and it works

0

@BeinRain06

Posted

@soufianeoualla

Ok Cool. I'm glad you find the solution that works. That means you can import all images in your App.jsx.

Links these images in src

Before trying in the main templates to call images doing n.author.image

If that works nice

Thanks you sharing the solution working with me @soufianeoualla. I also learning and as well it helps me a lot.

Thanks you...

Marked as helpful

1

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