update font size for hero (#786)

update font size for hero

Co-authored-by: Marina Aísa <[email protected]>

Author: hqhhuang

src/components/DocumentationTopic/Description/Abstract.vue

@@ -26,7 +26,7 @@ export default {
 @import 'docc-render/styles/_core.scss';
 
 .abstract {
-  @include font-styles(body-large);
+  @include font-styles(intro);
 }
 
 :deep() {

src/components/DocumentationTopic/Hero/Hierarchy.vue

@@ -186,7 +186,7 @@ export default {
 @import 'docc-render/styles/_core.scss';
 
 .hierarchy {
-  @include font-styles(hierarchy);
+  @include font-styles(body-reduced);
   justify-content: flex-start;
   align-items: center;
   margin: 0 0 rem(20px) 0;

src/styles/core/typography/_font-styles.scss

@@ -180,6 +180,10 @@ $font-styles: (
   badge: (
     large: 12_16
   ),
+  intro: (
+    large: 21_29,
+    small: 19_27
+  ),
   // nav typography
   nav-title: (
     large: (19_27, nav),
@@ -205,9 +209,6 @@ $font-styles: (
   card-eyebrow-small: (
     large: 14_18_semibold,
   ),
-  hierarchy: (
-    large: 14_18,
-  ),
   card-eyebrow-large: (
     large: 17_21_semibold,
     medium: 14_18_semibold,