You can still make any design as before. Not only that, one of the focuses of the update is to make customizing easier.
We tweaked the classes for the better and we’re now following the BEM naming convention. The entry about BEM is at the bottom of our update article: https://wpstackable.com/blog/huge-updates-across-all-blocks/
We’ve replaced our previous inconsistent class names, for a more general class structure across all our blocks to make almost every element easy to target. You can still easily do what you need to do now.
The reason for the change was that the old class structure was inconsistent and we didn’t have a system for it. BEM will be our standard now and for all future blocks.
For the pricing box, you can target each column via nth-child
pseudo selectors:
.ugb-pricing-box__item:nth-child(1) {
// first column
}
.ugb-pricing-box__item:nth-child(2) {
// second column
}
.ugb-pricing-box__item:nth-child(3) {
// third column
}
Or you can add a custom class, then target that element’s child:
.ugb-pricing-box.my-custom-class .ugb-pricing-box__item:nth-child(2) {
// first column
}
Here’s a good reference about the nth-child
pseudo selector: https://developer.mozilla.org/en-US/docs/Web/CSS/:nth-child#Examples
I appreciate you changing your review ??
One of the things we want to work on is a tutorial on how to customize the blocks better using custom CSS. We’ve also added in the Plain design option that’s available for a lot of the blocks so that people won’t have to override lots of styles.