UI template buttons inheriting node red css

Hi,

is it possible to have a button defined in a ui_template node inheriting the default node red css?
In this way a change in the default theme style is automatically and properly updated in the ui_template elements...


PS: my template UI has the following code:

[{"id":"7de5293d.2e88d8","type":"ui_template","z":"38d689bb.d0e076","group":"f33a9d12.83f36","name":"CommonList","order":1,"width":"0","height":"0","format":"<style>\n    .warned { color: orange }\n    .inited { ng-init : \"\"}\n</style>\n\n<div>\n<table style=\"text-align: left; width: 100%;\"\nborder=\"0\" cellpadding=\"0\" cellspacing=\"0\">\n<tbody>\n<tr>\n    <td style=\"vertical-align: bottom;\">\n        <form name=\"form_odl\">\n        <label ng-class =\"{'warned': form_odl.$valid === false}\" >ODL</label>\n        <input  style=\"width:95%;\"\n        ng-model=\"model_odl\"  id=\"lab_odl\"      name=\"input_odl\"\n        ng-model-options=\"{ debounce: 200, allowInvalid: true }\" \n        ng-pattern = \"/^ODL-[0-9]{8}$/\"><br>\n        </form>\n    </td>\n    <td style=\"vertical-align: bottom;\">\n        <button ng-click=\"out.payload = {val : model_odl, field : 'ODL', valid : form_odl.$valid}; send(out)\" style=\"width: 100px\">Carica ODL</button>\n    </td>\n</tr>\n<tr>\n    <td style=\"vertical-align: bottom;\">\n        <form name=\"form_pn\">\n        <label ng-class =\"{'warned': form_pn.$valid === false}\" >Part num./ ricetta</label>\n        <input  style=\"width:95%;\" ng-class =\"{'inited':msg.update_fields === true}\"\n        ng-model=\"model_pn\"  id=\"lab_pn\"      name=\"input_pn\"\n        ng-required= true   ng-model-options=\"{ debounce: 200, allowInvalid: true }\" \n        ng-pattern = \"/^[0-9]{11}[0-9A-Z]{2}$/\"\n        ng-disabled = false><br>\n        </form>\n    </td>\n    <td style=\"vertical-align: bottom;\">\n        <button ng-click=\"out.payload = {val : model_pn, field : 'Cod.Cooltech', valid : form_pn.$valid}; send(out)\" style=\"width: 100px\">Carica PN</button>\n    </td>\n</tr>\n</tbody>\n</table>\n\n</div>\n<br>\n<div>\n<hr style= \"border: 1px solid white;\">\n</div>\n\n\n\n<script>\n        (function(scope) {\n        // watch for msg in order to get every new message\n        scope.$watch('msg', function(data) {\n        if (typeof data.update_odl !== 'undefined')\n            scope.model_odl = data.update_odl;\n        if (typeof data.update_pn !== 'undefined')\n            scope.model_pn = data.update_pn;            \n        });\n    })(scope);\n</script>","storeOutMessages":false,"fwdInMessages":false,"templateScope":"local","x":110,"y":580,"wires":[["f11dc9c8.23b4b8","18f6b2c2.fb3ded"]]},{"id":"f33a9d12.83f36","type":"ui_group","z":"","name":"Dati test","tab":"c3bde9c2.3f2de8","order":1,"disp":true,"width":"6","collapse":false},{"id":"c3bde9c2.3f2de8","type":"ui_tab","z":"","name":"Home","icon":"fa-home fa-lg","order":1,"disabled":false,"hidden":false}]

By default they will be as long as you set
image
in the Dashboard - Site settings tab

I already had "node red theme everywhere" setting selected but the buttons remain grey... :thinking:

If you have experimenting with themes and find some things messing up after that, it sometimes helps if you clear browser cache.