Madelena / Metrology-for-Hass

🎨 Give your Home Assistant a modern and clean facelift. 🟥🟧🟩🟦🟪 24 Variations with 2 Styles + 6 Colors (Magenta Red / Orange / Green / Blue / Purple) + 🌞 Light and 🌚 Dark modes included. Based on Metro and Fluent UI Design Systems from Microsoft Windows.
https://community.home-assistant.io/t/metrology-metro-fluent-windows-themes-for-home-assistant/
564 stars 30 forks source link

ha-attribute-value incorrectly set as H2 and not body text #71

Closed twcau closed 10 months ago

twcau commented 11 months ago

As shown below, I am observing a behaviour with Metrology (in all colour schemes) where the values of attribute text (ha-attribute-value, DIV = value) shown in the attributes portion of a view is being rendered as a H2, and not a body font.

This is seemingly caused by ha-attribute-value being rendered as a H2, with the following values: --h2-font-size: 2.25rem;

Screenshot 2023-11-25 121624

zanix commented 11 months ago

I think I found where this size is defined for the attributes

Find this in metro.yaml

.data-entry .value {
  text-align: left !important;
  font-size: var(--h2-font-size);
  font-weight: var(--h2-font-weight);
  line-height: 1.1;
  margin-bottom: 16px;
  max-width: none !important;
}

And comment out the font-* values

.data-entry .value {
  text-align: left !important;
  /*font-size: var(--h2-font-size);*/
  /*font-weight: var(--h2-font-weight);*/
  line-height: 1.1;
  margin-bottom: 16px;
  max-width: none !important;
}

I didn't test all of the more info popups, so hopefully this doesn't mess anything up

zanix commented 11 months ago

I just took a look at the screenshots and I think this was intended. More Info Screenshot

Madelena commented 10 months ago

I just took a look at the screenshots and I think this was intended. More Info Screenshot

Yep, that is intentional. The Metro UI from Windows Phone 7 had plenty of elements that would be considered unusual nowadays.

image