#61030 closed defect (bug) (fixed)
Reduce font-size of Credits page h1 element for smaller screens
Reported by: |
|
Owned by: |
|
---|---|---|---|
Milestone: | 6.6 | Priority: | normal |
Severity: | normal | Version: | 6.5 |
Component: | Help/About | Keywords: | has-patch |
Focuses: | ui, css, administration | Cc: |
Description (last modified by )
WordPress credits.php
page: font-size of the h1 tag is 4.5rem which is greater than the ideal font-size in the mobile responsive view and as a result of that it is breaking in the responsive view at media size of 355 px as we know that The headings should be around 1.96 times larger than your body text to create a sufficient contrast. so the body text size is of 1.4em which means the h1 tag font-size should be 1.4em * 1.96 = 2.74em. the screenshot of the issue is also attached as below
Solution :-
@media screen and (max-width: 960px) .about-php .about__header-title h1, .contribute-php .about__header-title h1, .credits-php .about__header-title h1, .freedoms-php .about__header-title h1, .privacy-php .about__header-title h1 { font-size: 2.74em; }
Attachments (2)
Change History (13)
#2
@
14 months ago
- Component changed from General to Help/About
- Summary changed from Font-size of the h1 tag need to be reduce in the mobile reposive view to Reduce font-size of h1 element for smaller screens
- Version changed from 6.5 to 6.4
Thanks for the report!
[56950] reduced the heading size for WordPress 6.4, but that did not edit the size for smaller viewports.
The larger fluid font size should be changed, too. The minimum value is half the maximum, which is less than 0.61 (see #58603).
clamp(2rem, 20vw - 9rem, 4rem)
#3
@
14 months ago
- Description modified (diff)
- Summary changed from Reduce font-size of h1 element for smaller screens to Reduce font-size of Credits page h1 element for smaller screens
- Version changed from 6.4 to 6.5
#4
@
14 months ago
- Focuses accessibility removed
- Keywords good-first-bug added
- Milestone changed from Awaiting Review to 6.6
- Owner set to audrasjb
- Status changed from new to accepted
Thanks for the ticket!
Adding good-first-bug
as it looks like a nice opportunity for people to make their very first Core contribution.
This ticket was mentioned in PR #6434 on WordPress/wordpress-develop by @khokansardar.
14 months ago
#5
- Keywords has-patch added; needs-patch removed
Reduced the heading size for credits page for smaller viewport.
Trac ticket: #61030
#6
@
14 months ago
- Keywords good-first-bug removed
Thanks for the PR @khokansardar, however please note that as mentioned in comment:4, this ticket was marked as good-first-bug
. These tickets are kept for new contributors so they can make their very first contribution.
Removing the workflow keyword since you didn't take it into account.
@audrasjb commented on PR #6434:
14 months ago
#9
committed in https://core.trac.wordpress.org/changeset/58060
#10
@
14 months ago
I apparently pasted the wrong example in comment:2, and my point was misunderstood. That value was not a recommendation. 2rem
divided by 4rem
equals 0.5
, which is less than the ratio used on #58603.
If both the size range and maximum are good as they are now, a minimum size of 2.5rem
would meet the ratio with 0.625:1
.
I also question whether the same value needs to be set in multiple places.
After applying css:-
https://tinyurl.com/2xpkwxut