1 | <div class="pl-layout-platform {{screen}}">
|
2 |
|
3 | <header
|
4 | class="pl-layout-platform-header {{titleEmpty ? 'empty' : ''}} {{titleShowed ? 'show' : ''}}"
|
5 | style="
|
6 | left: {{titleLeft}}%;
|
7 | margin-left: {{titleLeftOffset}}px
|
8 | "
|
9 | >
|
10 | <div
|
11 | class="pl-layout-platform-title-bg {{titleOpened ? 'opened' : ''}}"
|
12 | style="
|
13 | margin-left: -{{titleBgLeftOffset}}px;
|
14 | width: {{titleBgWidth}}px;
|
15 | height: {{titleBgHeight}}px;"
|
16 | ></div>
|
17 |
|
18 | <rv-require
|
19 | name="pl-dropdown-title"
|
20 | class="pl-layout-title {{titleOpened ? 'opened' : ''}}"
|
21 | src="../dropdowns/pl-dropdown-title"
|
22 | data-placeholder="Apps"
|
23 | data-bind-titles="apps"
|
24 | ></rv-require>
|
25 | </header>
|
26 |
|
27 | <div class="pl-layout-platform-context-left" style="width: {{leftContextWidth}};">
|
28 | <rv-require
|
29 | data-pl-name="context-left"
|
30 | name="pl-context-panel"
|
31 | src="../context-panel/pl-context-panel"
|
32 | class="pl-context-panel-require media-mobile"
|
33 | data-use-leftcross="true"
|
34 | data-bind-on-cross="crossleftcontext"
|
35 | data-bind-title="contextlefttitle"
|
36 | data-bind-use-title="contextleftusetitle"
|
37 | >
|
38 | <rv-partial target="panels">
|
39 | {{> context-left-panels}}
|
40 | </rv-partial>
|
41 | </rv-require>
|
42 | </div>
|
43 |
|
44 | <div class="pl-layout-platform-context-right" style="width: {{rightContextWidth}};">
|
45 | <rv-require
|
46 | data-pl-name="context-right"
|
47 | name="pl-context-panel"
|
48 | src="../context-panel/pl-context-panel"
|
49 | class="pl-context-panel-require media-mobile"
|
50 | data-use-rightcross="true"
|
51 | data-bind-on-cross="crossrightcontext"
|
52 | data-bind-title="contextrighttitle"
|
53 | data-bind-use-title="contextrightusetitle"
|
54 | >
|
55 | <rv-partial target="panels">
|
56 | {{> context-right-panels}}
|
57 | </rv-partial>
|
58 | </rv-require>
|
59 | </div>
|
60 |
|
61 | <div class="pl-layout-platform-flyout-left">
|
62 | <rv-require
|
63 | data-pl-name="buttons-left"
|
64 | name="pl-grouped-buttons"
|
65 | src="../grouped-buttons/pl-grouped-buttons"
|
66 | data-bind-buttons="buttonsleft"
|
67 | data-orientation="left"
|
68 | ></rv-require>
|
69 | </div>
|
70 |
|
71 | <div class="pl-layout-platform-flyout-right">
|
72 | <rv-require
|
73 | data-pl-name="buttons-right"
|
74 | name="pl-grouped-buttons"
|
75 | src="../grouped-buttons/pl-grouped-buttons"
|
76 | data-bind-buttons="buttonsright"
|
77 | data-orientation="right"
|
78 | ></rv-require>
|
79 | </div>
|
80 |
|
81 | <div class="pl-layout-platform-content-template" style="left: {{contentLeft}}; right: {{contentRight}};"></div>
|
82 |
|
83 | <div class="pl-layout-platform-content {{contentMedia}}" style="left: {{contentLeft}}; right: {{contentRight}};">
|
84 | {{> content}}
|
85 | </div>
|
86 |
|
87 | {{#if usemask}}
|
88 | <div class="pl-layout-mask"></div>
|
89 | {{/if}}
|
90 |
|
91 | <rv-require
|
92 | name="pl-screen-message"
|
93 | src="../screen-message/pl-screen-message"
|
94 | ondemand="pl-screen-message"
|
95 | ></rv-require>
|
96 | </div>
|