But I keep hitting dead ends – or, maybe I’m hitting the limits of my abilities.
I would like a simple page/dashboard/lovelace to be able to glance at and with as few brain cells as possible take note of the temperate at various locations (such as different places inside various homes, the well house, the outside, the water tank areas, etc.).
Something like this: Each line is color coded for the range of temp (but with fully shaded areas inside the rectangles), or maybe horizontal bars that are both color coded and length coded.
Icing on the cake would be able to have certain icons/images to the left of the location name that correspond to the type of location (water tank area, well, inside home A, inside home B, outside, etc.)
Something like (degrees F):
0-32 – Icy blue
33-48 – blue
49-60 – green
61-69 – yellowish
70-76 – orange
77 and above - red
All your requirements can be met by card-mod, including applying styles to cards in a batch. There’s a long thread around here with incredible front end customizations that people achieve with card-mod. They can help you with the CSS.
You have these ways to reuse a code in general, not with card-mod only:
Call a code snippet by “include”.
Use yaml-anchors (one file-wide only).
Call a code snippet from “secrets” - which is possible but WRONG since “secrets” is supposed to keep SECRETS, i.e. confidential info (not just everything you want to use system-wide).
(suitable in some use cases) use a custom decluttering-card’s templates to represent a card, a row, a set of UI elements - to be reused (similarly - about using templates of custom:apexcharts-card & custom:button-card).
This is correct.
And yaml-anchors - may be used in UI but are not persistent, replaced by a code after reopening a card.
In UI (storage mode) only decluttering-card templates (+ templates for apexcharts, button-card) & card-mod-themes may only be used to re-use a code (incl. styles).
Let me see if I understand (hint: I probably don’t):
These are some ways to re-use card-mod code:
card-mod-themes: This method uses yaml files stored in config/themes/ to apply card-mod styles. These themes/styles can be applied card-wide or for certain entities only by the use of classes (defined within the theme).
!include: This method simply reads a separate file in config/ and inserts the code at that point in the yaml
yaml-anchors: I don’t understand this method, but it sounds like it has potential substantial drawbacks.
!secret: This method works just like !include, but only with the file config/secrets and is meant for confidential pieces of data – so don’t use this for other things. It will not work in the UI yaml editor.
decluttering-card: This method uses decluttering_templates. From there it just gets way too complicated.
I am seriously about to give up on this endeavor. I see that there are super powerful methods to achieve just about anything one can imagine, but the learning curve for a non-programmer is pretty steep.
I should probably focurs on figuring out how to use card-mod to get the look I want and just copy/paste that code 20+ times for now. That will be a huge-enough task.