Submitted over 3 years ago

Responsive component with mobile-first approach

anna•340

@annab6

A solution to the Article preview component challenge

Solution retrospective

This challenge was quite difficult for me. I haven´t managed to create a small "triangle" under the sharing menu in the desktop layout. Any ideas on how to add it? Any feedback on what I could improve is very welcome!

Code

Please log in to post a comment

Community feedback

Yazdun•1,310
@Yazdun
Posted over 3 years ago
Hi Anna and well done on the challenge, for issue you mentioned, you must use before css pseudo selector to add the triangle, something like :
```
 .card__share-desktop::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    background-color: var(--dark-grey-blue);
    position: absolute;
    bottom: -10px;
    right: 100px;
    transform: rotate(45deg);
  }
```
also use Prettier extension on your IDE to format your code.

✅ I opened a pull request to your repository which will fix the issue.

I hope this was helpful
Marked as helpful
darryncodes•6,350
@darryncodes
Posted over 3 years ago
Hi Anna,

Pretty sure I used this as a guide for the triangle.

All the best!
Marked as helpful

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