1 | <div
|
2 | class="
|
3 | pl-dropdown-title
|
4 | {{ opened ? 'opened' : '' }}
|
5 | {{ noAnimation ? 'no-animation' : '' }}
|
6 | {{ noCaret ? 'no-caret' : '' }}
|
7 | "
|
8 | on-click="mainClick"
|
9 | >
|
10 | <div class="pl-dropdown-placeholder"><span>{{placeholder}}</span></div>
|
11 |
|
12 | <h2
|
13 | class="{{ titles.length > 1 ? 'list' : '' }}"
|
14 | on-click="toggle"
|
15 | style="
|
16 | -webkit-transform: translateY({{ opened ? (selected.index + 1) * 40 : 0 }}px);
|
17 | -moz-transform: translateY({{ opened ? (selected.index + 1) * 40 : 0 }}px);
|
18 | -ms-transform: translateY({{ opened ? (selected.index + 1) * 40 : 0 }}px);
|
19 | -o-transform: translateY({{ opened ? (selected.index + 1) * 40 : 0 }}px);
|
20 | transform: translateY({{ opened ? (selected.index + 1) * 40 : 0 }}px);
|
21 | "
|
22 | >
|
23 | <span>{{selected.name}}</span>
|
24 | <i class="fa fa-caret-down"></i>
|
25 | </h2>
|
26 |
|
27 | <ul class="pl-dropdown-title-list">
|
28 |
|
29 | {{#titles:i}}
|
30 | <li on-click="select(i)">
|
31 | <span
|
32 | class="{{ this.selected ? 'hidden' : '' }}"
|
33 | style="
|
34 | -webkit-transition-delay: {{i * 0.05}}s;
|
35 | -moz-transition-delay: {{i * 0.05}}s;
|
36 | -ms-transition-delay: {{i * 0.05}}s;
|
37 | -o-transition-delay: {{i * 0.05}}s;
|
38 | transition-delay: {{i * 0.05}}s;
|
39 | "
|
40 | >{{name}}</span>
|
41 | </li>
|
42 | {{/titles}}
|
43 |
|
44 | </ul>
|
45 | </div>
|