Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

GH-101: Portal Nav Mobile - Link Style #239

Conversation

wesleyboar
Copy link
Member

@wesleyboar wesleyboar commented Jun 2, 2021

Overview

Make portal nav icon, text, and dropdown match design.¹

The location of portal nav in mobile has not moved, yet.

¹ See "Known Issues" 1.

Issues

Changes

  • New: Add CSS plugin test for nested @extend's.
  • New: Add & Use mixin "mobile button".
  • Fix: Limit large nav link padding to CMS links.
  • Fix: Limit nav icon spacing depending on nav and screen width.
  • New: Split icon styles between compressed and expanded.
  • New: Add missing markup for s-portal-nav sample HTML.

Testing

  1. Resize window to be narrow (≤991px).
  2. Load CMS.
  3. Ensure Portal Nav icon, when logged in and when logged out, match design.¹
  4. Ensure logged in toggle is on the right.
  5. Load Docs.
  6. Ensure Portal Nav icon, when logged in and when logged out, match design.¹²
  7. Ensure logged in toggle is on the right.
  8. Load Portal.
  9. Ensure Portal Nav icon, when logged in and when logged out, match design.¹
  10. Ensure logged in toggle is on the right.

¹ See "Known Issues" 1.
² Can not test logged out Portal Nav on Portal.

Notes

Known Issues

  1. Text of Portal nav is capitalized in dev, but not design.

    In an upcoming PR, the portal nav will be moved to the right of the navbar toggler. This layout suggests that the casing should be the same. If the casing should be different, it can be brought up as a bug in GH-101/FP-1458: Header Redesign #222. But right now, I am avoiding possibly superfluous deviation of style, because the code is already unwieldy.

- Limit large nav link padding to CMS links.
- Limit nav icon spacing depending on nav and screen width.
- Split icon styles between compressed and expanded.
- Add missing markup for `s-portal-nav` sample HTML.
- New CSS plugin test for nested @extend's.
- New mixin "mobile button".
- Use mixin for mobile button styles in header.
@wesleyboar wesleyboar linked an issue Jun 2, 2021 that may be closed by this pull request
@wesleyboar wesleyboar self-assigned this Jun 2, 2021
@wesleyboar wesleyboar merged commit 82bcdbf into task/GH-101-header-redesign Jun 2, 2021
@wesleyboar wesleyboar deleted the task/GH-101-header-redesign--portal-nav-mobile branch June 2, 2021 16:12
@wesleyboar wesleyboar mentioned this pull request Jun 2, 2021
26 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Header Redesign → FP-1458
1 participant