WordPress.org

Make WordPress Core

Opened 6 months ago

Closed 2 months ago

#49137 closed defect (bug) (invalid)

Twenty Twenty: When widget titles are labels, font is too small

Reported by: zoonini Owned by:
Milestone: Priority: normal
Severity: normal Version:
Component: Bundled Theme Keywords: close
Focuses: css Cc:

Description

When a widget title is a label element, the font size is too small, and inconsistent with other widget titles.

To replicate:

  1. Add a widget to one of the footer widget areas that uses a label element as the title. Example: [Jetpack subscriptions widget](https://jetpack.com/support/subscriptions/)
  2. View site on the front end

Result
The widget title is too small.

Expected
The widget title size should match the other widget titles.

Expected
I used the following custom CSS to work around the issue:

.widget-title label {
  font-size: 4rem;
  }
}

Before custom CSS fix

https://cldup.com/Bz3qiyd76X-3000x3000.png

After custom CSS fix

https://cldup.com/A0vYzw6CBU-3000x3000.png

Can be seen in action in the footer of my personal site: https://kpresner.com/

Change History (7)

#1 @joyously
6 months ago

Expected
The widget title size should match the other widget titles.

Why would you expect this widget title to match others? The plugin chose to make it different for a reason. There's no sense in making themes try to match what all the plugins can do.

#2 @zoonini
6 months ago

Why would you expect this widget title to match others?

I tested the same widget in Twenty Seventeen, Twenty Sixteen, and Twenty Fifteen, and the widget title's size matches that of others widgets in those themes. This issue looks like an oversight in this specific theme rather than any intentional design decision in the plugin.

#3 @zoonini
6 months ago

It's also possible that other plugins use a label element in widget titles as well, and will experience this same visual issue.

#4 @SergeyBiryukov
6 months ago

  • Keywords needs-patch added

#5 follow-up: @samful
2 months ago

  • Focuses css added
  • Keywords 2nd-opinion added

Can someone look at the function "render_widget_title" in this file: https://github.com/Automattic/jetpack/blob/master/modules/subscriptions/views.php#L120 and tell me if this ticket should still go ahead or not?

It looks like this issue will only occur on wordpress.com to me and am unsure if putting this into Core will help many people or is the right thing to do. I'm more interested in why JetPack is using the label tag on WordPress.com only...

edit: clearly there is an issue here, but it would be nice to know why automattic are doing this and if every wordpress theme should be fixing this issue for them, or if the jetpack widgets themselves need to be changed themselves.

Last edited 2 months ago by samful (previous) (diff)

#6 in reply to: ↑ 5 @jeherve
2 months ago

  • Keywords close added; needs-patch 2nd-opinion removed

Replying to samful:

I am unsure if putting this into Core will help many people or is the right thing to do.

I would agree.

I would assume that few plugins add label tags inside widget titles. It may consequently be best to fix this on WordPress.com, where the widget is built. We will take care of this here.

In the future, if the same problem is reported by other plugin authors and it turns out more use label tags in widget titles, we can revisit and fix this in Twenty Twenty itself.

For now, I would suggest closing this issue.

#7 @ianbelanger
2 months ago

  • Milestone Awaiting Review deleted
  • Resolution set to invalid
  • Status changed from new to closed

You are correct @samful and @jeherve. I'm closing this ticket as invalid.

Note: See TracTickets for help on using tickets.