Making WordPress.org

Opened 19 months ago

Last modified 9 months ago

#6153 new defect (bug)

In accessibility page, Show Welcome Box issue.

Reported by: smit08's profile smit08 Owned by:
Milestone: Priority: low
Component: Make (Get Involved) / P2 Keywords: has-testing-info has-patch
Cc:

Description

Steps to reproduce:

  1. Visit the accessibility page (URL: https://make.wordpress.org/accessibility).
  2. Then click the Show Welcome Box. And view this in responsive device below 1000px.
  3. there is an issue of margin/padding between the <p> tag and Hide Welcome Box text.

Attachments (4)

Screenshot 2022-03-02 at 3.53.16 PM.png (531.4 KB) - added by smit08 19 months ago.
As you can clearly see the padding issue between the Hide Welcome Box text and <p> tag description.
#6153.patch (632 bytes) - added by kajalgohel 19 months ago.
#6153.2.patch (530 bytes) - added by hilayt24 19 months ago.
Top spacing is added to the content on the smaller screens.
6153.3.patch (551 bytes) - added by nidhidhandhukiya 19 months ago.
After applying this solution the spacing between the show welcome box and hide welcome box is looking same so might be that will be relevant for this issue.

Download all attachments as: .zip

Change History (10)

@smit08
19 months ago

As you can clearly see the padding issue between the Hide Welcome Box text and <p> tag description.

@kajalgohel
19 months ago

#1 @kajalgohel
19 months ago

  • Keywords has-patch added; needs-patch removed

#2 @hilayt24
19 months ago

Instead of decreasing the margin and padding of the button, It is preferable to add the margin-top to teh content on teh smaller devices from 1024px.

@hilayt24
19 months ago

Top spacing is added to the content on the smaller screens.

@nidhidhandhukiya
19 months ago

After applying this solution the spacing between the show welcome box and hide welcome box is looking same so might be that will be relevant for this issue.

#3 @dd32
19 months ago

  • Component changed from General to Make (Get Involved) / P2
  • Priority changed from normal to low

#4 @hilayt24
19 months ago

#6185 was marked as a duplicate.

#5 @vijayhardaha
19 months ago

I have some quick & small points to mention for review on similar pages if they are valid.

3 columns on .make-welcome has width:30% for min-width:1024px
if that's not intentionally then can we make those columns wider and fix them to parent wrapper using

@media screen and (min-width: 1024px) {
    .make-welcome .entry-content .column {
        width: 33.3333333333%;
        padding: 1.5%;
        float: left;
    }
}

.make-welcome .entry-content has max-width:940px; currently,
can't this section has max-width: 1024px; same as other sections and look properly aligned?

New block header using 889px for responsive while rest content after that using 876px.

https://make.wordpress.org/docs/style-guide/
handbook breadcrumbs look too close to the handbook container name. Try checking 900px
top: 7rem; working perfectly on all screens so far.

handbook breadcrumbs using left: 280px; currently,
but not vertically aligned with entry content. we can try using left: 25%; margin-left: 4rem;

#6 @bhaveshdesai13
9 months ago

#6664 was marked as a duplicate.

Note: See TracTickets for help on using tickets.