fix(block-section): adjust text hierarchy (#9580)

**Related Issue:** #6905 ## Summary Adjust text hierarchy.
Esri · Jun 14, 2024 · 801152c · 801152c
1 parent 04aff9c
commit 801152c
Showing 1 changed file with 29 additions and 17 deletions.
diff --git a/packages/calcite-components/src/components/block-section/block-section.scss b/packages/calcite-components/src/components/block-section/block-section.scss
@@ -1,31 +1,46 @@
 :host {
-  @apply bg-foreground-1
-    text-color-2
-    text-n1
-    box-border
-    block;
+  @apply bg-foreground-1 text-n1 box-border block;
+
+  color: var(--calcite-color-text-2);
 }
 
 :host([open]) {
   @apply border-b-color-3
     border-0
     border-b
     border-solid;
+
+  .toggle {
+    color: var(--calcite-color-text-1);
+
+    &:hover {
+      color: var(--calcite-color-text-1);
+    }
+  }
+
+  .chevron-icon {
+    color: var(--calcite-color-text-3);
+
+    &:hover {
+      color: var(--calcite-color-text-1);
+    }
+  }
 }
 
 :host(:last-child) {
   @apply border-b-0;
 }
 
 .toggle {
-  @apply font-sans
-    text-color-2
-    w-full
-    border-0
-    bg-transparent
-    font-medium;
+  @apply font-sans w-full border-0 bg-transparent;
 
   gap: var(--calcite-spacing-md);
+  color: var(--calcite-color-text-2);
+  font-weight: var(--calcite-font-weight-normal);
+
+  &:hover {
+    color: var(--calcite-color-text-1);
+  }
 }
 
 .toggle--switch,
@@ -45,7 +60,7 @@
     @apply focus-outset;
   }
   &:hover {
-    @apply text-color-1;
+    color: var(--calcite-color-text-1);
   }
 }
 
@@ -66,7 +81,8 @@
   }
 
   .icon--end,
-  .icon--start {
+  .icon--start,
+  .chevron-icon {
     @apply flex items-center;
 
     color: var(--calcite-color-text-3);
@@ -89,8 +105,4 @@
   color: theme("colors.danger");
 }
 
-.chevron-icon {
-  @apply flex items-center;
-}
-
 @include base-component();