Olivero: Toolbar is overlapping header in mobile when admin toolbar search module is enabled.

Adding screenshot for better understanding.

CommentFileSizeAuthor
#15 header overlap.mp48.23 MBHarish1688
#14 not-reproduce-overlaping-issue.png72.47 KBakshay kashyap
#13 drupal-10.1.x-toolbar-overlap-not-reproduce.png154.24 KBakshay kashyap
#12 Screenshot 2023-01-25 at 12.10.42 PM.png207.07 KBgauravvvv
#8 Before patch #4.png16.19 KByashingole
#8 After patch #4.png17.95 KByashingole
#6 3213837-after_patch.png28.78 KBabhijith s
#4 screenshot-13-05-2022.png168.81 KBPreeti-chawla
#4 overlapping-header-in-mobile-admin-toolbar-search-3213837-4.patch1.57 KBPreeti-chawla
Screenshot 2021-05-13 at 20.51.56.png36.29 KBgauravvvv

Comments

Gauravmahlawat created an issue. See original summary.

Version: 9.3.x-dev » 9.4.x-dev

Drupal 9.3.0-rc1 was released on November 26, 2021, which means new developments and disruptive changes should now be targeted for the 9.4.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

cilefen’s picture

cilefen commented
Category: Support request » Bug report

I think this was intended to have been a bug report.

Preeti-chawla’s picture

Preeti-chawla commented
Status: Active » Needs review
StatusFileSize
new overlapping-header-in-mobile-admin-toolbar-search-3213837-4.patch1.57 KB
new screenshot-13-05-2022.png168.81 KB

I have created patch for overlapping the header by admin toolbar search in Mobile for Olivero theme

Version: 9.4.x-dev » 9.5.x-dev

Drupal 9.4.0-alpha1 was released on May 6, 2022, which means new developments and disruptive changes should now be targeted for the 9.5.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

abhijith s’s picture

abhijith s commented
StatusFileSize
new 3213837-after_patch.png28.78 KB

Applied patch #4 on 9.5.x and it fixes the admin search toolbar overlapping with header issue.

After patch:
after

RTBC +1

yashingole’s picture

yashingole commented
Assigned: Unassigned » yashingole
yashingole’s picture

yashingole commented
Assigned: yashingole » Unassigned
Status: Needs review » Reviewed & tested by the community
StatusFileSize
new After patch #4.png17.95 KB
new Before patch #4.png16.19 KB

Verified and tested patch #4 on Drupal 9.5.x-dev. Patch applied successfully and looks good to me.
Testing steps:
1. install 9.5
2. Install Admin Modules.
3. Open on mobile.
4. Open Admin Search bar.
5. Observe that the toolbar overlaps the header.
6. apply the patch.
7. Observe that the toolbar is not overlapping the header.
Testing Result:
1. Toolbar search is not overlapping the header after applying the patch. Screenshots are attached for reference:
Screenshots are attached for reference:
Can be move to RTBC

lauriii’s picture

lauriii
he/him
Primary language Finnish
Location Finland
commented
Status: Reviewed & tested by the community » Needs work

Does this happen on Drupal 10.0.x or is this specific to 9.5.x? If this happens on 10.0.x too, I think the problem is that the module does not take use of displace API.

lauriii’s picture

lauriii
he/him
Primary language Finnish
Location Finland
commented
Status: Needs work » Postponed (maintainer needs more info)

Version: 9.5.x-dev » 10.1.x-dev

Drupal 9.5.0-beta2 and Drupal 10.0.0-beta2 were released on September 29, 2022, which means new developments and disruptive changes should now be targeted for the 10.1.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

gauravvvv’s picture

gauravvvv commented
Issue summary: View changes
Status: Postponed (maintainer needs more info) » Active
StatusFileSize
new Screenshot 2023-01-25 at 12.10.42 PM.png207.07 KB

This is still happening in 10.0.x.

Screenshot:

akshay kashyap’s picture

akshay kashyap commented
StatusFileSize
new drupal-10.1.x-toolbar-overlap-not-reproduce.png154.24 KB

@Gauravvvv This is running fine in Drupal 10.1.x. I am not able to reproduce it in Drupal 10.1.x. I have attached the screenshot for reference please check.

akshay kashyap’s picture

akshay kashyap commented
StatusFileSize
new not-reproduce-overlaping-issue.png72.47 KB
Harish1688’s picture

Harish1688 commented
StatusFileSize
new header overlap.mp48.23 MB

Hi Gauravvvv,

As per your comment #12 , Tried to reproduce the issue on local with version 10.0.x. and 'drupal/admin_toolbar:^3.3', but not get any header overlapping issue.

attached a video.
can you please brief more the steps to reproduce it.

Testing Steps:
1. Install the Drupal 10.0.x version.
2. Install and set Admin toolbar.
3. issue not found.

akshay kashyap’s picture

akshay kashyap commented
Status: Active » Needs review
gauravvvv’s picture

gauravvvv commented
Status: Needs review » Closed (outdated)

This is happening when we have more icons in the admin toolbar and it goes into two lines, as you can see in the screenshot I added into the issue summary. This is not happening in 10.x. So we can close it.