WordPress.org

Make WordPress Core

Opened 2 years ago

Last modified 3 months ago

#49008 new defect (bug)

Twenty Twenty: Design issue in Customizer on iPad

Reported by: sumitsingh Owned by:
Milestone: Awaiting Review Priority: normal
Severity: normal Version: 5.3.1
Component: Bundled Theme Keywords: has-patch has-screenshots
Focuses: ui, css, administration Cc:

Description

Hi,

Design issue in customize.php on Twenty Twenty theme.

For more information sees mention screenshot.

Thanks

Attachments (3)

Customize wpfdemo – Just another WordPress site.png​ (73.0 KB) - added by sumitsingh 2 years ago.
Bug screenshot file
49008.patch​ (964 bytes) - added by sabernhardt 3 months ago.
Twenty Twenty at iPad size with adjustment to section-inner class width
2020-customizer-preview-ipad-size-with-patch.png​ (105.5 KB) - added by sabernhardt 3 months ago.

Download all attachments as: .zip

Change History (6)

@sumitsingh
2 years ago

Bug screenshot file

#1 @sumitsingh
2 years ago

I have also a solution. changed width: calc(100% - 4rem); to width: calc(100% - 8rem); in wp-content/themes/twentytwenty/style.css

.section-inner {

margin-left: auto;
margin-right: auto;
max-width: 120rem;
width: calc(100% - 8rem);

}

#2 @SergeyBiryukov
2 years ago

  • Component changed from Customize to Bundled Theme
  • Summary changed from Design issue in Ipad to Twenty Twenty: Design issue in Customizer on iPad

@sabernhardt
3 months ago

Twenty Twenty at iPad size with adjustment to section-inner class width

@sabernhardt
3 months ago

#3 @sabernhardt
3 months ago

  • Keywords has-patch has-screenshots added

Related: #46969 shows the same issue in Twenty Nineteen, and buttons can be cut off even more in Twenty Twenty-One. Ideally, this could be fixed in the Customizer, though I'm not convinced it can.

Twenty Fourteen and Twenty Seventeen already adjust the site title and/or edit buttons.

So 49008.patch​ reduces the width of Twenty Twenty's section-inner class in the Customizer to make space for the footer widgets' Edit buttons, as recommended above.

Note: See TracTickets for help on using tickets.