WordPress.org
Get WordPress

Make WordPress Core

Opened 6 weeks ago

Closed 5 weeks ago

Last modified 5 weeks ago

#61808 closed defect (bug) (fixed)

Twenty Twelve: Code Block font family is different in the editor

Reported by: pitamdey's profile pitamdey Owned by: karmatosed's profile karmatosed
Milestone: 6.7 Priority: normal
Severity: normal Version: 6.4
Component: Bundled Theme Keywords: has-screenshots has-patch needs-testing commit
Focuses: css Cc:

Description

In Twenty Twelve Theme, the Code block have a different font family in front-end and editor side.

I have checked the code and found that font-family: inherit is being applied on the editor side due to which issue may arise

Attachments (4)

Screenshot 2024-08-02 at 12.36.03 PM.png​ (170.1 KB) - added by pitamdey 6 weeks ago.
Editor View
Screenshot 2024-08-02 at 12.36.48 PM.png​ (197.2 KB) - added by pitamdey 6 weeks ago.
Frontend View
61808.patch​ (463 bytes) - added by pitamdey 6 weeks ago.
After applying this solution the issue is resolved
61808.1.patch​ (455 bytes) - added by sabernhardt 6 weeks ago.
sets font on .wp-block-code container

Download all attachments as: .zip

Change History (10)

@pitamdey
6 weeks ago

Editor View

@pitamdey
6 weeks ago

Frontend View

@pitamdey
6 weeks ago

After applying this solution the issue is resolved

@sabernhardt
6 weeks ago

sets font on .wp-block-code container

#1 @sabernhardt
6 weeks ago

  • Focuses css added
  • Keywords has-patch added
  • Milestone changed from Awaiting Review to Future Release
  • Summary changed from Twenty Twelve : Code Block Font family is different in frontend and editor side to Twenty Twelve: Code Block font family is different in the editor
  • Version set to 6.4

The iframe editor overrules the theme's font with Menlo (if available) in block-library/theme.css.

The inherit property for the code element would work if the correct font is set on .wp-block-code.

Last edited 5 weeks ago by sabernhardt (previous) (diff)

#2 @karmatosed
5 weeks ago

I am going to apply the testing keyword to get that happening and see about moving this through. Thank you everyone.

#3 @karmatosed
5 weeks ago

  • Keywords needs-testing added
  • Owner set to karmatosed
  • Status changed from new to assigned

#4 @karmatosed
5 weeks ago

  • Keywords commit added

In testing I can confirm that this fixes the issue and now the font family is the same on both editors. I am going to progress this to commit. Thank you everyone.

#5 @karmatosed
5 weeks ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 58882:

Twenty Twelve: Fixes Code block font family difference in editors.

The Code block font family was different in the front-end and the editor. This resolves the overruling in the iframe editor.

Props pitamdey, sabernhardt.
Fixes #61808.

#6 @karmatosed
5 weeks ago

  • Milestone changed from Future Release to 6.7
Note: See TracTickets for help on using tickets.