Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Global Styles] Provide guidance on how to add per-block CSS #49531

Open
mrfoxtalbot opened this issue Apr 1, 2023 · 5 comments
Open

[Global Styles] Provide guidance on how to add per-block CSS #49531

mrfoxtalbot opened this issue Apr 1, 2023 · 5 comments
Labels
CSS Styling Related to editor and front end styles, CSS-specific issues. [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi [Type] Task Issues or PRs that have been broken down into an individual action to take

Comments

@mrfoxtalbot
Copy link

mrfoxtalbot commented Apr 1, 2023

What problem does this address?

When adding custom CSS styles on a per-block basis, only the property:value needs to be added, no selector. This is has been updated in the documentation but:

Screen Shot on 2023-04-01 at 10:09:53

What is your proposed solution?

  1. I would include some context in the description. Something to the effect of "Do not add a CSS selector, just add the property:value.
  2. Add a placeholder in the textarea to provide an example.

Screen Shot on 2023-04-01 at 10:15:57

@mrfoxtalbot mrfoxtalbot added [Type] Enhancement A suggestion for improvement. [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi CSS Styling Related to editor and front end styles, CSS-specific issues. labels Apr 1, 2023
@jordesign
Copy link
Contributor

I've just opened a PR to add some additional instructions in the label. It's only part of the solution but might help some.

Not sure who would be best to get to review this though? I'm guessing the actual wording could also be refined.

Pinging @kathrynwp for an FYI and any suggestions.

@jordesign
Copy link
Contributor

Oh - and another PR which brings in some placeholder text.
#49627

@glendaviesnz @tellthemachines - I think both of you have worked on the Custom CSS functionality - I'd be interested in your thoughts (and the proposed additions) to make the correct syntax clearer (for per-block CSS)

@richtabor
Copy link
Member

Perhaps we could leverage the Tip UI like seen in the Inserter.

@mtias
Copy link
Member

mtias commented Aug 2, 2023

placeholder example sounds good

@mtias mtias added [Type] Task Issues or PRs that have been broken down into an individual action to take and removed [Type] Enhancement A suggestion for improvement. labels Aug 2, 2023
@jordesign
Copy link
Contributor

I'd be keen to see that happen. I've tried working on a PR for it myself - but can't figure out how to add a placeholder to the ` element...

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
CSS Styling Related to editor and front end styles, CSS-specific issues. [Feature] Design Tools Tools that impact the appearance of blocks both to expand the number of tools and improve the experi [Type] Task Issues or PRs that have been broken down into an individual action to take
Projects
None yet
Development

No branches or pull requests

4 participants