bootstrap-bookingsync-sass 1.0.0.beta2 → 1.0.0.beta3
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/CHANGELOG.md +13 -0
- data/assets/javascripts/bookingsync/menu.js +51 -5
- data/assets/stylesheets/_bootstrap-bookingsync.scss +1 -0
- data/assets/stylesheets/bookingsync/_layout.scss +39 -12
- data/assets/stylesheets/bookingsync/_menu.scss +23 -1
- data/assets/stylesheets/bookingsync/_navbar.scss +6 -0
- data/assets/stylesheets/bookingsync/_navs.scss +60 -0
- data/assets/stylesheets/bookingsync/_sheet.scss +0 -58
- data/assets/stylesheets/bookingsync/_variables.scss +1 -0
- data/docs/Gemfile.lock +1 -1
- data/docs/Rakefile +1 -1
- data/docs/content/components/menu.md +4 -4
- data/docs/content/compositions/_navbar.html +8 -4
- data/docs/content/compositions/compositions.md +186 -35
- data/docs/content/embed/annotated_section.html +1 -3
- data/docs/content/embed/annotated_section_with_tabulated_content.html +49 -0
- data/docs/content/embed/app_admin.html +50 -6
- data/docs/content/embed/app_admin__content.html +37 -0
- data/docs/content/embed/app_admin_with_menu.html +174 -0
- data/docs/content/embed/app_admin_with_menu__content.html +79 -0
- data/docs/content/embed/core_admin.html +4 -4
- data/docs/content/embed/fullscreen_modal.html +1 -1
- data/docs/content/embed/menu.html +3 -3
- data/docs/content/embed/nested_section.html +5 -4
- data/docs/content/embed/section.html +1 -1
- data/docs/content/embed/tabulated_content.html +1 -1
- data/docs/content/embed/two_columns.html +1 -1
- data/lib/bootstrap/bookingsync/version.rb +1 -1
- metadata +7 -3
- data/docs/content/embed/app_admin_content.html +0 -70
|
@@ -13,6 +13,9 @@
|
|
|
13
13
|
<nav id="sidebar" class="menu menu-fixed flex-col">
|
|
14
14
|
...
|
|
15
15
|
</nav>
|
|
16
|
+
<nav id="sidebar-settings" class="menu menu-fixed flex-col menu-submenu menu-submenu-collapsed">
|
|
17
|
+
...
|
|
18
|
+
</nav>
|
|
16
19
|
<div class="sided-content">
|
|
17
20
|
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
|
|
18
21
|
<div class="container-fluid">
|
|
@@ -33,7 +36,7 @@
|
|
|
33
36
|
</button>
|
|
34
37
|
<div class="navbar-brand-container">
|
|
35
38
|
<span class="navbar-brand">
|
|
36
|
-
<h1><i class="icon-rental"></i> Rentals</h1>
|
|
39
|
+
<h1 class="text-overflow"><i class="icon-rental"></i> Rentals</h1>
|
|
37
40
|
</span>
|
|
38
41
|
</div>
|
|
39
42
|
</div>
|
|
@@ -55,14 +58,16 @@
|
|
|
55
58
|
|
|
56
59
|
<div class="example example-responsive">
|
|
57
60
|
<div class="sheet-header">
|
|
58
|
-
<h3 id="app-admin">App
|
|
61
|
+
<h3 id="app-admin">App admin</h3>
|
|
59
62
|
</div>
|
|
60
63
|
|
|
61
64
|
<div class="bs-callout bs-callout-info">
|
|
62
65
|
<h4>Information</h4>
|
|
63
66
|
<p>
|
|
64
|
-
|
|
65
|
-
|
|
67
|
+
On mobile devices, the parent iframe overlay a toggle button over the iframe to toggle the parent frame menu.
|
|
68
|
+
</p>
|
|
69
|
+
<p>
|
|
70
|
+
This can be replaced by your own toggle button as presented in the <a href="/compositions/#app-admin-with-menu">App admin with menu</a> example.
|
|
66
71
|
</p>
|
|
67
72
|
</div>
|
|
68
73
|
|
|
@@ -73,28 +78,128 @@
|
|
|
73
78
|
</div>
|
|
74
79
|
</div>
|
|
75
80
|
~~~ html
|
|
76
|
-
<
|
|
81
|
+
<div class="menu-toggle-hideable">
|
|
82
|
+
<button type="button" class="navbar-toggle menu-toggle" data-toggle="toggle"
|
|
83
|
+
data-target="body" data-value="menu-open">
|
|
84
|
+
<span class="sr-only">Toggle Navigation</span>
|
|
85
|
+
<span class="icon-bar"></span>
|
|
86
|
+
<span class="icon-bar"></span>
|
|
87
|
+
<span class="icon-bar"></span>
|
|
88
|
+
</button>
|
|
89
|
+
</div>
|
|
90
|
+
<nav id="sidebar" class="menu menu-fixed flex-col menu-folded">
|
|
91
|
+
...
|
|
92
|
+
</nav>
|
|
93
|
+
<nav id="sidebar-settings" class="menu menu-fixed flex-col menu-submenu menu-submenu-collapsed">
|
|
77
94
|
...
|
|
78
95
|
</nav>
|
|
79
|
-
<
|
|
96
|
+
<div class="sided-content-full">
|
|
97
|
+
<iframe class="iframe-fullscreen"
|
|
98
|
+
src="/embed/app_admin__content/index.html"
|
|
99
|
+
frameborder="0"></iframe>
|
|
100
|
+
</div>
|
|
80
101
|
|
|
81
102
|
<!-- iFrame content -->
|
|
82
|
-
<nav class="
|
|
103
|
+
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
|
|
83
104
|
...
|
|
84
105
|
</nav>
|
|
85
|
-
<
|
|
106
|
+
<section class="main-content">
|
|
107
|
+
<div class="sheet">
|
|
108
|
+
<p>Body</p>
|
|
109
|
+
</div>
|
|
110
|
+
</section>
|
|
111
|
+
~~~
|
|
112
|
+
|
|
113
|
+
<div class="example example-responsive">
|
|
114
|
+
<div class="sheet-header">
|
|
115
|
+
<h3 id="app-admin-with-menu">App admin with menu</h3>
|
|
116
|
+
</div>
|
|
117
|
+
|
|
118
|
+
<div class="bs-callout bs-callout-info">
|
|
119
|
+
<h4>Information</h4>
|
|
120
|
+
<p>
|
|
121
|
+
On mobile devices, the parent iframe overlay a toggle button over the iframe to toggle the parent frame menu.
|
|
122
|
+
</p>
|
|
123
|
+
<p>
|
|
124
|
+
Using the <code>menu</code> plugin, your iframe is able to connect its own menu with the parent's frame one. You simply need to add the class <code>menu-toggle-parent-frame</code> to your toggle button, which will also remove the parent frame toggle button that was initialy present as long as it's having the class <code>menu-toggle-hideable</code>.
|
|
125
|
+
</p>
|
|
126
|
+
</div>
|
|
127
|
+
|
|
128
|
+
<div class="bs-example bs-sheet bs-example-composition-body bs-example-iframe-container-desktop"
|
|
129
|
+
data-example-id="app-admin-with-menu">
|
|
130
|
+
<iframe class="bs-example-iframe" src="/embed/app_admin_with_menu/index.html"
|
|
131
|
+
frameborder="0"></iframe>
|
|
132
|
+
</div>
|
|
133
|
+
</div>
|
|
134
|
+
~~~ html
|
|
135
|
+
<div class="menu-toggle-hideable">
|
|
136
|
+
<button type="button" class="navbar-toggle menu-toggle" data-toggle="toggle"
|
|
137
|
+
data-target="body" data-value="menu-open">
|
|
138
|
+
<span class="sr-only">Toggle Navigation</span>
|
|
139
|
+
<span class="icon-bar"></span>
|
|
140
|
+
<span class="icon-bar"></span>
|
|
141
|
+
<span class="icon-bar"></span>
|
|
142
|
+
</button>
|
|
143
|
+
</div>
|
|
144
|
+
<nav id="sidebar" class="menu menu-fixed flex-col menu-folded">
|
|
145
|
+
...
|
|
146
|
+
</nav>
|
|
147
|
+
<nav id="sidebar-settings" class="menu menu-fixed flex-col menu-submenu menu-submenu-collapsed">
|
|
148
|
+
...
|
|
149
|
+
</nav>
|
|
150
|
+
<div class="sided-content-full">
|
|
151
|
+
<iframe class="iframe-fullscreen"
|
|
152
|
+
src="/embed/app_admin_with_menu__content/index.html"
|
|
153
|
+
frameborder="0"></iframe>
|
|
154
|
+
</div>
|
|
155
|
+
|
|
156
|
+
<!-- iFrame content -->
|
|
157
|
+
<nav class="menu menu-fixed flex-col menu-submenu menu-app">
|
|
158
|
+
...
|
|
159
|
+
</nav>
|
|
160
|
+
<div class="sided-content-with-menu">
|
|
86
161
|
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
|
|
87
|
-
|
|
162
|
+
<div class="container-fluid">
|
|
163
|
+
<div class="navbar-header">
|
|
164
|
+
<button type="button"
|
|
165
|
+
class="navbar-toggle menu-toggle menu-toggle-parent-frame"
|
|
166
|
+
data-toggle="toggle"
|
|
167
|
+
data-target="body" data-value="menu-open">
|
|
168
|
+
<span class="sr-only">Toggle Navigation</span>
|
|
169
|
+
<span class="icon-bar"></span>
|
|
170
|
+
<span class="icon-bar"></span>
|
|
171
|
+
<span class="icon-bar"></span>
|
|
172
|
+
</button>
|
|
173
|
+
<button type="button" class="navbar-toggle navbar-toggle-context"
|
|
174
|
+
data-toggle="collapse" data-target=".navbar-top-collapse">
|
|
175
|
+
<span class="sr-only">Toggle Navigation</span>
|
|
176
|
+
<span class="icon-bar"></span>
|
|
177
|
+
<span class="icon-bar"></span>
|
|
178
|
+
<span class="icon-bar"></span>
|
|
179
|
+
</button>
|
|
180
|
+
<div class="navbar-brand-container">
|
|
181
|
+
<span class="navbar-brand">
|
|
182
|
+
<h1 class="text-overflow"><i class="icon-rental"></i> Rentals</h1>
|
|
183
|
+
</span>
|
|
184
|
+
</div>
|
|
185
|
+
</div>
|
|
186
|
+
<div class="collapse navbar-collapse navbar-top-collapse">
|
|
187
|
+
<div class="navbar-right">
|
|
188
|
+
<button class="btn btn-secondary navbar-btn" type="button">Button</button>
|
|
189
|
+
<button class="btn btn-primary navbar-btn" type="button">Call to action</button>
|
|
190
|
+
</div>
|
|
191
|
+
</div>
|
|
192
|
+
</div>
|
|
88
193
|
</nav>
|
|
89
194
|
<section class="main-content">
|
|
90
195
|
<div class="sheet">
|
|
91
|
-
<p
|
|
196
|
+
<p>...</p>
|
|
92
197
|
</div>
|
|
93
198
|
</section>
|
|
94
199
|
</div>
|
|
95
200
|
~~~
|
|
96
201
|
|
|
97
|
-
<div class="example">
|
|
202
|
+
<div class="example example-responsive">
|
|
98
203
|
<div class="sheet-header">
|
|
99
204
|
<h3 id="section">Section</h3>
|
|
100
205
|
</div>
|
|
@@ -118,7 +223,7 @@
|
|
|
118
223
|
</button>
|
|
119
224
|
<div class="navbar-brand-container">
|
|
120
225
|
<span class="navbar-brand">
|
|
121
|
-
<h1><i class="icon-rental"></i> Rentals</h1>
|
|
226
|
+
<h1 class="text-overflow"><i class="icon-rental"></i> Rentals</h1>
|
|
122
227
|
</span>
|
|
123
228
|
</div>
|
|
124
229
|
</div>
|
|
@@ -137,7 +242,7 @@
|
|
|
137
242
|
</section>
|
|
138
243
|
~~~
|
|
139
244
|
|
|
140
|
-
<div class="example">
|
|
245
|
+
<div class="example example-responsive">
|
|
141
246
|
<div class="sheet-header">
|
|
142
247
|
<h3 id="nested-section">Nested Section</h3>
|
|
143
248
|
</div>
|
|
@@ -161,12 +266,13 @@
|
|
|
161
266
|
</button>
|
|
162
267
|
<div class="navbar-brand-container">
|
|
163
268
|
<span class="navbar-brand">
|
|
164
|
-
<h1>
|
|
165
|
-
<
|
|
166
|
-
|
|
269
|
+
<h1 class="text-overflow">
|
|
270
|
+
<i class="icon-calendar"></i>
|
|
271
|
+
<span class="navbar-breadcrumb hidden-xs">
|
|
272
|
+
<a href="#">Bookings</a>
|
|
167
273
|
/
|
|
168
274
|
</span>
|
|
169
|
-
|
|
275
|
+
A very long section name
|
|
170
276
|
</h1>
|
|
171
277
|
</span>
|
|
172
278
|
</div>
|
|
@@ -198,6 +304,41 @@
|
|
|
198
304
|
</div>
|
|
199
305
|
</div>
|
|
200
306
|
|
|
307
|
+
<div class="example">
|
|
308
|
+
<div class="sheet-header">
|
|
309
|
+
<h3 id="tabulated-content">Tabulated content</h3>
|
|
310
|
+
</div>
|
|
311
|
+
|
|
312
|
+
<div class="bs-example bs-sheet bs-example-composition-body bs-example-iframe-container-desktop"
|
|
313
|
+
data-example-id="tabulated-content">
|
|
314
|
+
<iframe class="bs-example-iframe" src="/embed/tabulated_content/index.html"
|
|
315
|
+
frameborder="0"></iframe>
|
|
316
|
+
</div>
|
|
317
|
+
</div>
|
|
318
|
+
~~~ html
|
|
319
|
+
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
|
|
320
|
+
...
|
|
321
|
+
</nav>
|
|
322
|
+
<section class="main-content">
|
|
323
|
+
<div class="sheet">
|
|
324
|
+
<ul class="nav nav-tabs" data-toggle="stackable" data-target=".stackable-dropdown">
|
|
325
|
+
<li class="active"><a href="#">Tab 1</a></li>
|
|
326
|
+
<li><a href="#">Tab 2</a></li>
|
|
327
|
+
<li class="dropdown pull-right stackable-dropdown">
|
|
328
|
+
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
|
329
|
+
More <span class="caret"></span>
|
|
330
|
+
</a>
|
|
331
|
+
<ul class="dropdown-menu">
|
|
332
|
+
</ul>
|
|
333
|
+
</li>
|
|
334
|
+
</ul>
|
|
335
|
+
<div>
|
|
336
|
+
<p>Text...</p>
|
|
337
|
+
</div>
|
|
338
|
+
</div>
|
|
339
|
+
</section>
|
|
340
|
+
~~~
|
|
341
|
+
|
|
201
342
|
<div class="example example-responsive">
|
|
202
343
|
<div class="sheet-header">
|
|
203
344
|
<h3 id="annotated-section">Annotated Section</h3>
|
|
@@ -239,12 +380,15 @@
|
|
|
239
380
|
|
|
240
381
|
<div class="example">
|
|
241
382
|
<div class="sheet-header">
|
|
242
|
-
<h3 id="tabulated-content">
|
|
383
|
+
<h3 id="annotated-section-with-tabulated-content">
|
|
384
|
+
Annotated section with tabulated content
|
|
385
|
+
</h3>
|
|
243
386
|
</div>
|
|
244
387
|
|
|
245
388
|
<div class="bs-example bs-sheet bs-example-composition-body bs-example-iframe-container-desktop"
|
|
246
|
-
data-example-id="tabulated-content">
|
|
247
|
-
<iframe class="bs-example-iframe"
|
|
389
|
+
data-example-id="annotated-section-with-tabulated-content">
|
|
390
|
+
<iframe class="bs-example-iframe"
|
|
391
|
+
src="/embed/annotated_section_with_tabulated_content/index.html"
|
|
248
392
|
frameborder="0"></iframe>
|
|
249
393
|
</div>
|
|
250
394
|
</div>
|
|
@@ -253,22 +397,29 @@
|
|
|
253
397
|
...
|
|
254
398
|
</nav>
|
|
255
399
|
<section class="main-content">
|
|
256
|
-
<
|
|
257
|
-
<
|
|
258
|
-
<
|
|
259
|
-
<
|
|
260
|
-
<
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
<
|
|
265
|
-
</
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
400
|
+
<section class="annotated-section">
|
|
401
|
+
<header class="annotated-section-annotation">
|
|
402
|
+
<h2 class="annotated-section-title">Section Name</h2>
|
|
403
|
+
<p>Curabitur blandit tempus porttitor. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</p>
|
|
404
|
+
<p><a href="#">More Information</a></p>
|
|
405
|
+
</header>
|
|
406
|
+
<div class="annotated-section-content">
|
|
407
|
+
<ul class="nav nav-tabs" data-toggle="stackable" data-target=".stackable-dropdown">
|
|
408
|
+
<li class="active"><a href="#">Tab 1</a></li>
|
|
409
|
+
<li><a href="#">Tab 2</a></li>
|
|
410
|
+
<li class="dropdown pull-right stackable-dropdown">
|
|
411
|
+
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
|
412
|
+
More <span class="caret"></span>
|
|
413
|
+
</a>
|
|
414
|
+
<ul class="dropdown-menu">
|
|
415
|
+
</ul>
|
|
416
|
+
</li>
|
|
417
|
+
</ul>
|
|
418
|
+
<div>
|
|
419
|
+
<p>Body</p>
|
|
420
|
+
</div>
|
|
270
421
|
</div>
|
|
271
|
-
</
|
|
422
|
+
</section>
|
|
272
423
|
</section>
|
|
273
424
|
~~~
|
|
274
425
|
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
</button>
|
|
11
11
|
<div class="navbar-brand-container">
|
|
12
12
|
<span class="navbar-brand">
|
|
13
|
-
<h1><i class="icon-reviews"></i> Section Name</h1>
|
|
13
|
+
<h1 class="text-overflow"><i class="icon-reviews"></i> Section Name</h1>
|
|
14
14
|
</span>
|
|
15
15
|
</div>
|
|
16
16
|
</div>
|
|
@@ -34,8 +34,6 @@
|
|
|
34
34
|
<p>Aenean consectetur in metus sit amet suscipit. Phasellus faucibus ornare tortor sit amet vestibulum. Nulla felis nisl, vestibulum vitae interdum vel, venenatis vitae lacus. Nullam tempus ante ut nibh pharetra, in consequat justo iaculis. Curabitur viverra, orci eu hendrerit malesuada, sapien ex varius sapien, id laoreet diam magna et mi. Fusce finibus justo quis egestas fermentum. Aliquam rhoncus orci libero, ut faucibus felis egestas et. Proin vitae eros lacus. Nulla facilisi. Maecenas ut lacinia justo. Nulla at erat non orci gravida convallis. Aliquam congue leo odio, eu sagittis mauris hendrerit sed. Duis eros augue, viverra ac justo ut, pulvinar venenatis urna. Cras auctor fermentum massa, mattis fringilla neque vehicula et. Ut vitae est a velit accumsan tempus. Duis vel congue risus.</p>
|
|
35
35
|
</div>
|
|
36
36
|
</section>
|
|
37
|
-
</section>
|
|
38
|
-
<section class="main-content">
|
|
39
37
|
<section class="annotated-section">
|
|
40
38
|
<header class="annotated-section-annotation">
|
|
41
39
|
<h2 class="annotated-section-title">Section Name</h2>
|
|
@@ -0,0 +1,49 @@
|
|
|
1
|
+
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
|
|
2
|
+
<div class="container-fluid">
|
|
3
|
+
<div class="navbar-header">
|
|
4
|
+
<button type="button" class="navbar-toggle navbar-toggle-context"
|
|
5
|
+
data-toggle="collapse" data-target=".navbar-top-collapse">
|
|
6
|
+
<span class="sr-only">Toggle Navigation</span>
|
|
7
|
+
<span class="icon-bar"></span>
|
|
8
|
+
<span class="icon-bar"></span>
|
|
9
|
+
<span class="icon-bar"></span>
|
|
10
|
+
</button>
|
|
11
|
+
<div class="navbar-brand-container">
|
|
12
|
+
<span class="navbar-brand">
|
|
13
|
+
<h1 class="text-overflow"><i class="icon-reviews"></i> Section Name</h1>
|
|
14
|
+
</span>
|
|
15
|
+
</div>
|
|
16
|
+
</div>
|
|
17
|
+
<div class="collapse navbar-collapse navbar-top-collapse">
|
|
18
|
+
<div class="navbar-right">
|
|
19
|
+
<button class="btn btn-secondary navbar-btn" type="button">Button</button>
|
|
20
|
+
<button class="btn btn-primary navbar-btn" type="button">Call to action</button>
|
|
21
|
+
</div>
|
|
22
|
+
</div>
|
|
23
|
+
</div>
|
|
24
|
+
</nav>
|
|
25
|
+
<section class="main-content">
|
|
26
|
+
<section class="annotated-section">
|
|
27
|
+
<header class="annotated-section-annotation">
|
|
28
|
+
<h2 class="annotated-section-title">Section Name</h2>
|
|
29
|
+
<p>Curabitur blandit tempus porttitor. Integer posuere erat a ante venenatis dapibus posuere velit aliquet.</p>
|
|
30
|
+
<p><a href="#">More Information</a></p>
|
|
31
|
+
</header>
|
|
32
|
+
<div class="annotated-section-content">
|
|
33
|
+
<ul class="nav nav-tabs" data-toggle="stackable" data-target=".stackable-dropdown">
|
|
34
|
+
<li class="active"><a href="#">Tab 1</a></li>
|
|
35
|
+
<li><a href="#">Tab 2</a></li>
|
|
36
|
+
<li class="dropdown pull-right stackable-dropdown">
|
|
37
|
+
<a class="dropdown-toggle" data-toggle="dropdown" href="#">
|
|
38
|
+
More <span class="caret"></span>
|
|
39
|
+
</a>
|
|
40
|
+
<ul class="dropdown-menu">
|
|
41
|
+
</ul>
|
|
42
|
+
</li>
|
|
43
|
+
</ul>
|
|
44
|
+
<div>
|
|
45
|
+
<p>Body</p>
|
|
46
|
+
</div>
|
|
47
|
+
</div>
|
|
48
|
+
</section>
|
|
49
|
+
</section>
|
|
@@ -1,4 +1,13 @@
|
|
|
1
|
-
<
|
|
1
|
+
<div class="menu-toggle-hideable">
|
|
2
|
+
<button type="button" class="navbar-toggle menu-toggle" data-toggle="toggle"
|
|
3
|
+
data-target="body" data-value="menu-open">
|
|
4
|
+
<span class="sr-only">Toggle Navigation</span>
|
|
5
|
+
<span class="icon-bar"></span>
|
|
6
|
+
<span class="icon-bar"></span>
|
|
7
|
+
<span class="icon-bar"></span>
|
|
8
|
+
</button>
|
|
9
|
+
</div>
|
|
10
|
+
<nav id="sidebar" class="menu menu-fixed flex-col menu-folded">
|
|
2
11
|
<header class="menu-header">
|
|
3
12
|
<div class="menu-icon menu-header-icon">
|
|
4
13
|
<i class="bs-icon-bookingsync"></i>
|
|
@@ -30,7 +39,7 @@
|
|
|
30
39
|
</header>
|
|
31
40
|
<div class="menu-body flex-1">
|
|
32
41
|
<ol>
|
|
33
|
-
<li role="presentation"
|
|
42
|
+
<li role="presentation">
|
|
34
43
|
<a href="#" class="menu-link">
|
|
35
44
|
<div class="menu-icon menu-link-icon">
|
|
36
45
|
<i class="icon-calendar"></i>
|
|
@@ -65,7 +74,7 @@
|
|
|
65
74
|
<footer class="menu-footer">
|
|
66
75
|
<ol>
|
|
67
76
|
<li role="separator" class="divider"></li>
|
|
68
|
-
<li role="presentation">
|
|
77
|
+
<li role="presentation" class="active">
|
|
69
78
|
<a href="#" class="menu-link">
|
|
70
79
|
<div class="menu-icon menu-link-icon">
|
|
71
80
|
<i class="icon-applications"></i>
|
|
@@ -76,8 +85,8 @@
|
|
|
76
85
|
</a>
|
|
77
86
|
</li>
|
|
78
87
|
<li role="presentation">
|
|
79
|
-
<a href="#" class="menu-link" data-toggle="
|
|
80
|
-
data-
|
|
88
|
+
<a href="#" class="menu-link" data-toggle="menu-expand" data-menu="#sidebar"
|
|
89
|
+
data-submenu="#sidebar-settings">
|
|
81
90
|
<div class="menu-icon menu-link-icon">
|
|
82
91
|
<i class="icon-settings"></i>
|
|
83
92
|
</div>
|
|
@@ -126,4 +135,39 @@
|
|
|
126
135
|
</nav>
|
|
127
136
|
</footer>
|
|
128
137
|
</nav>
|
|
129
|
-
<
|
|
138
|
+
<nav id="sidebar-settings" class="menu menu-fixed flex-col menu-submenu menu-submenu-collapsed">
|
|
139
|
+
<header class="menu-header">
|
|
140
|
+
<div class="menu-body menu-header-body">
|
|
141
|
+
<h4 class="menu-header-heading">Settings</h4>
|
|
142
|
+
</div>
|
|
143
|
+
</header>
|
|
144
|
+
<div class="menu-body flex-1">
|
|
145
|
+
<ol>
|
|
146
|
+
<li role="presentation" class="active">
|
|
147
|
+
<a href="#" class="menu-link">
|
|
148
|
+
<div class="menu-body menu-link-body">
|
|
149
|
+
General
|
|
150
|
+
</div>
|
|
151
|
+
</a>
|
|
152
|
+
</li>
|
|
153
|
+
<li role="presentation">
|
|
154
|
+
<a href="#" class="menu-link">
|
|
155
|
+
<div class="menu-body menu-link-body">
|
|
156
|
+
Payments
|
|
157
|
+
</div>
|
|
158
|
+
</a>
|
|
159
|
+
</li>
|
|
160
|
+
<li role="presentation">
|
|
161
|
+
<a href="#" class="menu-link">
|
|
162
|
+
<div class="menu-body menu-link-body">
|
|
163
|
+
Apps
|
|
164
|
+
</div>
|
|
165
|
+
</a>
|
|
166
|
+
</li>
|
|
167
|
+
</ol>
|
|
168
|
+
</div>
|
|
169
|
+
</nav>
|
|
170
|
+
<div class="sided-content-full">
|
|
171
|
+
<iframe class="iframe-fullscreen" src="/embed/app_admin__content/index.html"
|
|
172
|
+
frameborder="0"></iframe>
|
|
173
|
+
</div>
|
|
@@ -0,0 +1,37 @@
|
|
|
1
|
+
<nav class="navbar navbar-default navbar-fixed-top" role="navigation">
|
|
2
|
+
<div class="container-fluid">
|
|
3
|
+
<div class="navbar-header">
|
|
4
|
+
<button type="button" class="navbar-toggle navbar-toggle-context"
|
|
5
|
+
data-toggle="collapse" data-target=".navbar-top-collapse">
|
|
6
|
+
<span class="sr-only">Toggle Navigation</span>
|
|
7
|
+
<span class="icon-bar"></span>
|
|
8
|
+
<span class="icon-bar"></span>
|
|
9
|
+
<span class="icon-bar"></span>
|
|
10
|
+
</button>
|
|
11
|
+
<div class="navbar-brand-container">
|
|
12
|
+
<span class="navbar-brand">
|
|
13
|
+
<h1 class="text-overflow"><i class="icon-rental"></i> Rentals</h1>
|
|
14
|
+
</span>
|
|
15
|
+
</div>
|
|
16
|
+
</div>
|
|
17
|
+
<div class="collapse navbar-collapse navbar-top-collapse">
|
|
18
|
+
<div class="navbar-right">
|
|
19
|
+
<button class="btn btn-secondary navbar-btn" type="button">Button</button>
|
|
20
|
+
<button class="btn btn-primary navbar-btn" type="button">Call to action</button>
|
|
21
|
+
</div>
|
|
22
|
+
</div>
|
|
23
|
+
</div>
|
|
24
|
+
</nav>
|
|
25
|
+
<section class="main-content">
|
|
26
|
+
<div class="sheet">
|
|
27
|
+
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla volutpat placerat dui sed interdum. Proin vel est pulvinar, tempus ante consectetur, euismod ante. Integer ultricies augue orci, nec semper velit dictum nec. Nam vitae nisl ex. Cras et fringilla urna. Fusce laoreet leo quis lacus accumsan auctor. Donec mattis nec nulla et hendrerit. Maecenas a viverra nisl. Aenean ornare, metus sit amet euismod congue, libero nulla gravida dolor, et finibus ante lacus eget nisi. In porttitor elit molestie lorem aliquam, nec varius ex luctus.</p>
|
|
28
|
+
|
|
29
|
+
<p>In non justo lacus. Curabitur pretium, ipsum at tincidunt lobortis, massa justo pretium risus, sodales facilisis urna dui in ligula. Vivamus dignissim diam ut augue dignissim elementum. Donec felis lorem, congue a pharetra eget, lacinia sed lectus. Morbi vitae eros in nibh hendrerit elementum. Nulla condimentum dolor nec tellus condimentum, non tincidunt leo euismod. Mauris semper, magna vel placerat euismod, velit ante elementum lectus, ut mollis lectus magna et augue. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. In at pharetra arcu, eget pulvinar lacus. Vestibulum id dolor eu felis porttitor sagittis. Aenean quis dignissim augue. Maecenas sit amet lorem mattis, facilisis ex eget, pharetra quam. Morbi pulvinar est ac scelerisque molestie. Morbi dignissim scelerisque massa in iaculis. Proin non gravida urna. Donec viverra massa hendrerit, euismod felis a, commodo sem.</p>
|
|
30
|
+
|
|
31
|
+
<p>Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam ullamcorper rhoncus volutpat. Cras tortor leo, placerat vitae facilisis quis, hendrerit ac dui. Pellentesque blandit ut orci eget lobortis. Sed viverra magna posuere, congue felis posuere, scelerisque orci. Nunc ac scelerisque lacus, id blandit nunc. Proin sodales enim quis urna imperdiet, non finibus velit congue. Donec nisl sapien, posuere at nisi sed, malesuada dignissim mi. Donec posuere eget turpis eget malesuada. Suspendisse tempor diam tortor, a viverra justo sodales eu. Ut et quam ac magna aliquet malesuada in a eros. Nunc scelerisque purus eu justo mollis, id pulvinar arcu varius. Nullam a justo consequat, malesuada elit eu, luctus turpis. In mi purus, varius vitae lacinia sollicitudin, aliquam quis metus.</p>
|
|
32
|
+
|
|
33
|
+
<p>Ut ac porttitor lacus, quis placerat metus. Aliquam condimentum ligula nec turpis ultricies, et egestas lorem venenatis. Duis non lacus sit amet tortor dignissim pharetra nec quis ligula. Vivamus faucibus metus erat, ac posuere sapien aliquet sed. Mauris pretium dictum urna, id sodales justo lacinia quis. Maecenas porttitor et elit ac placerat. Nunc felis arcu, consectetur id feugiat et, interdum eu augue. Donec rutrum tortor mattis enim interdum semper. Suspendisse interdum turpis mauris, accumsan rutrum dolor dictum sed. Pellentesque imperdiet, ligula id tincidunt ultrices, enim neque fringilla sapien, in dignissim nulla tortor eget nisi. Sed commodo erat non tellus pellentesque consectetur.</p>
|
|
34
|
+
|
|
35
|
+
<p>Sed sed urna ut nibh gravida aliquam. Interdum et malesuada fames ac ante ipsum primis in faucibus. Ut a risus venenatis, pharetra odio sed, vestibulum mauris. Vivamus vel porttitor neque. Maecenas eu lobortis felis. Ut pretium turpis accumsan leo rutrum, in volutpat sapien posuere. Mauris nibh libero, venenatis eget eros in, blandit lobortis ex. Donec facilisis elementum condimentum.</p>
|
|
36
|
+
</div>
|
|
37
|
+
</section>
|