Add CSS variables to ha-toast

[dhoeben]

Proposed change

Added two variables for styling ha-toast. One for the background and one for the text color. Unfortunatly, I'm not on a good enough laptop to check if code works. According to https://m2.material.io/components/snackbars/web#javascript-api these variables should work.

Type of change

• Dependency upgrade
• Bugfix (non-breaking change which fixes an issue)
• New feature (thank you!)
• Breaking change (fix/feature causing existing functionality to break)
• Code quality improvements to existing code or addition of tests

Example configuration

theme.yaml:

theme:
  ha-toast-background-color: var(--ha-card-background-color)
  ha-toast-text-color: var(--primary-text-color)

Additional information

• This PR fixes or closes issue: fixes #
• This PR is related to issue or discussion:
• Link to documentation pull request:

Checklist

• The code change is tested and works locally.
• There is no commented out code in this PR.
• Tests have been added to verify that the new code works.

If user exposed functionality or configuration variables are added/changed:

• Documentation added/updated for www.home-assistant.io

[dhoeben]

Fixed

[silamon]

Thanks for picking this up. 👍 You should add the css class to the ha-toast component instead of the notification-manager.
FYI: CI is also failing right now as you closed the class too early.

[home-assistant]

Please take a look at the requested changes, and use the Ready for review button when you are done, thanks 👍

Learn more about our pull request process.

[dhoeben]

Thanks