UI - Make tabs hoverable

2 years ago · 8aae4197d7
parent 64caeea491
commit 8aae4197d7
2 changed files with 7 additions and 1 deletions
--- a/changedetectionio/static/styles/styles.css
+++ b/changedetectionio/static/styles/styles.css
@ -525,6 +525,8 @@ footer {
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    background-color: rgba(255, 255, 255, 0.2); }
+    .tabs ul li:not(.active):hover {
+      background-color: rgba(255, 255, 255, 0.5); }
    .tabs ul li.active, .tabs ul li :target {
      background-color: #fff; }
      .tabs ul li.active a, .tabs ul li :target a {
--- a/changedetectionio/static/styles/styles.scss
+++ b/changedetectionio/static/styles/styles.scss
@ -609,7 +609,11 @@ footer {
      border-top-left-radius: 5px;
      border-top-right-radius: 5px;
      background-color: rgba(255, 255, 255, 0.2);
-
+      &:not(.active) {
+        &:hover {
+          background-color: rgba(255, 255, 255, 0.5);
+        }
+      }
      &.active, :target {
        background-color: #fff;