fix: Tooltip for open result icon not placed properly (#318)

Fixed Issue#314

Author: javamultiplex

src/style.css

@@ -498,8 +498,7 @@ input[type='number']::-webkit-outer-spin-button {
   margin-left: 3rem;
 }
 
-.close-sideBar span.tooltip,
-.open-sidebar > span.tooltip {
+.close-sideBar span.tooltip {
   position: relative;
   bottom: -20px;
   right: 40px;
@@ -516,12 +515,27 @@ input[type='number']::-webkit-outer-spin-button {
 }
 
 .open-sidebar > span.tooltip {
-  top: 38%;
-  left: -45px;
+  position: relative;
+  bottom: -20px;
+  right: 40px;
+  padding: 5px;
+  width: 50px;
+  margin-top: 10px;
+  margin-right: -50px;
+  font-size: 15px;
+  text-align: center;
+  color: var(--input-color);
+  background-color: var(--text-color);
+  border-radius: 5px;
+  display: none;
+}
+
+.open-sidebar > span.tooltip {
+  top: 5%;
+  left: -10px;
 }
 
-.close-sideBar .tooltip::before,
-.open-sidebar > span.tooltip::before {
+.close-sideBar .tooltip::before {
   content: '';
   position: absolute;
   top: -15%;
@@ -533,7 +547,18 @@ input[type='number']::-webkit-outer-spin-button {
 }
 
 .open-sidebar > span.tooltip::before {
-  top: 10%;
+  content: '';
+  position: absolute;
+  top: -15%;
+  left: 5%;
+  margin-top: -5px;
+  border-width: 12px;
+  border-style: solid;
+  border-color: transparent var(--text-color) transparent transparent;
+}
+
+.open-sidebar > span.tooltip::before {
+  top: -26%;
 }
 
 .close-sideBar:hover .tooltip,