From c8cdbd8d6669b1eb1a5d2389893c2460bef73d76 Mon Sep 17 00:00:00 2001 From: Akshay Nair Date: Fri, 18 Aug 2023 09:40:18 +0530 Subject: feat: adds instance element access + gets the todo example functional --- examples/form/signup.css | 17 +++++++++++------ examples/form/style.css | 17 +++++++++-------- 2 files changed, 20 insertions(+), 14 deletions(-) (limited to 'examples/form') diff --git a/examples/form/signup.css b/examples/form/signup.css index e633243..3433b87 100644 --- a/examples/form/signup.css +++ b/examples/form/signup.css @@ -4,10 +4,11 @@ max-width: 700px; margin: 1rem auto; - --cssx-disgustingly-set-innerhtml: "

Sign-Up

"; + --count: '0'; + --cssx-disgustingly-set-innerhtml: + "

Sign-Up

"; --cssx-children: form#form; - --count: '0'; } .form-title { @@ -25,11 +26,15 @@ #form { display: block; - --cssx-on-submit: prevent-default() add-class(form, 'submitting') - request('/examples/') remove-class(form, 'submitting') - add-class(form, 'submitted'); + --cssx-on-submit: + prevent-default() + add-class(form, 'submitting') + request('/examples/') + remove-class(form, 'submitting') + add-class(form, 'submitted') + ; - --cssx-children: input#input-email input#input-password actions #message; + --cssx-children: input#input-email input#input-password #actions #message; } #form.submitted #message::after { display: block; diff --git a/examples/form/style.css b/examples/form/style.css index 63f758b..8229ef0 100644 --- a/examples/form/style.css +++ b/examples/form/style.css @@ -1,9 +1,7 @@ body { - --cssx-children: button#signup-btn signup-page; -} -body * { - box-sizing: border-box; + --cssx-children: button#signup-btn #signup-page; } +body * { box-sizing: border-box; } #signup-btn { display: inline-block; @@ -14,10 +12,13 @@ body * { padding: 0.5rem 1rem; cursor: pointer; - --cssx-on-click: add-class(signup-page, 'loading') - add-class(signup-btn, 'loading') delay(0.5s) + --cssx-on-click: + add-class(signup-page, 'loading') + add-class(signup-btn, 'loading') + delay(0.5s) load-cssx(signup-page-content, './signup.css') - remove-class(signup-page, 'loading') remove-class(signup-btn, 'loading'); + remove-class(signup-page, 'loading') + remove-class(signup-btn, 'loading'); } #signup-btn::after { content: 'Register now to start your free trial for $99'; @@ -31,7 +32,7 @@ body * { } #signup-page { - --cssx-children: signup-page-content; + --cssx-children: div#signup-page-content; } #signup-page.loading::after { content: 'Loading...'; -- cgit v1.3.1