Fix: Fix jumping behavior when hovering over tabs of open report/alert.

Pseudo selectors no longer work when not prefixed with & in
styled-components 6

package.json

@@ -13,7 +13,7 @@
     "type": "git",
     "url": "https://github.com/greenbone/gsa/"
   },
-  "author": "Bj\u00f6rn Ricks <[email protected]>",
+  "author": "Björn Ricks <[email protected]>",
   "license": "AGPL-3.0+",
   "main": "src/index.js",
   "engines": {
@@ -64,7 +64,7 @@
     "redux": "^4.2.1",
     "redux-logger": "^3.0.6",
     "redux-thunk": "^2.4.2",
-    "styled-components": "^6.1.0",
+    "styled-components": "^6.1.1",
     "uuid": "^9.0.1",
     "whatwg-fetch": "^3.6.19"
   },
@@ -126,4 +126,4 @@
       "git add"
     ]
   }
-}
+}

src/web/components/tab/tab.js

@@ -47,13 +47,13 @@ const StyledDiv = styledExcludeProps(styled.div, ['active'])`
   margin-bottom: ${props => (props.active ? '-2px' : undefined)};
   border-top: ${props =>
     props.active ? '2px solid ' + Theme.green : '2px solid ' + Theme.white};
-  :hover {
+  &:hover {
     border-top: ${props =>
       props.active
-        ? '2px solid ' + Theme.white
+        ? '2px solid ' + Theme.green
         : '2px solid ' + Theme.lightGray};
   }
-  :first-child {
+  &:first-child {
     border-left: ${props =>
       props.active
         ? '1px solid ' + Theme.lightGray

src/web/pages/audits/__tests__/__snapshots__/detailspage.js.snap

@@ -375,11 +375,11 @@ exports[`Audit Detailspage tests should render full Detailspage 1`] = `
   border-top: 2px solid #11ab51;
 }
 
-.c29 :hover {
-  border-top: 2px solid #fff;
+.c29:hover {
+  border-top: 2px solid #11ab51;
 }
 
-.c29 :first-child {
+.c29:first-child {
   border-left: 1px solid #e5e5e5;
 }
 
@@ -407,11 +407,11 @@ exports[`Audit Detailspage tests should render full Detailspage 1`] = `
   border-top: 2px solid #fff;
 }
 
-.c30 :hover {
+.c30:hover {
   border-top: 2px solid #e5e5e5;
 }
 
-.c30 :first-child {
+.c30:first-child {
   border-left: 1px solid #fff;
 }
 

src/web/pages/policies/__tests__/__snapshots__/detailspage.js.snap

@@ -375,11 +375,11 @@ exports[`Policy Detailspage tests should render full Detailspage 1`] = `
   border-top: 2px solid #11ab51;
 }
 
-.c25 :hover {
-  border-top: 2px solid #fff;
+.c25:hover {
+  border-top: 2px solid #11ab51;
 }
 
-.c25 :first-child {
+.c25:first-child {
   border-left: 1px solid #e5e5e5;
 }
 
@@ -407,11 +407,11 @@ exports[`Policy Detailspage tests should render full Detailspage 1`] = `
   border-top: 2px solid #fff;
 }
 
-.c26 :hover {
+.c26:hover {
   border-top: 2px solid #e5e5e5;
 }
 
-.c26 :first-child {
+.c26:first-child {
   border-left: 1px solid #fff;
 }
 

src/web/pages/scanconfigs/__tests__/__snapshots__/detailspage.js.snap

@@ -375,11 +375,11 @@ exports[`Scan Config Detailspage tests should render full Detailspage 1`] = `
   border-top: 2px solid #11ab51;
 }
 
-.c25 :hover {
-  border-top: 2px solid #fff;
+.c25:hover {
+  border-top: 2px solid #11ab51;
 }
 
-.c25 :first-child {
+.c25:first-child {
   border-left: 1px solid #e5e5e5;
 }
 
@@ -407,11 +407,11 @@ exports[`Scan Config Detailspage tests should render full Detailspage 1`] = `
   border-top: 2px solid #fff;
 }
 
-.c26 :hover {
+.c26:hover {
   border-top: 2px solid #e5e5e5;
 }
 
-.c26 :first-child {
+.c26:first-child {
   border-left: 1px solid #fff;
 }
 

src/web/pages/tasks/__tests__/__snapshots__/detailspage.js.snap

@@ -397,11 +397,11 @@ exports[`Task Detailspage tests should render full Detailspage 1`] = `
   border-top: 2px solid #11ab51;
 }
 
-.c35 :hover {
-  border-top: 2px solid #fff;
+.c35:hover {
+  border-top: 2px solid #11ab51;
 }
 
-.c35 :first-child {
+.c35:first-child {
   border-left: 1px solid #e5e5e5;
 }
 
@@ -429,11 +429,11 @@ exports[`Task Detailspage tests should render full Detailspage 1`] = `
   border-top: 2px solid #fff;
 }
 
-.c36 :hover {
+.c36:hover {
   border-top: 2px solid #e5e5e5;
 }
 
-.c36 :first-child {
+.c36:first-child {
   border-left: 1px solid #fff;
 }