Skip to content

Math Block: Use monospaced font for LaTeX input#72557

Merged
t-hamano merged 5 commits into
WordPress:trunkfrom
ItsRoy69:fix-72542
Oct 24, 2025
Merged

Math Block: Use monospaced font for LaTeX input#72557
t-hamano merged 5 commits into
WordPress:trunkfrom
ItsRoy69:fix-72542

Conversation

@ItsRoy69
Copy link
Copy Markdown
Contributor

@ItsRoy69 ItsRoy69 commented Oct 22, 2025

What?

Adds a monospaced font to the LaTeX input field in the Math block.

Closes #72542

Why?

LaTeX syntax uses special characters, brackets, and precise spacing that are easier to read and edit in a monospaced font (similar to code editors). This improves the user experience when writing mathematical expressions.

How?

Added style={ { fontFamily: 'monospace' } } prop to the TextareaControl component in the Math block's edit component.

Testing Instructions

  1. Create or edit a Math block
  2. Click on the block to open the LaTeX input popover
  3. Verify that the input field now displays text in a monospaced font
  4. Type some LaTeX syntax (e.g., \frac{a}{b}, x^2 + y^2 = r^2) and confirm it's more readable

Checklist

  • My code is tested
  • My code follows the WordPress code style
  • My code has proper inline documentation
  • I've included developer documentation if appropriate

@ItsRoy69
Use monospaced font for LaTeX input
85cdddc 
Signed-off-by: ItsRoy69 <jyotirmoyroy649@gmail.com>
@github-actions
Copy link
Copy Markdown

github-actions Bot commented Oct 22, 2025 •
edited
Loading

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: ItsRoy69 <itsroy69@git.wordpress.org>
Co-authored-by: ellatrix <ellatrix@git.wordpress.org>
Co-authored-by: ntsekouras <ntsekouras@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

@github-actions github-actions Bot added the First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository label Oct 22, 2025
@github-actions
Copy link
Copy Markdown

github-actions Bot commented Oct 22, 2025

👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @ItsRoy69! In case you missed it, we'd love to have you join us in our Slack community.

If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information.

@t-hamano t-hamano added [Block] Math [Type] Enhancement A suggestion for improvement. labels Oct 22, 2025
@github-project-automation github-project-automation Bot moved this to 🔎 Needs Review in WordPress 6.9 Editor Tasks Oct 22, 2025
ellatrix
ellatrix reviewed Oct 22, 2025
View reviewed changes
Comment thread packages/block-library/src/math/edit.js Outdated
@ItsRoy69
fix the font declaration
3fd18a9 
Signed-off-by: ItsRoy69 <jyotirmoyroy649@gmail.com>
@ItsRoy69 ItsRoy69 requested a review from ellatrix October 23, 2025 02:47
ntsekouras
ntsekouras reviewed Oct 24, 2025
View reviewed changes
Comment thread packages/block-library/src/editor.scss
ntsekouras
ntsekouras reviewed Oct 24, 2025
View reviewed changes
Copy link
Copy Markdown
Contributor

@ntsekouras ntsekouras left a comment

Choose a reason for hiding this comment

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

Besides my comment, this looks good to me. Thank you!

t-hamano
t-hamano reviewed Oct 24, 2025
View reviewed changes
Comment thread packages/block-library/src/math/editor.scss Outdated
@ItsRoy69
fixed by removing selectors
62ccacc 
Signed-off-by: ItsRoy69 <jyotirmoyroy649@gmail.com>
t-hamano
t-hamano approved these changes Oct 24, 2025
View reviewed changes
Copy link
Copy Markdown
Contributor

@t-hamano t-hamano left a comment

Choose a reason for hiding this comment

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

LGTM! If you are interested, you might be able to apply similar improvements not only to the Math "blocks" but also to the Math "formatting" as a separate PR.

gutenberg/packages/format-library/src/math/index.js

Lines 82 to 91 in efb328b

<TextControl
__nextHasNoMarginBottom
__next40pxDefaultSize
hideLabelFromVision
label={ __( 'LaTeX math syntax' ) }
value={ latex }
onChange={ handleLatexChange }
placeholder={ __( 'e.g., x^2, \\frac{a}{b}' ) }
autoComplete="off"
/>

@t-hamano
Copy link
Copy Markdown
Contributor

t-hamano commented Oct 24, 2025

This pull request is an enhancement, but it's a very small change, and I believe it's worth backporting to 6.9.

@t-hamano t-hamano merged commit 9ad9971 into WordPress:trunk Oct 24, 2025
42 of 43 checks passed
@github-project-automation github-project-automation Bot moved this from 🔎 Needs Review to ✅ Done in WordPress 6.9 Editor Tasks Oct 24, 2025
@github-actions github-actions Bot added this to the Gutenberg 22.0 milestone Oct 24, 2025
gutenbergplugin pushed a commit that referenced this pull request Oct 24, 2025
@ItsRoy69 @ellatrix
@ntsekouras @Mamaduka @t-hamano @gutenbergplugin
Math Block: Use monospaced font for LaTeX input (#72557)
287c60b 
* Use monospaced font for LaTeX input

Signed-off-by: ItsRoy69 <jyotirmoyroy649@gmail.com>

* fix the font declaration

Signed-off-by: ItsRoy69 <jyotirmoyroy649@gmail.com>

* fix the font declaration

Signed-off-by: ItsRoy69 <jyotirmoyroy649@gmail.com>

* fixed by removing selectors

Signed-off-by: ItsRoy69 <jyotirmoyroy649@gmail.com>

---------

Co-authored-by: ItsRoy69 <itsroy69@git.wordpress.org>
Co-authored-by: ellatrix <ellatrix@git.wordpress.org>
Co-authored-by: ntsekouras <ntsekouras@git.wordpress.org>
Co-authored-by: Mamaduka <mamaduka@git.wordpress.org>
Co-authored-by: t-hamano <wildworks@git.wordpress.org>
@github-actions github-actions Bot added Backported to WP Core Pull request that has been successfully merged into WP Core and removed Backport to WP 6.9 Beta/RC labels Oct 24, 2025
@github-actions
Copy link
Copy Markdown

github-actions Bot commented Oct 24, 2025

I just cherry-picked this PR to the wp/6.9 branch to get it included in the next release: 287c60b

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

@Mamaduka Mamaduka Mamaduka left review comments

@t-hamano t-hamano t-hamano approved these changes

@ajitbohra ajitbohra Awaiting requested review from ajitbohra ajitbohra is a code owner

@fabiankaegy fabiankaegy Awaiting requested review from fabiankaegy fabiankaegy is a code owner

@ellatrix ellatrix Awaiting requested review from ellatrix

@ntsekouras ntsekouras Awaiting requested review from ntsekouras

Assignees

No one assigned

Labels

Backported to WP Core Pull request that has been successfully merged into WP Core [Block] Math First-time Contributor Pull request opened by a first-time contributor to Gutenberg repository [Type] Enhancement A suggestion for improvement.

Projects

WordPress 6.9 Editor Tasks
Status: ✅ Done

Milestone

Gutenberg 22.0

Development

Successfully merging this pull request may close these issues.

Math block: use a monospaced font for LaTeX input

5 participants

@ItsRoy69 @t-hamano @Mamaduka @ellatrix @ntsekouras