Closed MadtownLems closed 4 months ago
This is expected because the icon container is contained by the width control. In hindsight, the width would have applied to the icon and not the container, but there were some major technical hurdles with this approach, and changing it now would be a pretty massive breaking change.
The padding "breaking out" of the container when set to be larger than the width is annoying, but it's an inherent characteristic of CSS.
Makes sense. In case anyone stumbles on this, here's what we're doing to disable Padding, since I can't really see much use to supporting it given how it works.
`function ext_icon_block_modifier_filter_metadata_registration( $metadata ) {
if ( $metadata['name'] != 'outermost/icon-block' ) {
return $metadata;
}
$metadata['supports']['spacing']['padding'] = false;
return $metadata;
}; add_filter( 'block_type_metadata', 'ext_icon_block_modifier_filter_metadata_registration' );`
Yeah not everyone needs padding, but the Playground demo has a nice example of how useful it can be.
Wow, that looks to behave very differently than our theme (and my testing of TT4, which is what my screenshots in the initial ticket are using). It's also interesting how different the back and front ends look in the playground:
Back:
Front:
Looks like something is up with your Playground instance. Styles don't look like they are loading based on the grey inserter. This is what I am seeing and what it should look like:
Editor | Frontend |
---|---|
Looks like something is up with your Playground instance. Styles don't look like they are loading based on the grey inserter.
That checks out. I don't use it much, so not sure what's causing that. Tried disabling adblockers but still no luck.
However, this has all been super helpful. I'm learning that Padding CAN be useful, but it will typically require growing the Icon size from the default in order to not have it disappear (crunched by the padding). Thanks so much as always.
I was playing with adding Padding to an Icon with a background color to increase the colored circle around it. Vertical padding seems to work as expected, but horizontal padding makes the icon disappear.