diff options
Diffstat (limited to 'shared/style/input_areas')
-rw-r--r-- | shared/style/input_areas/images/icons/clear.png | bin | 0 -> 3278 bytes | |||
-rw-r--r-- | shared/style/input_areas/images/ui/active.png | bin | 0 -> 956 bytes | |||
-rw-r--r-- | shared/style/input_areas/images/ui/background.png | bin | 0 -> 936 bytes | |||
-rw-r--r-- | shared/style/input_areas/images/ui/separator.png | bin | 0 -> 1000 bytes | |||
-rw-r--r-- | shared/style/input_areas/images/ui/shadow-invert.png | bin | 0 -> 932 bytes | |||
-rw-r--r-- | shared/style/input_areas/images/ui/shadow-search.png | bin | 0 -> 930 bytes | |||
-rw-r--r-- | shared/style/input_areas/images/ui/shadow.png | bin | 0 -> 927 bytes | |||
-rw-r--r-- | shared/style/input_areas/index.html | 123 |
8 files changed, 123 insertions, 0 deletions
diff --git a/shared/style/input_areas/images/icons/clear.png b/shared/style/input_areas/images/icons/clear.png Binary files differnew file mode 100644 index 0000000..9990d01 --- /dev/null +++ b/shared/style/input_areas/images/icons/clear.png diff --git a/shared/style/input_areas/images/ui/active.png b/shared/style/input_areas/images/ui/active.png Binary files differnew file mode 100644 index 0000000..f81fb43 --- /dev/null +++ b/shared/style/input_areas/images/ui/active.png diff --git a/shared/style/input_areas/images/ui/background.png b/shared/style/input_areas/images/ui/background.png Binary files differnew file mode 100644 index 0000000..dce3df4 --- /dev/null +++ b/shared/style/input_areas/images/ui/background.png diff --git a/shared/style/input_areas/images/ui/separator.png b/shared/style/input_areas/images/ui/separator.png Binary files differnew file mode 100644 index 0000000..32bcc46 --- /dev/null +++ b/shared/style/input_areas/images/ui/separator.png diff --git a/shared/style/input_areas/images/ui/shadow-invert.png b/shared/style/input_areas/images/ui/shadow-invert.png Binary files differnew file mode 100644 index 0000000..1694bbf --- /dev/null +++ b/shared/style/input_areas/images/ui/shadow-invert.png diff --git a/shared/style/input_areas/images/ui/shadow-search.png b/shared/style/input_areas/images/ui/shadow-search.png Binary files differnew file mode 100644 index 0000000..234e7e4 --- /dev/null +++ b/shared/style/input_areas/images/ui/shadow-search.png diff --git a/shared/style/input_areas/images/ui/shadow.png b/shared/style/input_areas/images/ui/shadow.png Binary files differnew file mode 100644 index 0000000..3739f71 --- /dev/null +++ b/shared/style/input_areas/images/ui/shadow.png diff --git a/shared/style/input_areas/index.html b/shared/style/input_areas/index.html new file mode 100644 index 0000000..20eafa4 --- /dev/null +++ b/shared/style/input_areas/index.html @@ -0,0 +1,123 @@ +<!DOCTYPE html> +<html dir="ltr"> +<head> + <meta charset="utf-8"> + + <title>Input areas</title> + <link rel="stylesheet" href="../input_areas.css"> + + <!-- + This <style> and <link> is only used for the example code, is no needed for the real case use + --> + <style> + html, body { + margin: 0; + padding: 0; + font-size: 10px; + background-color: #fff; + } + body { background: none; } + h2.bb-docs { + padding: 0.4rem 3rem; + margin: -0.1rem 0 0; + border: solid 0.1rem #e8e8e8; + color: #666; + font-size: 1.8rem; + font-family: "MozTT", Sans-serif; + font-weight: lighter; + background-color: #f5f5f5; + } + form { margin: 1rem 2rem; } + </style> +</head> + +<body role="application"> + + <h2 class="bb-docs">Default inputs</h2> + <form> + <p> + <input type="text" placeholder="Placeholder" required> + <button type="reset">Clear</button> + </p> + + <p> + <textarea placeholder="Placeholder in textarea" required></textarea> + <button type="reset">Clear</button> + </p> + + <p> + <input type="text" placeholder="Placeholder" value="Some written text" required> + <button type="reset">Clear</button> + </p> + </form> + + <h2 class="bb-docs">Fieldset</h2> + <form> + <fieldset> + <legend class="action">Mobile</legend> + <section> + <p> + <input type="tel" placeholder="Phone number" required> + <button type="reset">Clear</button> + </p> + <p> + <input type="text" placeholder="Name" value="Jessy James" required> + <button type="reset">Clear</button> + </p> + </section> + </fieldset> + + <fieldset> + <legend>Work</legend> + <section> + <p> + <input type="tel" placeholder="Email" required> + <button type="reset">Clear</button> + </p> + </section> + </fieldset> + </form> + + <h2 class="bb-docs">Input forms</h2> + + <!-- form used at the top of the page with fixed/absolute position and content scrolls underneath --> + <form role="search"> + <button type="submit">Cancel</button> + <p> + <input type="text" placeholder="search term here..." required> + <button type="reset">Clear</button> + </p> + </form> + + <!-- form used under a header, this form scrolls together with the content underneath the header --> + <section role="region"> + <header> + <!-- here should be the content of the header --> + </header> + <form role="search" class="full"> + <button type="submit">Send</button> + <p> + <input type="text" placeholder="search term here..." required> + <button type="reset">Clear</button> + </p> + </form> + </section> + + <form role="search" class="bottom"> + <button type="submit">Send</button> + <p> + <input type="text" required> + <button type="reset">Clear</button> + </p> + </form> + + <form role="search" class="bottom"> + <button type="submit">Send</button> + <p> + <textarea placeholder="Placeholder in textarea" required></textarea> + <button type="reset">Clear</button> + </p> + </form> + +</body> +</html>
\ No newline at end of file |