-
Notifications
You must be signed in to change notification settings - Fork 1
/
demo.html
36 lines (31 loc) · 1.45 KB
/
demo.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width, minimum-scale=1.0, initial-scale=1.0, user-scalable=yes">
<title>html5-paper-input Demo</title>
<script src="../webcomponentsjs/webcomponents.js"></script>
<link rel="import" href="html5-paper-input.html">
<style>
.container{
height: auto;
padding: 20px;
}
html5-paper-input{
width: 250px;
}
</style>
</head>
<body unresolved>
<div class="container" layout vertical>
<html5-paper-input label="Simple input" floatinglabel></html5-paper-input>
<html5-paper-input label="Password field" type="password" floatinglabel></html5-paper-input>
<html5-paper-input label="Required field" required floatinglabel></html5-paper-input>
<html5-paper-input label="maxlength" maxlength="10" floatinglabel></html5-paper-input>
<html5-paper-input label="min and max" type="number" min="5" max="10" floatinglabel></html5-paper-input>
<html5-paper-input label="pattern:3 digits" pattern="[0-9]{3}" floatinglabel></html5-paper-input>
<html5-paper-input label="required and pattern" required pattern="[0-9]{3}" floatinglabel></html5-paper-input>
<html5-paper-input label="required on change validation" required commitvalidation floatinglabel></html5-paper-input>
<html5-paper-input label="Global error attribute" error="You must enter 3 digits" required pattern="[0-9]{3}" floatinglabel></html5-paper-input>
</div>
</body>
</html>