Build a Blog Preview Card (Frontend Mentor)
Video Not Working? Fix It Now
"This HTML & CSS-only challenge is a perfect project for beginners getting up to speed with HTML and CSS fundamentals, like HTML structure and the box model."
Card layouts are used everywhere in modern web dev. In this video, we continue exploring and expanding on the "card" pattern and use it in another Frontend Mentor's UI challenge. In some cases, we need break the card pattern a little. We do that here to make the footer of the card easier to style and maintain.
Original Challenge & Starter Code: https://www.frontendmentor.io/challenges/blog-preview-card-ckPaj01IcS
00:00 - Intro
03:15 - Add Markup
09:15 - Get tokens & compositions
16:30 - Use Utopia.fy
24:10 - Add cluster composition
27:05 - Add block styles
36:35 - Check work & adjust link style
40:05 - Wrapping up
Comment
