forked from ashvin777/framework7.angular
-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathforms-buttons.html
executable file
·63 lines (62 loc) · 4.98 KB
/
forms-buttons.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
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
<div data-page="form-buttons" class="page">
<div class="navbar">
<div class="navbar-inner">
<div class="left"><a href="forms.html" class="back link"><i class="icon icon-back"></i></a></div>
<div class="center">Buttons</div>
<div class="right"><a href="#" class="link open-panel icon-only"><i class="icon icon-bars"></i></a></div>
</div>
</div>
<div class="page-content">
<div class="content-block-title">Flat Buttons</div>
<div class="content-block">
<p class="buttons-row"><a href="#" class="button">Button</a><a href="#" class="button">Button</a><a href="#" class="button">Button</a></p>
<p class="buttons-row"><a href="#" class="button">Button</a><a href="#" class="button">Button</a></p>
</div>
<div class="content-block-title">Raised Buttons</div>
<div class="content-block">
<p class="buttons-row"><a href="#" class="button button-raised">Button</a><a href="#" class="button button-raised">Button</a><a href="#" class="button button-raised">Button</a></p>
</div>
<div class="content-block-title">Raised Fill Buttons</div>
<div class="content-block">
<p class="buttons-row"><a href="#" class="button button-fill button-raised">Button</a><a href="#" class="button button-fill button-raised">Button</a><a href="#" class="button button-fill button-raised">Button</a></p>
</div>
<div class="content-block-title">Color Buttons</div>
<div class="content-block">
<p class="buttons-row"><a href="#" class="button color-red">Red</a><a href="#" class="button color-green">Green</a><a href="#" class="button color-blue">Blue</a></p>
<p class="buttons-row"><a href="#" class="button color-orange">Orange</a><a href="#" class="button color-pink">Pink</a><a href="#" class="button color-purple">Purple</a></p>
<p class="buttons-row"><a href="#" class="button color-cyan">Cyan</a><a href="#" class="button color-teal">Teal</a><a href="#" class="button color-indigo">Indigo</a></p>
</div>
<div class="content-block-title">Color Fill Buttons</div>
<div class="content-block">
<p class="buttons-row"><a href="#" class="button button-fill color-red">Red</a><a href="#" class="button button-fill color-green">Green</a><a href="#" class="button button-fill color-blue">Blue</a></p>
<p class="buttons-row"><a href="#" class="button button-fill color-orange">Orange</a><a href="#" class="button button-fill color-pink">Pink</a><a href="#" class="button button-fill color-purple">Purple</a></p>
<p class="buttons-row"><a href="#" class="button button-fill color-cyan">Cyan</a><a href="#" class="button button-fill color-teal">Teal</a><a href="#" class="button button-fill color-indigo">Indigo</a></p>
</div>
<div class="content-block-title">Color Raised Fill Buttons</div>
<div class="content-block">
<p class="buttons-row"><a href="#" class="button button-raised button-fill color-red">Red</a><a href="#" class="button button-raised button-fill color-green">Green</a><a href="#" class="button button-raised button-fill color-blue">Blue</a></p>
<p class="buttons-row"><a href="#" class="button button-raised button-fill color-orange">Orange</a><a href="#" class="button button-raised button-fill color-pink">Pink</a><a href="#" class="button button-raised button-fill color-purple">Purple</a></p>
<p class="buttons-row"><a href="#" class="button button-raised button-fill color-cyan">Cyan</a><a href="#" class="button button-raised button-fill color-teal">Teal</a><a href="#" class="button button-raised button-fill color-indigo">Indigo</a></p>
</div>
<div class="content-block-title">Color Ripple Buttons</div>
<div class="content-block">
<p class="buttons-row"><a href="#" class="button ripple-blue">Button</a><a href="#" class="button color-green ripple-pink">Button</a><a href="#" class="button color-teal ripple-amber">Button</a></p>
<p class="buttons-row"><a href="#" class="button button-raised button-fill color-orange ripple-green">Button</a><a href="#" class="button button-raised button-fill color-pink ripple-blue">Button</a><a href="#" class="button button-raised button-fill color-purple ripple-yellow">Button</a></p>
</div>
<div class="content-block-title">Big Buttons</div>
<div class="content-block">
<p class="buttons-row"><a href="#" class="button button-big color-green">Button</a><a href="#" class="button button-big color-red">Button</a></p>
<p class="buttons-row"><a href="#" class="button button-big button-fill button-raised color-pink">Button</a><a href="#" class="button button-big button-fill button-raised color-teal">Button</a></p>
</div>
<div class="content-block-title">List Block Buttons</div>
<div class="card">
<div class="list-block">
<ul>
<li><a href="#" class="list-button item-link">List Button 1</a></li>
<li><a href="#" class="list-button item-link">List Button 2</a></li>
<li><a href="#" class="list-button item-link">List Button 2</a></li>
</ul>
</div>
</div>
</div>
</div>