github Nerwyn/material-you-utilities 1.0.9
1.0.9 - Material You Utilities

latest releases: 2.1.26, 2.1.25, 2.1.24...
16 months ago

Changes in 1.0.9

  • Slider thumb negative area will try to match background in cards and dialogs.
  • Add padding to top and bottom of slider to help prevent overflow.
  • Fix ha-input-chip background color when --color is provided.
  • hue-like-light-card style fixes.
  • Always set html background-color to --md-sys-color-surface to be more consistent when user theme colors are not used and with default Home Assistant theme.
  • Refactor how styles are set to extend class rather than replace it's prototype lifecycle functions, and to also try to trigger adding styles on constructor.

Material You, Unlimited

The companion JavaScript module for Material You theme has been moved here to its own repository, to make it easier for users to receive updates through HACS.

This module now handles not only user color themes, but the Home Assistant custom component style upgrades as well. The theme no longer uses card-mod, but instead "monkey patches" the lifecycle methods of custom element constructors to include the custom styles. This allows these styles to be applied everywhere in Home Assistant and should fix the performance issues many users are experiencing issue Nerwyn/material-you-theme#49.

You should delete the old color only JavaScript module file from both frontend resources and modules before installing this version. Because the new method of applying style upgrades is time sensitive, you should install it as a frontend module in configuration.yaml and not resources. It is not guaranteed to work if installed as a frontend resource. You should also install it as a custom panel to use the new configuration options. See the README for full instructions.

You now have even more control of how your Material You theme is generated! Component style upgrades now work everywhere in Home Assistant and are much more efficient. Component upgrades no longer use card-mod and require the new JavaScript module.

Configuration UI

If you install the theme following the updated instructions, you'll notice a new sidebar option! This is the new Material You Theme configuration page. Here you can automatically generate the input helpers for all users and global defaults. An administrator must setup the inputs for a non-administrator user before they can be used. Non-administrators can access this page and setup their own theme colors.

The old sensor domain inputs used by older versions of Material You theme have been obsoleted. If you have any custom logic surrounding them, you should migrate them to automations that set the new input helpers using service calls on sensor state change. An example automation is included in the README.

Schemes and Contrast Level

Material Color Utilities has nine available dynamic schemes for you to choose from. See the README for more information about them, or just try them out yourself in the configuration UI panel.

  • Tonal Spot (default)
  • Content
  • Fidelity
  • Expressive
  • Fruit Salad
  • Rainbow
  • Vibrant
  • Neutral
  • Monochrome

You can now also set the color theme contrast level. This should be a number between -1 and 1 (default 0), and can be set in the configuration UI panel.

Even More Component Style Upgrades

The method for applying custom styles to custom elements has been completely reworked. This method is faster, more efficient, and more thorough as it "monkey patches" the lifecycle methods of custom elements before they're created, and the styles are applied at element creation. These redesigns will now appear everywhere in Home Assistant.

Style upgrades have been added to many more elements via theme variables and CSS modifications. Screenshots of most changes can be found in the README.

Patch Version Changes

  • RTL fixes for switches, top app bar, and sidebar profile initials/picture.
  • Tweak card alternate styles to use custom properties, and change outlined card to use a border instead.
  • Efficiency/consistency improvements for style application.
  • Grid/stack editor horizontal overflow fix.
  • Set pointer-events: all on header cards.
  • Require confirmation on Delete Helpers.
  • Repository name changed to material-you-utilities and updated workflow action for HACS submission.
  • Input chip styles.
  • Slider thumb negative area will try to match background in cards and dialogs.
  • Add padding to top and bottom of slider to help prevent overflow.
  • Fix ha-input-chip background color when --color is provided.
  • hue-like-light-card style fixes.
  • Always set html background-color to --md-sys-color-surface to be more consistent when user theme colors are not used and with default Home Assistant theme.
  • Refactor how styles are set to extend class rather than replace it's prototype lifecycle functions, and to also try to trigger adding styles on constructor.

Full Changelog: 1.0.0...1.0.9

Don't miss a new material-you-utilities release

NewReleases is sending notifications on new releases.