show hover only when (pointer: fine)

daostack · Dec 4, 2023 · cdff22f · cdff22f
1 parent 3f5669d
commit cdff22f
Show file tree

Hide file tree

Showing 2 changed files with 16 additions and 13 deletions.
diff --git a/src/index.scss b/src/index.scss
@@ -204,15 +204,6 @@ body {
   }
 }
 
-/* Disable hover effects globally when using a touch device */
-@media (hover: none) {
-  * {
-    :hover {
-      opacity: unset !important;
-    }
-  }
-}
-
 code {
   font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
     monospace;

diff --git a/src/shared/components/Tabs/Tab/index.scss b/src/shared/components/Tabs/Tab/index.scss
@@ -32,8 +32,10 @@
     --tab-color: var(--tab-inactive-hover-color);
   }
 
-  &:hover {
-    --tab-color: var(--tab-inactive-hover-color);
+  @media (hover: hover) and (pointer: fine) {
+    &:hover {
+      --tab-color: var(--tab-inactive-hover-color);
+    }
   }
 
   &:first-child {
@@ -50,11 +52,21 @@
   --tab-bb-color: var(--secondary-text);
   --tab-color: var(--secondary-text);
 
-  &:active,
-  &:hover {
+  &:active {
     --tab-bb-color: var(--secondary-text);
     --tab-color: var(--secondary-text);
   }
+
+  @media (hover: hover) and (pointer: fine) {
+    &:hover {
+      --tab-bb-color: var(--secondary-text);
+      --tab-color: var(--secondary-text);
+    }
+  }
+  // &:hover {
+  //   --tab-bb-color: var(--secondary-text);
+  //   --tab-color: var(--secondary-text);
+  // }
 }
 .custom-tab--with-icon {
   --tab-pb: 0;