Minor style update for checkboxes in wa-tree-item (#542)

* Use theme value line height for tree item checkbox

* Apply theme checkbox styles to selected tree items

Author: lindsaym-fa

src/components/tree-item/tree-item.css

@@ -30,14 +30,16 @@ slot:not([name])::slotted(wa-icon) {
 }
 
 .checkbox {
+  line-height: var(--wa-form-control-value-line-height);
   pointer-events: none;
 }
 
 .expand-button,
 .checkbox,
 .label {
-  font: inherit;
+  font-family: inherit;
   font-size: var(--wa-font-size-m);
+  font-weight: inherit;
 }
 
 .checkbox::part(base) {

src/styles/themes/awesome/overrides.css

@@ -68,7 +68,8 @@
   }
 
   input[type='checkbox'],
-  wa-checkbox {
+  wa-checkbox,
+  wa-tree-item::part(checkbox__control) {
     --checked-icon-color: var(--wa-color-surface-default);
   }
 

src/styles/themes/glossy.css

@@ -189,6 +189,7 @@
 
   input:is([type='checkbox'], [type='radio']):is(:checked, :indeterminate),
   wa-checkbox:is(:state(checked), :state(indeterminate)),
+  wa-tree-item:is(:state(selected), :state(indeterminate))::part(checkbox__control),
   wa-radio:state(checked) {
     --box-shadow: var(--wa-theme-glossy-inner-shine), var(--wa-theme-glossy-top-highlight),
       var(--wa-theme-glossy-bottom-shadow);

src/styles/themes/playful.css

@@ -312,6 +312,7 @@
 
   input:is([type='checkbox'], [type='radio']):is(:checked, :indeterminate),
   wa-checkbox:is(:state(checked), :state(indeterminate))::part(control),
+  wa-tree-item:is(:state(selected), :state(indeterminate))::part(checkbox__control),
   wa-radio:state(checked)::part(control),
   wa-switch:state(checked)::part(control) {
     --gradient-top: oklch(from var(--background-color-checked) calc(l - 0.1) c h);

src/styles/themes/premium/overrides.css

@@ -19,7 +19,8 @@
   }
 
   input[type='checkbox'],
-  wa-checkbox {
+  wa-checkbox,
+  wa-tree-item::part(checkbox__control) {
     --checked-icon-color: var(--wa-color-surface-default);
   }