Skip to content

feat(css): Add large breakpoint right padding scale 5

Robert Hunt requested to merge add-large-breakpoint-right-padding-5 into master

What does this MR do?

While working on this bug I realised we don't have an lg variant for gl-pr-5.

This MR adds that variant so I can use it to resolve the visual bug in GitLab 😄

Specifically, applying some spacing to the end date area, when on larger screens. As noticed in Firefox/Safari the following happens currently at 1024px:

image

Adding this in resolves the spacing:

image

A full list of comparative screenshots can be found in the bugs GitLab MR: gitlab!47708 (merged) (spacing isn't identical but that's okay, as long as nothing is squished together 🙃)

Does this MR meet the acceptance criteria?

Conformity

  • Code review guidelines.
  • GitLab UI's contributing guidlines.
  • [-] If it changes a Pajamas-compliant component's look & feel, the MR has been reviewed by a UX designer.
  • [-] If it changes GitLab UI's documentation guidelines, the MR has been reviewed by a Technical Writer.
  • [-] If the MR changes a component's API, integration MR(s) have been opened in the following projects to ensure that the @gitlab/ui package can be upgraded quickly after the changes are released:
  • [-] Added the ~"component:*" label(s) if applicable.

Security

If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:

  • [-] Label as security and @ mention @gitlab-com/gl-security/appsec
  • [-] Security reports checked/validated by a reviewer from the AppSec team

Merge request reports