From bb5f77703ca8682ec6261cc127dc515436816da0 Mon Sep 17 00:00:00 2001
From: Ashley Harrison <ashley.harrison@grafana.com>
Date: Tue, 19 Apr 2022 10:31:59 +0100
Subject: [PATCH] prevent horizontal scrollbar on firefox during expand
 animation (#47758)

---
 public/app/core/components/NavBar/Next/NavBarMenu.tsx | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/public/app/core/components/NavBar/Next/NavBarMenu.tsx b/public/app/core/components/NavBar/Next/NavBarMenu.tsx
index 224e32ff66e..00e40a6e5f1 100644
--- a/public/app/core/components/NavBar/Next/NavBarMenu.tsx
+++ b/public/app/core/components/NavBar/Next/NavBarMenu.tsx
@@ -147,6 +147,10 @@ const getAnimStyles = (theme: GrafanaTheme2, animationDuration: number) => {
   const overlayTransition = {
     ...commonTransition,
     transitionProperty: 'background-color, box-shadow, width',
+    // this is needed to prevent a horizontal scrollbar during the animation on firefox
+    '.scrollbar-view': {
+      overflow: 'hidden !important',
+    },
   };
 
   const backdropTransition = {