I copied css syntax from the Wiki community. It defines everything ass “switch”. The routine works great for Kasa non dimming switches but doesn’t work for dimmers.
How is a dimmer defined in css coding?
Here is the syntax copied:
.tile.switch .icon {
display: none; /* hide the icon /
}
.tile.switch .title {
font-size: 2em; / 2x font size /
height: 100%; / fill the full tile height for centering /
top: 0; / align to the top of the tile; remove top padding from title /
display: flex; / enable vertical centering /
align-items: center; / horizontally align /
justify-content: center; / vertically align /
}
/ The style below targets everything in the title
to make it have a ellipsis if the text overflows */
.tile.switch .title * {
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}