From 0c4e65d2c5adc1f67db8e990275eec0de2f23052 Mon Sep 17 00:00:00 2001
From: magda <stenius.mimmy@gmail.com>
Date: Wed, 12 Aug 2020 08:50:40 +0300
Subject: [PATCH 1/2] Make global tooltip styles class-scoped

- Change the scope of styles specific to `.dynamic-buttons` to that class only (introed in https://github.com/jupyter/notebook/pull/4729)
- Drop the width style from tooltips since `display: inline` makes it have no effect

Fixes #5670
---
 notebook/static/tree/less/tree.less | 82 ++++++++++++++---------------
 1 file changed, 41 insertions(+), 41 deletions(-)

diff --git a/notebook/static/tree/less/tree.less b/notebook/static/tree/less/tree.less
index 030aeaacb..e09762412 100644
--- a/notebook/static/tree/less/tree.less
+++ b/notebook/static/tree/less/tree.less
@@ -414,46 +414,46 @@ ul#new-menu {
 }
 
 //TO show tooltips via keyboard for"Duplicate","View","Rename", "Download", "Shutdown", "Edit","Move", "Delete" buttons.
+.dynamic-buttons {
+    .visually-hidden {
+        clip-path: inset(100%);
+        clip: rect(1px, 1px, 1px, 1px);
+        height: 1px;
+        overflow: hidden;
+        position: absolute;
+        white-space: nowrap;
+        width: 1px;
+    }
+
+    button:focus + [role="tooltip"] {
+        visibility: visible;
+        opacity: 1;
+    }
 
-.visually-hidden {
-  clip-path: inset(100%);
-  clip: rect(1px, 1px, 1px, 1px);
-  height: 1px;
-  overflow: hidden;
-  position: absolute;
-  white-space: nowrap;
-  width: 1px;
-}
-
-button:focus + [role="tooltip"] {  
-visibility: visible;
- opacity: 1;
-}
-
-.button-and-tooltip {
-  position: relative;
-  display: inline-block;
-}
-
-[role="tooltip"] {
-/* Position the tooltip */
-position: absolute;
-top:70%;
-display:inline;
-//--------------
-visibility: hidden;
-width: 100px;
-background-color: #F0EFEF;
-color: #080808;
-text-align: center;
-padding: 3px;
-outline-color: grey;
-outline-offset: -2px;
-outline-style: auto;
-outline-width:1px;
- z-index: 1;
- opacity: 0;
- transition: opacity .6s;
- margin: 3px;
- font-size:10px;
+    .button-and-tooltip {
+        position: relative;
+        display: inline-block;
+    }
+
+    [role="tooltip"] {
+        /* Position the tooltip */
+        position: absolute;
+        top:70%;
+        display:inline;
+        //--------------
+        visibility: hidden;
+        background-color: #F0EFEF;
+        color: #080808;
+        text-align: center;
+        padding: 3px;
+        outline-color: grey;
+        outline-offset: -2px;
+        outline-style: auto;
+        outline-width:1px;
+        z-index: 1;
+        opacity: 0;
+        transition: opacity .6s;
+        margin: 3px;
+        font-size:10px;
+    }
 }

From 22b40c0deb9df0affd8c736decf24fb2e0cc85fd Mon Sep 17 00:00:00 2001
From: magda <stenius.mimmy@gmail.com>
Date: Wed, 12 Aug 2020 09:03:00 +0300
Subject: [PATCH 2/2] Clean up by removing unused styles.

---
 notebook/static/tree/less/tree.less | 15 ---------------
 1 file changed, 15 deletions(-)

diff --git a/notebook/static/tree/less/tree.less b/notebook/static/tree/less/tree.less
index e09762412..b231076fd 100644
--- a/notebook/static/tree/less/tree.less
+++ b/notebook/static/tree/less/tree.less
@@ -415,26 +415,11 @@ ul#new-menu {
 
 //TO show tooltips via keyboard for"Duplicate","View","Rename", "Download", "Shutdown", "Edit","Move", "Delete" buttons.
 .dynamic-buttons {
-    .visually-hidden {
-        clip-path: inset(100%);
-        clip: rect(1px, 1px, 1px, 1px);
-        height: 1px;
-        overflow: hidden;
-        position: absolute;
-        white-space: nowrap;
-        width: 1px;
-    }
-
     button:focus + [role="tooltip"] {
         visibility: visible;
         opacity: 1;
     }
 
-    .button-and-tooltip {
-        position: relative;
-        display: inline-block;
-    }
-
     [role="tooltip"] {
         /* Position the tooltip */
         position: absolute;