An extremely simple Boolean-powered checkmark in a ui_template. I use it to indicate the status of IoT devices, but it could be used to indicate pretty much any two-state value.
-
-
Save cerebrate/9d8b6662408a036b77ccc851a0f8df52 to your computer and use it in GitHub Desktop.
Checkmark for Ui_template
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
[ | |
{ | |
"id": "dc884fe.e4387b", | |
"type": "ui_template", | |
"z": "a2a0f621.d83018", | |
"group": "5627adc5.5dddd4", | |
"name": "state", | |
"order": 0, | |
"width": 0, | |
"height": 0, | |
"format": "<style>\n i.off {color: red;}\n i.on {color: green;}\n</style>\n<div layout=\"row\" layout-align=\"space-between\">\n <p>Example State</p>\n <p><i ng-class=\"{false:'fa fa-exclamation-circle off', true:'fa fa-check-circle on'}[(msg.payload || false)]\"></i></p>\n</div>\n", | |
"storeOutMessages": true, | |
"fwdInMessages": true, | |
"x": 1350, | |
"y": 420, | |
"wires": [ | |
[] | |
] | |
}, | |
{ | |
"id": "5627adc5.5dddd4", | |
"type": "ui_group", | |
"z": "", | |
"name": "Examples", | |
"tab": "8656b654.3d56f8", | |
"order": 1, | |
"disp": true, | |
"width": "6" | |
}, | |
{ | |
"id": "8656b654.3d56f8", | |
"type": "ui_tab", | |
"z": "", | |
"name": "Examples", | |
"icon": "dashboard", | |
"order": 4 | |
} | |
] |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Like this little node very much, also because I'm able to change colors or Icons on the fly. Can you please give me any help to change the icons to a bigger (normal) size, and also how to change from boolean to a number input ('0' / '1'). Thanks for this!