Submitted 6 months ago

Blog Preview Card Vue Component written in typescript

Ryan•30

@Ryoliveira

Preview site View code

This is a solution for...Blog preview card

HTML
CSS

1newbie

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

using flex box to get all the elements to play nice together.

What challenges did you encounter, and how did you overcome them?

I didn't like setting the text to black for most of the text. Then I realized that they would all inherit the color from the "container" class and I would just have to override one of the text colors

What specific areas of your project would you like help with?

How could I better structure my scss?

What are some ways I could consolidate my flexbox definitions, could I have wrapped most of the elements in another tag and just used flexbox there?

Any suggestions to improve my code/html/css?

Community feedback

Pixelazation•50
@PixelazationPosted 5 months ago
The shade of yellow used is quite different, but the resulting layout is more or less the same. Nice use of component based structure with Vue. As for organizing the code, maybe you could try grouping other related elements together. For example, the title, description, and date could be grouped together in one div. Overall, it's still readable and the fairly accurately copied the mockup.
0

Please log in to post a comment

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