Hi! I encountered some issues with the button block. I noticed a few unusual behaviours:
When I styled it with a global class, I was unable to style it properly.
When I styled the button with a global class, the first button did not display the icon, which is strange.
When I deselected the icon position on the non-global class and selected the icon position on the global class, the icon position on the default class reverted to “before” when I refreshed the page.
When I applied a border, setting the left, right, and top to 0 and the bottom to 2px, it still showed a border on all four sides at first, until I refreshed the page.
When I styled the button with a global class, the “icon position” didn’t seem to work correctly. It appears to work better with the default class.
Thank you for bringing this to our attention!
And thank you for the screencast.
Unfortunately, I haven’t been able to reproduce this on my end.
Could you possibly provide a clear reproduction process, so I may try to reproduce it on my end?
Thank you.
Currently, this is a bug as the position property shouldn’t be available for global classes, but only for block classes.
We’ll be sure to rectify this as soon as possible.
To globally apply a position to the button icon, set the direction to row and reverse.
I think again and understand why you couldn’t reproduce it.
It’s normal that you couldn’t reproduce this because the icon’s position will be returned as “before” for all after I refresh the editor. So, even if I deselect the icon’s
Thank you!
I just tested, and the icon did not show if I chose the global class (I think this due to the “style button with global class is not working” so the size from the global class didn’t apply to the icon). Anyway, I tested by deselecting the icon’s position on the block classes.
Here is the screencast:
It only works well when it’s on block classes. Styling with block classes, I can style it as usual including changing position (without reversing the direction as you suggested).
Yes. It is happening occasionally, but not often.
Anyway, I have feedback on the border width setting.
For example, when I want the button to have a border at the bottom only, I give the border-bottom a value of 2px. Then the rest of the fields are blank. The front end should show the border-bottom only. But it is not the case on the front end if I leave them blank. It shows a border for all sides (refer to the 3 buttons below) even if I give 2px to 1 side only.