WordPress.org

Make WordPress Core

Opened 3 years ago

Closed 3 years ago

Last modified 3 years ago

#43852 closed defect (bug) (fixed)

Fix spacing on responsive for Use This Page button in Privacy Tools

Reported by: PressTigers Owned by: desrosj
Milestone: 4.9.6 Priority: normal
Severity: normal Version: 5.1
Component: Privacy Keywords: gdpr has-patch has-screenshots ux-feedback commit
Focuses: ui, administration Cc:

Description

Hi,

On Privacy page, page drop down and button should be properly aligned from top bottom on the small devices.

Also attached screenshot. Please have a look.

Thanks & Regards,
PressTigers

Attachments (10)

Privacy Page - GDPR.png (31.5 KB) - added by PressTigers 3 years ago.
Padding issue needs to be fixed
43852.jpg (38.4 KB) - added by xkon 3 years ago.
43852.diff (426 bytes) - added by xkon 3 years ago.
Dropdown Page Alignment.png (24.2 KB) - added by PressTigers 3 years ago.
Alignment issue for Dropdown page and Use This Page button
43852-1.diff (493 bytes) - added by PressTigers 3 years ago.
Left Alignment Fix
Alignment Fix.png (22.5 KB) - added by PressTigers 3 years ago.
Left alignment looks better now
43852-2.diff (515 bytes) - added by PressTigers 3 years ago.
Fix spacing
latest_preview.jpg (36.9 KB) - added by xkon 3 years ago.
43852.2.diff (461 bytes) - added by desrosj 3 years ago.
Screen Shot 2018-04-28 at 9.50.36 AM.png (209.1 KB) - added by desrosj 3 years ago.

Download all attachments as: .zip

Change History (40)

@PressTigers
3 years ago

Padding issue needs to be fixed

#1 @PressTigers
3 years ago

  • Summary changed from Privacy page needs to be designed on small devices to Privacy page needs to be fixed on small devices

#2 @abdullahramzan
3 years ago

  • Keywords gdpr added

@xkon
3 years ago

@xkon
3 years ago

#3 @xkon
3 years ago

Hey @PressTigers welcome to trac and thank you for noticing this! Also thanks @abdullahramzan for tagging gdpr here :).

43852.diff adds a margin in max-width: 782px screens as seen in 43852.jpg

#4 @xkon
3 years ago

  • Keywords has-patch has-screenshots added; needs-patch removed
  • Summary changed from Privacy page needs to be fixed on small devices to Fix spacing on responsive for Use This Page button in Privacy Tools

#5 @PressTigers
3 years ago

Thanks @xkon ,

Tested the patch. It looks good now. But do you thing there should be some space between the drop-down page and the text "Either select an existing page:".

Best Regards,
PressTigers

#6 @PressTigers
3 years ago

Page drop-down and button should also be aligned. Please review the attached screenshot.

I will submit the patch for this fix soon.

Thanks

@PressTigers
3 years ago

Alignment issue for Dropdown page and Use This Page button

@PressTigers
3 years ago

Left Alignment Fix

@PressTigers
3 years ago

Left alignment looks better now

#7 @abdullahramzan
3 years ago

  • Keywords ux-feedback added

Tested the patch, it works fine for me.

@SergeyBiryukov can you please review the patch updated by @PressTigers

Thanks

#8 @xkon
3 years ago

@PressTigers thanks for the update & you're correct on the spacing between Either select an existing page and the input as well. Usually all forms tend to be inside <tables> so the <td> are giving a 4px top spacing as far as I could check (I was checking the Settings -> General page for example).

You want to update the patch and check that as well? No need to add tables of course just a little bit of spacing there to make it look even with the rest of the Admin.

#9 @PressTigers
3 years ago

@xkon ,

Yeah, I will update the patch soon.

Regards,

This ticket was mentioned in Slack in #core by abdullahramzan. View the logs.


3 years ago

#11 @desrosj
3 years ago

  • Milestone changed from Awaiting Review to 4.9.6

@PressTigers
3 years ago

Fix spacing

#12 @PressTigers
3 years ago

  • Keywords needs-testing added

@xkon ,

Can you please review the patch https://core.trac.wordpress.org/attachment/ticket/43852/43852-2.diff? It looks good now.

@xkon
3 years ago

#13 @xkon
3 years ago

  • Keywords needs-testing removed

@PressTigers yup it looks good, thank you!

@desrosj 43852-2.diff addresses some padding issues and fixes them as seen in latest_preview.jpg . Could we get this in asap as it's a small change and we have 2-3 more tickets for this screen as well to avoid doing the same fixes?

This ticket was mentioned in Slack in #gdpr-compliance by desrosj. View the logs.


3 years ago

#15 @desrosj
3 years ago

  • Owner set to desrosj

@desrosj
3 years ago

#16 @desrosj
3 years ago

  • Keywords commit added

The screen still feels like the spacing is inconsistent to me (which it is slightly). In 43852.2.diff I applied the same margin to both elements and it feels a bit better.

#17 @xkon
3 years ago

Looks good @desrosj !

#18 @abdullahramzan
3 years ago

@desrosj ,

I think "Use This Page" button margin-top should be 10px.

#19 @desrosj
3 years ago

@abdullahramzan are you not seeing that when testing the most recent patch (Shot 2018-04-28 at 9.50.36 AM.png)? When the most recent patch is applied, I am seeing the correct margin applied: https://cloudup.com/cxVWpXJeJ8c.

This ticket was mentioned in Slack in #gdpr-compliance by desrosj. View the logs.


3 years ago

#21 @xkon
3 years ago

After bug scrubs re-tested and this looks ok to me @desrosj just like your screenshot.

#22 @abdullahramzan
3 years ago

@desrosj @xkon,

Yeah, it looks good to me. The major concern is spacing should be equal between the Select input and "Use This Page" button and the space between the "Use This Page" button and Create New Page. Maybe I am wrong.

This ticket was mentioned in Slack in #core by abdullahramzan. View the logs.


3 years ago

This ticket was mentioned in Slack in #core by desrosj. View the logs.


3 years ago

This ticket was mentioned in Slack in #gdpr-compliance by allendav. View the logs.


3 years ago

#26 @melchoyce
3 years ago

@desrosj Your screenshot looks good to me!

#27 @PressTigers
3 years ago

@desrosj, @melchoyce ,

Tested! Looks good.

#28 @azaozz
3 years ago

  • Resolution set to fixed
  • Status changed from assigned to closed

In 43193:

Privacy: fix spacing on small screens for the Use This Page button in Privacy Tools.

Props PressTigers, desrosj.
Fixes #43852.

#29 @azaozz
3 years ago

In 43194:

Privacy: fix spacing on small screens for the Use This Page button in Privacy Tools.

Props PressTigers, desrosj.
Merges [43193] to the 4.9 branch.
Fixes #43852.

#30 @desrosj
3 years ago

  • Component changed from General to Privacy

Moving to the new Privacy component.

Note: See TracTickets for help on using tickets.