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

Article preview component solution with SCSS

P
Ctrl+FJ 750

@FlorianJourde

Desktop design screenshot for the Article preview component coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Here's my attempt tothis challenge ! It tooks me a while, i'm particulary hapy about it. Can you tell me if you detect so issues ?

Hope you'll like it !

Community feedback

Fidel Lim 2,775

@fidellim

Posted

Hi @FlorianJourde,

Great job finishing the project! It looks great on desktop and mobile devices. Great use of animation too! One suggestion I would like to say is that on the desktop view, you can probably let the share overlay stay until the user presses the share button again. It seems to disappear after a few seconds.

Marked as helpful

1

P
Ctrl+FJ 750

@FlorianJourde

Posted

@fidellim Thanks for the suggestion but... I didn't know how to do that, ahah ! I only found setTimeout function... Have you any suggestion to do this ? By the way, I didn't want to spend so much time, to begin the next challenge quickly !

Edit: Maybe simply an onclick, instead of mouseover & mouseleave ?!

1
Fidel Lim 2,775

@fidellim

Posted

@FlorianJourde Yes, you can use the onlick event. Then inside that, you can use the toggle function to show or hide the overlay. You can have a look at this link to have an idea on toggle function. :)

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