From 7699f61580215924e95cf417a10ad208bb9c27b1 Mon Sep 17 00:00:00 2001 From: Lucas Date: Thu, 1 Oct 2020 09:57:21 +0700 Subject: [PATCH] Add others input types --- docs/index.html | 69 ++++++++++++++++++++++++++++++++++++++++++++----- 1 file changed, 62 insertions(+), 7 deletions(-) diff --git a/docs/index.html b/docs/index.html index 1ecd9c9f..add92ddb 100644 --- a/docs/index.html +++ b/docs/index.html @@ -256,11 +256,11 @@ /* (Common styles) */ :root { - --primary-border: var(--primary) !important; - --primary-hover-border: var(--primary-hover) !important; - --input-hover-border: var(--primary) !important; - --input-focus: var(--primary-focus) !important; - --input-inverse: var(--primary-inverse) !important; + --primary-border: var(--primary); + --primary-hover-border: var(--primary-hover); + --input-hover-border: var(--primary); + --input-focus: var(--primary-focus); + --input-inverse: var(--primary-inverse); } @@ -799,7 +799,62 @@ </fieldset> -

Advanced example with all form elements supported in Pico here.

+

You can change a checkbox to indeterminate state by setting the indeterminate property of input checkboxes to true

+
+ + +
+ +

Others input types:

+
+ + + + + + +
<!-- File browser -->
+<label for="file">File browser
+  <input type="file" id="file" name="file">
+</label>
+
+<!-- Range slider -->
+<label for="range">Range slider
+  <input type="range" min="0" max="100" value="50" id="range" name="range">
+</label>
+
+<!-- Date -->
+<label for="date">Date
+  <input type="date" id="date" name="date">
+</label>
+
+<!-- Time -->
+<label for="time">Time
+  <input type="time" id="time" name="time">
+</label>
+
+<!-- Color -->
+<label for="color">Color
+  <input type="color" id="color" name="color" value="#0eaaaa">
+</label>
+ +
@@ -1129,7 +1184,7 @@

- Openly inspired by Bootstrap, Spectre, Wing, CSS Bed, Normalize & Sanitize
+ Openly inspired by Bootstrap, CSS Bed, Normalize, Sanitize, Spectre & Wing
Licensed under the MIT License