diff options
| author | Akshay Nair <phenax5@gmail.com> | 2023-08-11 20:42:27 +0530 |
|---|---|---|
| committer | Akshay Nair <phenax5@gmail.com> | 2023-08-11 20:42:27 +0530 |
| commit | e0cc82460c0fec4336037996c23947ab39ba4015 (patch) | |
| tree | ae5123e2d2f24ab519a9f6ddd2e800ca1b38134d /examples/api/signup.css | |
| parent | 695365fa359fb98f14d06c205159739077f67fed (diff) | |
| download | css-everything-e0cc82460c0fec4336037996c23947ab39ba4015.tar.gz css-everything-e0cc82460c0fec4336037996c23947ab39ba4015.zip | |
refactor: renames form submit example
Diffstat (limited to 'examples/api/signup.css')
| -rw-r--r-- | examples/api/signup.css | 77 |
1 files changed, 0 insertions, 77 deletions
diff --git a/examples/api/signup.css b/examples/api/signup.css deleted file mode 100644 index c5970c7..0000000 --- a/examples/api/signup.css +++ /dev/null @@ -1,77 +0,0 @@ - -#signup-page-content { - border: 1px solid #888; - padding: 1rem; - max-width: 700px; - margin: 1rem auto; - - --cssx-children: form#form; - --count: '0'; -} - -#signup-page-content::before { - content: "Sign-Up"; - display: block; - font-size: 2rem; - border-bottom: 1px solid gray; -} - -#form { - display: block; - - --cssx-on-submit: - prevent-default() - add-class(form, 'submitting') - request('https://httpbin.org/post', POST) - remove-class(form, 'submitting') - add-class(form, 'submitted') - ; - - --cssx-children: input#input-email input#input-password actions #message; -} -#form.submitted #message::after { - display: block; - content: "Form submitted successfully"; -} -#form.submitting #submit-btn { - pointer-events: none; - opacity: .5; -} - -#form input { - display: block; - width: 100%; - padding: 0.4rem 0.8rem; - margin-top: 1rem; -} - -#input-email { - --cssx-on-mount: - set-attr('type', 'email') - set-attr('name', 'email') - set-attr('required', 'true') - set-attr('placeholder', 'Email. Eg:- mail@postbox.com') - ; -} - -#input-password { - --cssx-on-mount: - set-attr('type', 'password') - set-attr('name', 'password') - set-attr('required', 'true') - set-attr('placeholder', 'Password. Eg:- password, password1, password2, password123') - ; -} - -#actions { - text-align: right; - padding-top: 1rem; - --cssx-children: button#submit-btn; -} - -#submit-btn { - padding: 0.4rem 0.7rem; - --cssx-on-mount: set-attr('type', 'submit'); -} -#submit-btn::after { content: "Sign-Up"; } - |
