From 4b818f219ab2408bbbfa6636e1d1bac3ce1d65af Mon Sep 17 00:00:00 2001
From: Patrick Fulton <pfulton@adobe.com>
Date: Mon, 16 Aug 2021 15:54:44 -0400
Subject: [PATCH] feat(tabs): add t-shirt size classes and styles

---
 components/tabs/index.css | 42 +++++++++++++++++++++++++++++++++------
 1 file changed, 36 insertions(+), 6 deletions(-)

diff --git a/components/tabs/index.css b/components/tabs/index.css
index 069155dc37..f91550b08a 100644
--- a/components/tabs/index.css
+++ b/components/tabs/index.css
@@ -14,7 +14,18 @@ governing permissions and limitations under the License.
 @import "../vars/css/scales/spectrum-large.css";
 @import "../vars/css/scales/spectrum-medium.css";
 
-.spectrum-Tabs {
+.spectrum-Tabs--sizeS {
+  @remapvars {
+    find: --spectrum-tabs-s-;
+    replace: --spectrum-tabs-;
+  }
+  @remapvars {
+    find: --spectrum-tabs-quiet-s-;
+    replace: --spectrum-tabs-quiet-;
+  }
+}
+
+.spectrum-Tabs--sizeM {
   @remapvars {
     find: --spectrum-tabs-m-;
     replace: --spectrum-tabs-;
@@ -25,12 +36,31 @@ governing permissions and limitations under the License.
   }
 }
 
-.spectrum-Tabs {
-  --spectrum-tabs-item-height: calc(var(--spectrum-tabs-height) - var(--spectrum-tabs-divider-size));
-  --spectrum-tabs-compact-item-height: calc(var(--spectrum-tabs-compact-quiet-height) - var(--spectrum-tabs-divider-size));
+.spectrum-Tabs--sizeL {
+  @remapvars {
+    find: --spectrum-tabs-l-;
+    replace: --spectrum-tabs-;
+  }
+  @remapvars {
+    find: --spectrum-tabs-quiet-l-;
+    replace: --spectrum-tabs-quiet-;
+  }
+}
 
-  /* todo: remove when this is added back to DNA */
-  --spectrum-tabs-text-size: var(--spectrum-alias-font-size-default);
+.spectrum-Tabs--sizeXL {
+  @remapvars {
+    find: --spectrum-tabs-xl-;
+    replace: --spectrum-tabs-;
+  }
+  @remapvars {
+    find: --spectrum-tabs-quiet-xl-;
+    replace: --spectrum-tabs-quiet-;
+  }
+}
+
+.spectrum-Tabs {
+  --spectrum-tabs-item-height: calc(var(--spectrum-tabs-height) - var(--spectrum-tabs-rule-size));
+  --spectrum-tabs-compact-item-height: calc(var(--spectrum-tabs-quiet-compact-height) - var(--spectrum-tabs-rule-size));
 }
 
 .spectrum-Tabs {