Skip to content

3.0.1 - True Material You Color Theming

Latest
Latest
Compare
Choose a tag to compare
@Nerwyn Nerwyn released this 31 Dec 04:05
· 1 commit to main since this release
3.0.1
73c853a

Changes in 3.0.1

  • Remove unnecessary graph border radius styles #50.
  • Improve graph fill selector.
  • Fix text input background color to use correct md3 theme color.
  • Prioritize using "Google Sans" font if available before using "Roboto".
  • Increase --ha-heading-card-title-font-weight to match section titles in md3 apps.
  • Remove view left/right padding and reinforcing of view background, and instead increase --ha-view-sections-row-gap to 18px to achieve a similar result in sections view on mobile displays #52.
  • JS Module fixes and improvements
    • Trigger companion app (Android and iOS) app and navigation bar color updates on setting of user theme colors #53.
    • Fix error if a user color sensor does not exist.
    • Add option to use user ID instead of user friendly name for sensor #55.
    • Apply user color theme to add-ons and HACS iframes.

⚠️ BREAKING CHANGES ⚠️

Material You color generation is now handled by a JavaScript module which has to be added as a resource in Home Assistant. Instructions on how to do so can be found here.

If you have this module downloaded locally, remember to download the latest version for new features and fixes!

While color theme generation no longer requires card-mod, component modification does.

True Material You Color Theming

Version 2 of this theme introduced Material You color theming via an approximation of theme colors generated via HSL with fixed saturation and luminance values. While this worked, it was a hack and proved difficult to tweak to generate more colors for different theme variables.

Version 3 introduces true Material You color theming via the Material Color Utilities module. This does require that you install a JavaScript module resource as described above in breaking changes and the README.

A Modern Full Featured Material You Theme

This repository now includes a second theme - Material You. This theme replaces almost all of it's colors with colors generated using Material Color Utilities, giving you a fully color themed theme. Color theming has been applied to almost every component in Home Assistant following the guidelines provided by Material Design 3. This theme still uses the sensors material_rounded_base_color and material_rounded_base_color_john_doe.

Other Changes

  • BREAKING removed the old user color approximation logic. Using custom colors now requires installing the JavaScript module as described above.
  • Added md3 switches to ha-card analytics and more-info updates.
  • Use error (red) color for navigation rail badges.
  • Removed background and use sidebar text color for navigation drawer badges.

Patch Version Changes

  • Remove unnecessary graph border radius styles #50.
  • Improve graph fill selector.
  • Fix text input background color to use correct md3 theme color.
  • Prioritize using "Google Sans" font if available before using "Roboto".
  • Increase --ha-heading-card-title-font-weight to match section titles in md3 apps.
  • Remove view left/right padding and reinforcing of view background, and instead increase --ha-view-sections-row-gap to 18px to achieve a similar result in sections view on mobile displays #52.
  • JS Module fixes and improvements
    • Trigger companion app (Android and iOS) app and navigation bar color updates on setting of user theme colors #53.
    • Fix error if a user color sensor does not exist.
    • Add option to use user ID instead of user friendly name for sensor #55.
    • Apply user color theme to add-ons and HACS iframes.

Full Changelog: 2.1.10...3.0.1

Assets 2
Loading