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

Post Navigation Link: add design controls (color, text decoration, and font family) #41378

Merged
merged 3 commits into from
Jun 14, 2022

Conversation

jffng
Copy link
Contributor

@jffng jffng commented May 26, 2022

What?

Adds experimental controls for link color, text decoration, and font family to the Post Navigation Link block.

Why?

It would be useful to control these style attributes via the editor. Text decoration is maybe questionable, but I think the link color and font family are additions whose use cases should be evident.

How?

Updates the theme's block.json

Testing Instructions

  1. Activate a theme whose "settings" > "appearanceTools" > true, for example emptytheme.
  2. Go to the site editor, add a post navigation link.
  3. Verify you can set its link color, font family, and text decoration:

Screenshots or screencast

Screen Shot 2022-05-26 at 1 01 52 PM

cc @WordPress/block-themers

@jffng jffng added the [Block] Post Navigation Link Affects the Post Navigation Link Block label May 26, 2022
@jffng jffng requested a review from ajitbohra as a code owner May 26, 2022 17:04
@draganescu
Copy link
Contributor

While color is obvious the others are not that clear. Will all fonts we have in that dropdown provide those arrows? As you said, the decoration is even more questionable, what would an all caps strike through "next" symbol do? I think let's add just the color and open an issue about the text options. Maybe we can move away from text in the block?

@jffng
Copy link
Contributor Author

jffng commented May 27, 2022

Will all fonts we have in that dropdown provide those arrows

No I don't think so, which is why being able to choose the font family I think is useful.

I agree text decoration is unnecessary, will remove it from this PR.

@draganescu
Copy link
Contributor

😁 thanks for the update @jffng

Excuse my persistence, but I am still unclear what font family is for because:

  • hopefully one day soon we’ll use some SVG for the symbols (like hopefully we won’t depend on text for the separator dotted style as well)
  • like you said as well, not all fonts support our symbols so we’re creating a way for users to make bad looking results. And this one is quite exotic, as getting some ª instead of the chevrons is baffling.

@scruffian
Copy link
Contributor

Yeah I think font family is potentially confusing here. Shall we reduce it to just color?

@jffng
Copy link
Contributor Author

jffng commented Jun 13, 2022

If the link has a text label, it would be useful to control the font family. For example in a theme I'm working on, the post nav links are the heading font, not the body font:

Current Intended
Screen Shot 2022-06-13 at 11 36 32 AM Screen Shot 2022-06-13 at 11 36 06 AM

I don't think it's a big deal to set this in the theme's CSS especially if you can get weird characters for the chevron, but wanted to clarify why I thought it could be useful.

@richtabor
Copy link
Member

If the link has a text label, it would be useful to control the font family.

I agree.

Copy link
Contributor

@scruffian scruffian left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Makes sense to me, let's merge.

@jffng jffng force-pushed the add/post-nav-link-link-controls branch from 845465d to 1eb834d Compare June 13, 2022 18:21
@jffng
Copy link
Contributor Author

jffng commented Jun 13, 2022

e2e admin tests failing, tried to rebase but it didn't help.

@scruffian scruffian merged commit 28bbc00 into trunk Jun 14, 2022
@scruffian scruffian deleted the add/post-nav-link-link-controls branch June 14, 2022 10:23
@github-actions github-actions bot added this to the Gutenberg 13.5 milestone Jun 14, 2022
@annezazu annezazu added the [Type] Enhancement A suggestion for improvement. label Jun 14, 2022
@femkreations femkreations added the Needs User Documentation Needs new user documentation label Sep 2, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Post Navigation Link Affects the Post Navigation Link Block Needs User Documentation Needs new user documentation [Type] Enhancement A suggestion for improvement.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants