Creating Scalable Websites: BEM, Interactions, Bricks & ACSS

แชร์
ฝัง
  • เผยแพร่เมื่อ 1 พ.ย. 2024

ความคิดเห็น • 14

  • @edanbenatar
    @edanbenatar  9 หลายเดือนก่อน +1

    I hope this helped you better understand how to use ACSS, BEM, and Interactions.
    *Subscribe to my channel* → lm.fm/subscribe
    *Get ACSS* → lm.fm/C4VQ6gN
    *Build beautiful one-page sites with Limey for FREE* → limey.io/
    *Watch this next* ➝ Proven Strategies To Land More Clients & Transform Your Business: th-cam.com/video/UWQ6lDzn6uA/w-d-xo.html
    Be sure to hit the like button on the video if you got value from it.
    Please let me know in the comments below if you have any questions or want to see me covering a specific topic.

  • @badid0y
    @badid0y 9 หลายเดือนก่อน +2

    Great video and straight to the point. Hoping for more bricks features and acss tutorials.

    • @edanbenatar
      @edanbenatar  9 หลายเดือนก่อน

      Thanks for the support! :)

  • @rubengarciajr
    @rubengarciajr 9 หลายเดือนก่อน +1

    dope video, when i first started with ACSS, i added tons of utility classes .. then i realized the benefit of BEM!!!

    • @edanbenatar
      @edanbenatar  9 หลายเดือนก่อน

      Once it clicks you can never go back! 😅

  • @NorthTonawanda1
    @NorthTonawanda1 9 หลายเดือนก่อน +1

    Great job! Look forward to more.

    • @edanbenatar
      @edanbenatar  9 หลายเดือนก่อน

      Thank you! Already in the works :)

  • @EduwareIzekor
    @EduwareIzekor 9 หลายเดือนก่อน +2

    Very nice video Edan. When building I try to avoid styling the ID. In this case you could have adjust the margin's of the 2nd and 3rd card by using the nth-child pseudo class. It's makes it easier to manage without having to go to each card individually. Good work nonetheless!

    • @edanbenatar
      @edanbenatar  9 หลายเดือนก่อน +2

      Great tip! Would you recommend putting it on the section or container level? For now, I added I applied it from the section.
      For anyone seeing this comment, here's the code to avoid touching the ID altogether.
      %root%__unleash-card {
      &:nth-child(1) {
      background-color: #fee2e2;
      }
      &:nth-child(2) {
      background-color: #ecfccb;
      }
      &:nth-child(3) {
      background-color: #fef9c3;
      }
      }

    • @EduwareIzekor
      @EduwareIzekor 9 หลายเดือนก่อน

      @@edanbenatar I always put it on the card

  • @AdhamMaher
    @AdhamMaher 7 หลายเดือนก่อน +1

    Please I don't understand why the align-self to the left made all blocks height the same?

  •  9 หลายเดือนก่อน

    How come you are not using the right click for Colors or variables? Or have you not activated that setting? Anyway. Very nice approach. 👌

  • @jeffbarnhart6441
    @jeffbarnhart6441 2 หลายเดือนก่อน

    you explain bem better than kevin. however, I don't understand the var(-- stuff yet. Do you have a tutorial on that? where is --radius-s defined?