new hover styling

7 files changed, 11 insertions, 3 deletions

diff --git a/packages/dev-tools-pages/ts/components/Button.tsx b/packages/dev-tools-pages/ts/components/Button.tsx
index 90d991496..65f1fce74 100644
--- a/packages/dev-tools-pages/ts/components/Button.tsx
+++ b/packages/dev-tools-pages/ts/components/Button.tsx
@@ -24,7 +24,7 @@ const Button =
   padding: ${props => (props.large ? '1.125rem 2.375rem' : '.5625rem 1.25rem')};
   display: inline-block;
   :hover, :focus {
-    color: ${props => props.colors.main};
+    background-color: ${props => props.colors.secondary_alt};
   } 
   ${props =>
       props.large &&
diff --git a/packages/dev-tools-pages/ts/components/Tabs.tsx b/packages/dev-tools-pages/ts/components/Tabs.tsx
index 4d436f519..36c707b06 100644
--- a/packages/dev-tools-pages/ts/components/Tabs.tsx
+++ b/packages/dev-tools-pages/ts/components/Tabs.tsx
@@ -39,7 +39,7 @@ const Root =
 
         &[aria-selected="false"]:focus,
         &[aria-selected="false"]:hover {
-            color: ${props => props.colors.main};
+            background-color: ${props => props.colors.secondary_alt};
             cursor: pointer;
         }
     }
diff --git a/packages/dev-tools-pages/ts/context/compiler.tsx b/packages/dev-tools-pages/ts/context/compiler.tsx
index 1c174ca2b..3c26ffa4a 100644
--- a/packages/dev-tools-pages/ts/context/compiler.tsx
+++ b/packages/dev-tools-pages/ts/context/compiler.tsx
@@ -9,6 +9,8 @@ export default {
     colors: {
         main: '#1EADCD',
         secondary: '#D1F4FC',
+        secondary_alt: '#C4F2FC',
         type: '#30C3E3',
+        type_alt: '#16A9C9',
     },
 };
diff --git a/packages/dev-tools-pages/ts/context/cov.tsx b/packages/dev-tools-pages/ts/context/cov.tsx
index c39c85eba..0874513e9 100644
--- a/packages/dev-tools-pages/ts/context/cov.tsx
+++ b/packages/dev-tools-pages/ts/context/cov.tsx
@@ -9,6 +9,8 @@ export default {
     colors: {
         main: '#BB9200',
         secondary: '#F1DB8D',
+        secondary_alt: '#F1D882',
         type: '#D7AE1B',
+        type_alt: '#BD9406',
     },
 };
diff --git a/packages/dev-tools-pages/ts/context/profiler.tsx b/packages/dev-tools-pages/ts/context/profiler.tsx
index 59f2f413a..2b0820add 100644
--- a/packages/dev-tools-pages/ts/context/profiler.tsx
+++ b/packages/dev-tools-pages/ts/context/profiler.tsx
@@ -9,6 +9,8 @@ export default {
     colors: {
         main: '#FF7144',
         secondary: '#FED7CB',
+        secondary_alt: '#FECEBE',
         type: '#EB8666',
+        type_alt: '#D16745',
     },
 };
diff --git a/packages/dev-tools-pages/ts/context/trace.tsx b/packages/dev-tools-pages/ts/context/trace.tsx
index 5a239f684..66112f90f 100644
--- a/packages/dev-tools-pages/ts/context/trace.tsx
+++ b/packages/dev-tools-pages/ts/context/trace.tsx
@@ -9,6 +9,8 @@ export default {
     colors: {
         main: '#4F76FF',
         secondary: '#CDD8FF',
+        secondary_alt: '#BFCDFF',
         type: '#7090FF',
+        type_alt: '#355CE5',
     },
 };
diff --git a/packages/dev-tools-pages/ts/globalStyles.tsx b/packages/dev-tools-pages/ts/globalStyles.tsx
index 270929123..c5db93f6a 100644
--- a/packages/dev-tools-pages/ts/globalStyles.tsx
+++ b/packages/dev-tools-pages/ts/globalStyles.tsx
@@ -59,7 +59,7 @@ const BaseStyles = createGlobalStyle`
         text-decoration: none; 
 
         &:hover {
-            text-decoration: underline;
+            color: ${(props: any) => props.colors.type_alt};
         }
     }