-
Notifications
You must be signed in to change notification settings - Fork 10
/
Copy pathremain
139 lines (115 loc) · 6.3 KB
/
remain
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
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
<div class="panel" data-component="lists">
<div>
<div class="lists material-layout part">
<header class="titles">
<h3>Lists <a href="javascript:void(0)" class="material-btn-blue" data-action="close-toggle">open </a></h3>
</header>
</div>
</div>
</div>
<span class="divider"></span>
<div class="material-animations material-layout part">
<header class="titles">
<h3>Effects & Animations <a href="javascript:void(0)" class="material-btn-blue" data-action="close-toggle">Open </a></32>
</header>
<section class="toggle">
<header>
<a href="javascript:void(0)" id="reload" class="material-btn-blue btn-ico-right">Reload <span class="m-icon ic_autorenew right white"></span></a>
</header>
<div class="bit-2">
<ul class="material-list-seam hierarchical-timing">
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
</ul>
</div>
<div class="bit-2">
<ul class="material-list-step hierarchical-timing">
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
<li>Item</li>
</ul>
</div>
</section>
</div>
<span class="divider"></span>
<div class="icons part">
<header class="titles">
<h3>Icons <a href="javascript:void(0)" class="material-btn-blue" data-action="close-toggle">Open </a></h3>
</header>
<section class="toggle">
<a href="http://codepen.io/LukyVj/pen/PwPwYR" target="_blank">Open the icons on an other page</a>
</section>
</div>
<span class="divider"></span>
<div class="icons part">
<header class="titles">
<h3>Inputs <a href="javascript:void(0)" class="material-btn-blue" data-action="close-toggle">open</a></h3>
</header>
<section class="toggle">
<input type="text" placeholder="name" class="m-input-blue" />
<input type="text" placeholder="name" class="m-input-red" />
<input type="text" placeholder="name" class="m-input-green" />
</section>
</div>
<span class="divider"></span>
<div class="dropd part">
<header class="titles">
<h3>Dropdown <a href="javascript:void(0)" class="material-btn-blue" data-action="close-toggle">open</a></h3>
</header>
<section class="toggle">
<div class="dropdown">
<span class="dropdown-title">Open the list</span>
<ul class="dp-wide">
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
</ul>
</div>
<div class="dropdown">
<span class="dropdown-title">Open the list</span>
<ul class="dp-regular">
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
</ul>
</div>
<div class="dropdown">
<span class="dropdown-title">Open the list</span>
<ul class="dp-small">
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
<li><a href="#" class="btn-flat">Item</a></li>
</ul>
</div>
</section>
</div>
<span class="divider"></span>
<div class="tooltip part">
<header class="titles">
<h3>Tooltips <a href="javascript:void(0)" class="material-btn-blue" data-action="close-toggle">open</a></h3>
</header>
<section class="toggle">
<p class="text-flow">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ea atque iure veritatis maiores. Possimus at laudantium ab <span class="m-tooltip-left" data-tooltip-content="Hello">LEFT</span>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Omnis eveniet, vitae molestias <span class="m-tooltip-bottom" data-tooltip-content="Hi my name is Lucas">BOTTOM</span> tempore in magnam officiis assumenda natus, ipsum, alias reprehenderit deserunt? Esse debitis nostrum tenetur porro, aliquam amet!
<span class="m-tooltip-top" data-tooltip-content="I'm currently creating some tooltips">TOP</span> deserunt perferendis animi sapiente! Eveniet necessitatibus earum fuga voluptatibus <span class="m-tooltip-right" data-tooltip-content="With short and long descriptions, to fit to your wishes">RIGHT</span> accusamus quo et dolore.</p>
</section>
</div>
</div>
</div>
</div>