fix tab-button tokens

Author: BenOsodrac

core/src/components/spinner/spinner.native.scss

@@ -11,4 +11,4 @@
 :host(.spinner-lines-sharp) line,
 :host(.spinner-lines-sharp-small) line {
   stroke-width: 4px;
-}
+}

core/src/components/tab-button/tab-button.common.scss

@@ -102,12 +102,6 @@
   display: none !important;
 }
 
-:host(.tab-disabled) {
-  pointer-events: none;
-
-  opacity: 0.4;
-}
-
 // Tab Button: Label / Icon
 // --------------------------------------------------
 

core/src/components/tab-button/tab-button.ionic.scss

@@ -8,15 +8,14 @@
   --focus-ring-color: #{globals.$ion-border-focus-default};
   --focus-ring-width: #{globals.$ion-border-radius-025};
 
+  @include globals.typography(globals.$ion-body-action-sm);
+
+  position: relative;
+
   align-content: center;
 
   min-height: globals.$ion-scale-1200;
   max-height: globals.$ion-scale-1800;
-
-  font-size: globals.$ion-font-size-300;
-  font-weight: globals.$ion-font-weight-medium;
-
-  line-height: globals.$ion-font-line-height-500;
 }
 
 // Tab Button: Native
@@ -35,6 +34,15 @@
   @include globals.button-state();
 }
 
+// Tab Button Disabled
+// -------------------------------------------------------------------------------
+
+:host(.tab-disabled)::after {
+  @include globals.disabled-state();
+
+  z-index: 1;
+}
+
 // Tab Button Focused
 // -------------------------------------------------------------------------------
 

core/src/components/tab-button/tab-button.native.scss

@@ -14,3 +14,9 @@
 .button-native::after {
   @include button-state();
 }
+
+:host(.tab-disabled) {
+  pointer-events: none;
+
+  opacity: 0.4;
+}