user cards looking nicer now

src/components/tab_switcher/tab.style.js

@@ -3,7 +3,7 @@ export default {
   selector: '.tab', // CSS selector/prefix
   states: {
     active: '.active',
-    hover: ':hover:not(:disabled)',
+    hover: ':hover:not(.disabled)',
     disabled: '.disabled'
   },
   validInnerComponents: [
@@ -24,11 +24,16 @@ export default {
         shadow: ['--defaultButtonHoverGlow', '--defaultButtonBevel']
       }
     },
+    {
+      state: ['active'],
+      directives: {
+        opacity: 0
+      }
+    },
     {
       state: ['hover', 'active'],
       directives: {
-        shadow: ['--defaultButtonShadow', '--defaultButtonBevel'],
-        opacity: 0
+        shadow: ['--defaultButtonShadow', '--defaultButtonBevel']
       }
     },
     {
@@ -38,12 +43,6 @@ export default {
         shadow: ['--defaultButtonBevel']
       }
     },
-    {
-      state: ['active'],
-      directives: {
-        opacity: 0
-      }
-    },
     {
       component: 'Text',
       parent: {