WordPress.org

Make WordPress Core

Opened 8 months ago

Closed 7 months ago

Last modified 7 months ago

#52431 closed defect (bug) (fixed)

Bundled themes: Add support for the font size option for the code block

Reported by: poena Owned by: ryelle
Milestone: 5.7 Priority: normal
Severity: normal Version: 5.7
Component: Bundled Theme Keywords: has-patch commit
Focuses: css Cc:

Description

Add support for the block editor font size option for the code block, added in 5.7 (Gutenberg 9.5)

The list block font size option added in 5.7 was also tested, no issues found.

Twenty Twenty-One:
The font size option does not work.
As far as I know, it is not currently possible to set the default value in the option
to the small font size that the theme currently uses.

Related code:
https://core.trac.wordpress.org/browser/trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/code/_editor.scss?rev=50173#L2

https://core.trac.wordpress.org/browser/trunk/src/wp-content/themes/twentytwentyone/assets/sass/05-blocks/code/_style.scss?rev=50173#L10

Twenty Twenty:
The option works.
The text size in the editor and the front does not match, but this is
true for other types of text not only the code block.

Twenty Nineteen:
The option works, there is a negligible text size difference between the editor and front.


Themes that are no longer "bundled" on new installs:

Twenty Seventeen:
The font size option does not work.
Related code:
https://core.trac.wordpress.org/browser/trunk/src/wp-content/themes/twentyseventeen/style.css#L540

Twenty Sixteen:
The font size option does not work on the front.
Related code:
https://core.trac.wordpress.org/browser/trunk/src/wp-content/themes/twentysixteen/css/blocks.css#L148

Twenty Fifteen:
The option works.

Twenty Fourteen:
The font size option does not work.
Related code:
https://core.trac.wordpress.org/browser/trunk/src/wp-content/themes/twentyfourteen/style.css#L208
and the RTL styles.

Attachments (3)

52431-tt1.patch (3.1 KB) - added by poena 8 months ago.
Twenty Twenty-One remove code block font-sizes
Font-size-selector-works.gif (343.6 KB) - added by paaljoachim 8 months ago.
Font size selector in 2021
52431-twenty-seventeen-sixteen-fourteen.patch (2.2 KB) - added by poena 7 months ago.
Update the CSS for the code block font size for Twenty Seventeen, Sixteen, Fourteen

Download all attachments as: .zip

Change History (17)

@poena
8 months ago

Twenty Twenty-One remove code block font-sizes

This ticket was mentioned in Slack in #core by hellofromtonya. View the logs.


8 months ago

#2 @paaljoachim
8 months ago

Testing:
Local site.
Chrome
Running Twenty Twenty One.
Gutenberg plugin: Not activated. No plugins activated.
WordPress: 5.6.1

New page/post.
Writing some text (paragraph block).
In sidebar settings. Change the Font size drop down to various sizes.
Error: Switching Font size does not affect the paragraph text.


Testing the patch.
No plugin activated.
Running version 5.7 alpha. http://localhost:8889/
Opening new or existing page/post.
Writing some text.
Changing the Font size drop down in the sidebar settings.

The patch works.

Last edited 8 months ago by paaljoachim (previous) (diff)

@paaljoachim
8 months ago

Font size selector in 2021

#3 @hellofromTonya
8 months ago

  • Keywords has-patch added

This ticket was mentioned in Slack in #core-themes by hellofromtonya. View the logs.


8 months ago

#5 @hellofromTonya
8 months ago

  • Keywords commit added

Marking TT1 patch for commit.

Patches will be coming 14-17 themes. We can commit those one-by-one once submitted and tested.

#6 @paaljoachim
8 months ago

Alrighty. Let me know and I will help with the tests.

#7 @peterwilsoncc
8 months ago

In 50260:

Twenty Twenty-One: Support font size option for code block.

Props poena, paaljoachim, hellofromTonya.
See #52431.

#8 @peterwilsoncc
8 months ago

  • Keywords needs-patch added; has-patch commit removed

TT1 has been committed, modifying keywords to account for incoming patches for other bundled themes.

@poena
7 months ago

Update the CSS for the code block font size for Twenty Seventeen, Sixteen, Fourteen

#9 @poena
7 months ago

  • Keywords has-patch needs-testing added; needs-patch removed

#10 @paaljoachim
7 months ago

http://localhost:8889/
(I also tested using a local site running WP 5.7 beta 2.)
Testing Font size controls in the Code block.

Twenty Fourteen.
Backend: Font size controls do not work.
Frontend: Font size controls do not work.

Applying patch to Twenty Fourteen:
Backend: Font size controls work.
Frontend: Font size controls work.
Good work!

---

Twenty Sixteen.
Backend: Font size controls work.
Frontend: Font size partly works. (I clearly noticed that Font size Huge did not work.)

Applying patch to Twenty Sixteen.
Backend: Font size controls work.
Frontend: Went through all the various options. Font size controls work nicely.
Good work!

---

Twenty Seventeen.
Backend: Font size controls work.
Frontend: Has the same problems as 2016 theme. (I clearly noticed that Font size Huge did not work.)

Applying patch to Twenty Seventeen:
Backend: Font size controls work.
Frontend: Went through all the various options. Font size controls work nicely.
Good work!

---

Twenty Nineteen (retesting).
Backend: Font size controls work.
Frontend: Font size controls work (was not able to detect anything that was wrong.)

---

Twenty Twenty (resting).
Backend: Font size controls work. (Font size drop down have different options than the other Twenty default theme drop downs.
Drop down options here are: Default, Small, Regular, Large, Larger, Custom.
Frontend: Font size controls work (was not able to detect anything that was wrong.)

---

Twenty Twenty One (retesting)
Backend: Font size controls work.
Font size drop down options: Default, Extra small, Small, Normal, Large, Extra Large, Huge, Gigantic, Custom.
Frontend: Font size controls work (was not able to detect anything that was wrong.)

Last edited 7 months ago by paaljoachim (previous) (diff)

#11 @peterwilsoncc
7 months ago

  • Keywords commit added; needs-testing removed

Thanks folks.

With @paaljoachim's testing of @poena's patch I'm putting the commit keyword back on this for the remaining themes.

This ticket was mentioned in Slack in #core by metalandcoffee. View the logs.


7 months ago

#13 @ryelle
7 months ago

  • Owner set to ryelle
  • Resolution set to fixed
  • Status changed from new to closed

In 50347:

Bundled Themes: Support font size option for code block.

Adds font-size support to Twenty Fourteen, Twenty Sixteen, and Twenty Seventeen.

Props poena, paaljoachim, peterwilsoncc.
Fixes #52431.

This ticket was mentioned in Slack in #core by monikarao. View the logs.


7 months ago

Note: See TracTickets for help on using tickets.