Next paragraph:
Inline CSS - stuck.
(w3school account still locked - sorry)
Ok, I get that the code needs to be inside the <style> part of the line.
eg:
<h1 style="color:blue"> This paragraph will be blue </p> </body>
(Or I hope that is correct.
But now I am getting stuck when the lines become l l l l l o o o o o o o n n n n n n n g g g g g g g e e e e e e r r r r r r r r and longer.
I know there is a horizontal scroll, but it is difficult for me to parse at this stage.
I guess there isn't a way to split the line into multiple lines?
I've tried to get the next level of the CASCADING part working, but am (again) stuck
Code:
(This is for the whole page - as it were.)
[{"id":"2c4eab16.b45734","type":"ui_template","z":"8bb4de19.f72c88","group":"d3bcf885.d668a","name":"Base Line","order":8,"width":"1","height":"1","format":"<style>\n/* Best so far to fit 1x1 area */\n.baseline {\n border: none;\n border-radius: 8px;\n text-align: center;\n background-color: black; /* Backfound colour */\n color: {{msg.colour}}; /* \"Font\" (forground) colour */\n padding: 15px 0px;\n text-decoration: none;\n display: inline-block;\n font-size: 14px;\n margin: 0px 0px;\n cursor: pointer;\n}\n</style>\n\n","storeOutMessages":true,"fwdInMessages":false,"resendOnRefresh":true,"templateScope":"local","x":640,"y":150,"wires":[[]]},{"id":"474463e0.9fa954","type":"inject","z":"8bb4de19.f72c88","name":"Setup","topic":"","payload":"lime","payloadType":"str","repeat":"","crontab":"","once":false,"onceDelay":0.1,"x":250,"y":150,"wires":[["c2f01962.ad363"]]},{"id":"c2f01962.ad363","type":"change","z":"8bb4de19.f72c88","name":"Set","rules":[{"t":"move","p":"payload","pt":"msg","to":"colour","tot":"msg"},{"t":"set","p":"text","pt":"msg","to":"This","tot":"str"}],"action":"","property":"","from":"","to":"","reg":false,"x":450,"y":150,"wires":[["2c4eab16.b45734"]]},{"id":"d3bcf885.d668a","type":"ui_group","name":"Group 1","tab":"de5134a7.f0a0d","order":1,"disp":true,"width":6},{"id":"de5134a7.f0a0d","type":"ui_tab","name":"Tab 6","icon":"dashboard","order":6}]
So it sets green text and back background.
This is the code for the button.
[{"id":"e4b5eb8.2799498","type":"debug","z":"8bb4de19.f72c88","name":"","active":true,"tosidebar":true,"console":false,"tostatus":false,"complete":"false","x":560,"y":380,"wires":[]},{"id":"193c7b50.6968d5","type":"ui_template","z":"8bb4de19.f72c88","group":"d3bcf885.d668a","name":"","order":1,"width":"1","height":"1","format":"<button class=\"baseline\" ng-mousedown=\"send({payload: 'Down'})\" ng-mouseup=\"send({payload: 'Up'})\">Press</button>","storeOutMessages":true,"fwdInMessages":false,"resendOnRefresh":true,"templateScope":"local","x":400,"y":380,"wires":[["ffa80d13.3b74e","96e75956.1e94a","e4b5eb8.2799498"]]},{"id":"ffa80d13.3b74e","type":"trigger","z":"8bb4de19.f72c88","op1":"Down","op2":"0","op1type":"str","op2type":"str","duration":"-350","extend":false,"units":"ms","reset":"Up","bytopic":"all","name":"Repeat","x":550,"y":420,"wires":[["e1481326.12a3a8"]]},{"id":"96e75956.1e94a","type":"switch","z":"8bb4de19.f72c88","name":"","property":"payload","propertyType":"msg","rules":[{"t":"eq","v":"Down","vt":"str"},{"t":"eq","v":"Up","vt":"str"}],"checkall":"true","repair":false,"outputs":2,"x":540,"y":460,"wires":[[],["e1481326.12a3a8"]]},{"id":"e1481326.12a3a8","type":"function","z":"8bb4de19.f72c88","name":"toggle","func":"let msg1 = {};\n\nvar x = context.get(\"counter\") || 0;\nif (msg.payload == \"Up\")\n{\n context.set(\"counter\",0);\n msg1.colour = \"lime\";\n msg.payload = \"A\";\n return [msg,msg1];\n}\n\nif (x === 0)\n{\n msg1.colour = \"red\";\n msg.payload = \"B\";\n} else\nif (x === 1)\n{\n msg1.colour = \"lime\";\n msg.payload = \"A\";\n}\n\nx = (x + 1) % 2;\n\ncontext.set(\"counter\",x);\n\nreturn [msg,msg1];","outputs":2,"noerr":0,"x":730,"y":420,"wires":[[],["193c7b50.6968d5"]]},{"id":"d3bcf885.d668a","type":"ui_group","name":"Group 1","tab":"de5134a7.f0a0d","order":1,"disp":true,"width":6},{"id":"de5134a7.f0a0d","type":"ui_tab","name":"Tab 6","icon":"dashboard","order":6}]
They are not connected.
So: obviously it doesn't work because the feedback needs to go to the first part of the code.
That isn't practical as I don't want all buttons flashing (blinking) when I press (and hold) one.
So I it is wired up correctly for the needs, but getting the second part to accept the input is where I am (now) stuck.
I'm guessing I need to use the inline coding to do that. But.... How?
As I said: inline needs to be contained in the style part.
There is no style part in the second part.
So, (semi-rhetorical) do I just wrap that line in a <style> bracket?
