You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
{{ message }}
This repository has been archived by the owner on Nov 6, 2022. It is now read-only.
When building blocks for a site, I often have css styles that are re-useable across blocks, as well as the the larger theme. An example is styling for a tile component. This tile component could have styling that includes things like border, padding, and background-color. These styles could easily be relevant to multiple blocks.
The current options for handling these global styles have flaws.
Include styles in each block css template file. This is not DRY.
Include styles in theme stylesheet. These are not loaded in the editor.
Include styles in preview css template file. Also not DRY.
Include styles in editor-styles.css and enqueue to the admin. Not DRY.
An idea for a solution is to have a global blocks.css file that is saved in the blocks folder. This file will be:
loaded in the editor
loaded on the frontend unconditionally.
Open to discussion, especially around issues with it, but I think this could prove very helpful.
The text was updated successfully, but these errors were encountered:
Yeah, I think this would be useful. It would also help to keep block code contained as a package, separate to any theme work. I'm currently doing this using scss mixins, but there is a lot of repetition in the output code that could be dispensed with.
Global style is great option if any block needed special css then we can use parent selector to add different css for that block element only.
Also if possible add an option to remove/dequeue that global style in case of it was conflict with any theme or plugin css or end user need to add/change style as per there need.
When building blocks for a site, I often have css styles that are re-useable across blocks, as well as the the larger theme. An example is styling for a
tile
component. This tile component could have styling that includes things likeborder
,padding
, andbackground-color
. These styles could easily be relevant to multiple blocks.The current options for handling these global styles have flaws.
An idea for a solution is to have a global
blocks.css
file that is saved in theblocks
folder. This file will be:Open to discussion, especially around issues with it, but I think this could prove very helpful.
The text was updated successfully, but these errors were encountered: