form-js
Version:
Create better ui form elements. Supports IE9+, all modern browsers, and mobile.
51 lines (42 loc) • 1.8 kB
HTML
<html lang="en">
<head>
<meta charset="utf-8">
<title>Element Kit - Demos</title>
<script data-main="demo" src="../external/requirejs/require.js"></script>
</head>
<body>
<h1 class="primary-title">Elements</h1>
<h2 class="secondary-title">Checkbox</h2>
<label>
<input type="checkbox" class="ui-checkbox-input" name="ny" /> New York
</label>
<h2 class="secondary-title">Button Toggles</h2>
<h3>Multi Select Button Toggle</h3>
<div class="multi-select-button-toggle">
<label for="button-toggle-multi-select-option1">
<input id="button-toggle-multi-select-option1" class="ui-button-toggle-input" type="checkbox" value="COPT1" name="option2" />
<span>Option 1</span>
</label>
<label for="button-toggle-multi-select-option2">
<input id="button-toggle-multi-select-option2" class="ui-button-toggle-input" type="checkbox" value= "COPT2" name="option2" checked="" />
<span class="toggle-copy">Option 2</span>
</label>
</div>
<h3>Single Select Button Toggle</h3>
<div class="single-select-button-toggle">
<label for="button-toggle-single-select-option1">
<input id="button-toggle-single-select-option1" class="ui-button-toggle-input" type="radio" value="ROPT1" name="options1" />
<span>Option 1</span>
</label>
<label for="button-toggle-single-select-option2">
<input id="button-toggle-single-select-option2" class="ui-button-toggle-input" type="radio" value="ROPT2" name="options1" checked="" />
<span class="toggle-copy">Option 2</span>
</label>
</div>
<h3>Input Field</h3>
<label for="name-input-field">
<input id="name-input-field" class="name-input-field" type="text" value="" placeholder="Enter your name" name="name" autocomplete="off" />
</label>
</body>
</html>