Problem/Motivation

With the navigation module, the skip link element of olivero is a bit too short. It's not broken, just not aligned as before.

Steps to reproduce

  1. Use tab to get focus on "Skip to main content" in Olivero theme
  2. On screen sizes above 1570px, skip link is not covering full width
  3. See screenshot for reference.

Proposed resolution

Update the max with of "Skip to main content"

Remaining tasks

User interface changes

Before Patch

After patch

API changes

Data model changes

Release notes snippet

CommentFileSizeAuthor
#10 Screenshot 2024-05-07 at 7.23.54 PM.png133.46 KBgauravvvv
#6 Screenshot 2024-05-06 at 11.34.41 AM.png142.24 KBgauravvvv
Capture d’écran du 2024-05-05 08-32-20.png58.55 KBnod_

Issue fork drupal-3445274

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

About issue forks

Comments

nod_ created an issue. See original summary.

Gauravvvv made their first commit to this issue’s fork.

Gauravvvv opened merge request !7921

Gauravvvv changed the visibility of the branch 3445274-navigation-module-offsets to hidden.

Gauravvvv changed the visibility of the branch 3445274-navigation-module-offsets to active.

gauravvvv’s picture

gauravvvv commented
Status: Active » Needs review
StatusFileSize
new Screenshot 2024-05-06 at 11.34.41 AM.png142.24 KB

After patch

nod_’s picture

nod_
Primary language French
Location Lille
commented
Status: Needs review » Needs work
gauravvvv’s picture

gauravvvv commented
Status: Needs work » Needs review
smustgrave’s picture

smustgrave commented
Status: Needs review » Needs work
Issue tags: +Needs screenshots

As a visual issue lets add before/after screenshots to the issue summary.

gauravvvv’s picture

gauravvvv commented
Issue summary: View changes
Status: Needs work » Needs review
Issue tags: -Needs screenshots
StatusFileSize
new Screenshot 2024-05-07 at 7.23.54 PM.png133.46 KB

I have added before and after patch screenshot in issue summary.

smustgrave’s picture

smustgrave commented
Status: Needs review » Needs work

Should be good practice

But before/after should be under User interface section

Also noticed that steps to reproduce and proposed resolution are empty. Other sections are probably fine.

gauravvvv’s picture

gauravvvv commented
Issue summary: View changes
Status: Needs work » Needs review
smustgrave’s picture

smustgrave commented
Status: Needs review » Reviewed & tested by the community
nod_’s picture

nod_
Primary language French
Location Lille
commented
Status: Reviewed & tested by the community » Needs work

This needs a default value for the css variable. If displace is not used on the page (no toolbar or navigation module) the skip link takes the whole width instead of the body width

gauravvvv’s picture

gauravvvv commented
Status: Needs work » Needs review
smustgrave’s picture

smustgrave commented
Status: Needs review » Reviewed & tested by the community
Issue tags: +Needs Review Queue Initiative

Default was added

  • nod_ committed cc27b4df on 10.3.x 
    Issue #3445274 by Gauravvvv, smustgrave: Navigation module offsets the...

  • nod_ committed 26aafb10 on 10.4.x 
    Issue #3445274 by Gauravvvv, smustgrave: Navigation module offsets the...

  • nod_ committed ccc368e0 on 11.0.x 
    Issue #3445274 by Gauravvvv, smustgrave: Navigation module offsets the...

  • nod_ committed 7ac4979e on 11.x 
    Issue #3445274 by Gauravvvv, smustgrave: Navigation module offsets the...

nod_ closed merge request !7921

nod_’s picture

nod_
Primary language French
Location Lille
commented
Version: 11.0.x-dev » 10.3.x-dev
Status: Reviewed & tested by the community » Fixed

Committed and pushed 7ac4979e2e to 11.x and ccc368e015 to 11.0.x and 26aafb10e3 to 10.4.x and cc27b4df99 to 10.3.x. Thanks!

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.