Figma to Bricks — Deeblessed Website Build | Cards, CPTs & Query Loops (Ep 3) скачать в хорошем качестве

Figma to Bricks — Deeblessed Website Build | Cards, CPTs & Query Loops (Ep 3)

This is Episode 3 of the Deeblessed Website Build in the Figma to Bricks series. In this episode, the build moves from layout execution into system-driven components. After completing the Hero and initial sections on the Home page, I begin setting up reusable card structures and laying the foundation for Testimonials — focusing on scalability, naming discipline, and dynamic data. This is where the project starts behaving like a system, not just a page. As the build evolves, deeper concepts naturally come into play — not as theory, but as requirements of the work. In this video, you will see: How I create modifier classes to extend components without duplication Why Testimonials deserve their own Custom Post Type (CPT) How I apply BEM naming (Block, Element, Modifier) for predictable styling Setting up and configuring a Bricks Query Loop Mapping dynamic data (images, titles, content) into components Styling card layouts systematically Using :nth-child for targeted styling Applying CSS Logical Properties for future-proof spacing Timestamps: 01:03:50 – Creating Modifier Classes (Button No Stroke) 01:17:20 – Why we use Custom Post Types (CPT) for Testimonials 01:23:00 – BEM Naming Strategy (Block, Element, Modifier) 01:24:20 – Setting up the Bricks Query Loop 01:25:30 – Mapping Dynamic Data (Images, Titles, Content) 01:30:30 – Styling the Card Layout 01:35:40 – Advanced CSS: Using :nth-child to Style Specific Cards 01:36:20 – Using CSS Logical Properties (margin-inline-start) Tools Used: Bricks Builder Core Framework Advanced Themer Original UI Design by: Ejemighaye Oghenemaro LinkedIn:   / ejemighaye-maro   Connect with me: LinkedIn:   / mimamhebron   Website: https://hebronmimam.com