Skip to content
Submitted over 4 years ago

CSS Flex is Powerful for Article Preview Component

CY•140
@cyishere
A solution to the Article preview component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

For me, the difficult part is the different styles for share buttons on desktop & mobile. My solution is using two snippet code to achieve it, this also makes the javascript more complicated.

Code

Please log in to post a comment

Log in

Community feedback

  • Grace•32,130
    @grace-snow

    Hi, This looks really good!

    You could definitely do this with one share block but theres nothing wrong with how you've done it now.

    The only things that need addressing are accessibility related really:

    • alt text on the main image should be describing the image if the image is meaningful, or empty if it is not
    • all the buttons need accessible names (aria-labels). All the social ones would probably be anchor tags (links) not buttons too.

    That's all from me. I'm really looking forward to seeing what you submit next ☺

    Ps. Remember to upvote comment if you find it helpful, thanks

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