Problem/Motivation

core/lib/Drupal/Component/Render/FormattableMarkup.php::placeholderFormat() is using <em class="placeholder"> for "%" replacement in strings.

The "placeholder" class interfere with Bootstrap default CSS.

I already did some preprocess in src/HookHandler/PreprocessStatusMessages.php to remove the placeholder class but it is specific to the 'status_messages' theme key.

And placeholder replacement can happen anywhere.

Steps to reproduce

Install Gin Toolbar and/or use Layout Builder.

Proposed resolution

Either alter FormattableMarkup to remove the class directly here. I am not sure it will be possible as it is a static method called directly and not a service.

Also we only need to change one line in long method, not possible to override only one small method.

Other solution will be to provide an override of Bootstrap CSS to ensure its ".placeholder" CSS does not apply to em.placeholder.

Remaining tasks

Try either solutions.

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

Grimreaper created an issue. See original summary.

grimreaper’s picture

Assigned: Unassigned » grimreaper
grimreaper’s picture

Not possible to change the FormattableMarkup.

So I will add:

em.placeholder {
  all: revert;
}

I will try to do the MR in the week.

grimreaper’s picture

Title: Remove placeholder class in FormattableMarkup » Remove placeholder class to affect em
grimreaper’s picture

Title: Remove placeholder class to affect em » Prevent placeholder class to affect em

Update title.

grimreaper’s picture

Assigned: grimreaper » pdureau
Status: Active » Needs review

  • Grimreaper committed 5178485 on 5.0.x
    Issue #3314419 by Grimreaper: Prevent placeholder class to affect em
    

grimreaper’s picture

Assigned: pdureau » Unassigned
Status: Needs review » Fixed

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.