From b6213f660b6a706f48289b492f305bc2f4620f80 Mon Sep 17 00:00:00 2001 From: Akshay Nair Date: Thu, 10 Aug 2023 14:18:02 +0530 Subject: feat: style injection --- examples/counter/index.html | 11 +++++++++++ examples/counter/style.css | 26 ++++++++++++++++++++++++++ 2 files changed, 37 insertions(+) create mode 100644 examples/counter/index.html create mode 100644 examples/counter/style.css (limited to 'examples') diff --git a/examples/counter/index.html b/examples/counter/index.html new file mode 100644 index 0000000..158ee16 --- /dev/null +++ b/examples/counter/index.html @@ -0,0 +1,11 @@ + + + + Counter example + + + + + + + diff --git a/examples/counter/style.css b/examples/counter/style.css new file mode 100644 index 0000000..9cf50e0 --- /dev/null +++ b/examples/counter/style.css @@ -0,0 +1,26 @@ +body { + --cssx-children: container todo-container; + --cssx-on-load: js(console.log("what have we done?!")); +} + +#container { + --cssx-children: counter btn-increment; + --count: '0'; +} + +#counter { +} +#counter::before { + content: "Count: " var(--count); +} + +#btn-increment { + display: inline-block; + padding: 0.5rem 1rem; + border: 1px solid gray; + + --cssx-on-click: update(container, --count, calc(var(--count) + 1)); +} +#btn-increment::after { + content: "Increment"; +} -- cgit v1.3.1