Making WordPress.org

Opened 3 months ago

Last modified 11 days ago

#7706 new defect (bug)

Tours link lacks padding on smaller screens

Reported by: pkbhatt's profile pkbhatt Owned by:
Milestone: Priority: normal
Component: Make (Get Involved) / P2 Keywords:
Cc:

Description

open meta home page https://make.wordpress.org/meta/
check the screen to 320px width
Tour word sticks to left side without any spaces.

Change History (1)

#1 @sabernhardt
11 days ago

  • Component changed from General to Make (Get Involved) / P2
  • Milestone Q1 deleted
  • Summary changed from No margin on left side in title to Tours link lacks padding on smaller screens

Admin bar styles remove padding from links, including the Tours link, at smaller screen sizes.

@media screen and (max-width: 782px) {
  #wpadminbar .quicklinks .ab-empty-item, #wpadminbar .quicklinks > ul > li > a {
    padding: 0;
  }
}

The Login and Register links have special overrides on Make - Meta pages.

/* printed inline */
@media screen and (max-width: 782px) {
  #wpadminbar li#wp-admin-bar-log-in a, #wpadminbar li#wp-admin-bar-register a {
    padding: 0 8px;
  }
}
/* from https://make.wordpress.org/meta/wp-content/mu-plugins/pub-sync/blocks/global-header-footer/build/style.css?ver=1725916313 */
@media screen and (max-width: 782px) {
  #wpadminbar li#wp-admin-bar-log-in a, #wpadminbar li#wp-admin-bar-register a {
    padding-left: .5em;
    padding-right: .5em;
  }
}

The simplest fix might be adding to the Tour plugin styles (note the child combinator >).

@media screen and (max-width: 782px) {
  #wpadminbar li#wp-admin-bar-tour-list > a {
    padding: 0 8px;
  }
}
Note: See TracTickets for help on using tickets.