bootstrap-bookingsync-sass 1.0.0.beta7 → 1.0.0.beta8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 31af350522041c5f7ce6035f08b83d32933fd4be
4
- data.tar.gz: 85d5ba1cdb4e6d84e6b0d82ea690e0b84b4fc752
3
+ metadata.gz: 4424409939107eaf4f1311baef612d06ba2bd099
4
+ data.tar.gz: 3986b4a599a96a48a864517f7481587ab2d354e0
5
5
  SHA512:
6
- metadata.gz: 89daf0a2347771e440c6803cd1c84422cc3a64ee52192fc809c73a4e69ba6c16aaf512420dcd1fbcea2da549ddea21c5b93cb44afc976a8acff06b3db03fd471
7
- data.tar.gz: 778fa689d7e7935e1837e07fe26694bdf7a9dd666d9f6c6c19afad8b2e8ab9d4f558abb41de1cec5fd47e70c3dab5eb09448d5fbd3072d48ab9f650a76b596ef
6
+ metadata.gz: be2098636f43efa6e53c8e129cf859a213a07f61b70bd98c06cbe894e518ac212f7d2c4c6159a7431c548d9d43d0f47eaf314f334c56989bc42dc14f1a07861e
7
+ data.tar.gz: 1d072e324c28b82fdc4f3f671bb6ffc5ba1104011dbd5323060195cca47dc65c75bfbb9ff10f2dd44202fa03b37e35bdabc4f6c6687592a16992a98fa27b6347
data/CHANGELOG.md CHANGED
@@ -1,5 +1,13 @@
1
1
  ### master
2
2
 
3
+ ### 1.0.0.beta8 - 2016-08-22
4
+
5
+ * breaking changes
6
+ * use `menu-link` structure in header and footer submenus.
7
+
8
+ * improvements
9
+ * add support for `menu-app`
10
+
3
11
  ### 1.0.0.beta7 - 2016-08-22
4
12
 
5
13
  * breaking changes
@@ -144,12 +144,12 @@ $menu-submenu-width: $menu-width - $menu-collapsed-width;
144
144
  color: $menu-header-color;
145
145
  z-index: 1000;
146
146
  position: static;
147
+ border-bottom: 1px solid $menu-header-border-color;
147
148
 
148
149
  a {
149
150
  color: $menu-header-link-color;
150
151
 
151
152
  &:hover {
152
- background-color: $menu-header-link-hover-bg;
153
153
  color: $menu-header-link-hover-color;
154
154
  }
155
155
  }
@@ -194,10 +194,11 @@ $menu-submenu-width: $menu-width - $menu-collapsed-width;
194
194
  background-color: $menu-header-submenu-bg;
195
195
  color: $menu-header-submenu-color;
196
196
  border-top: 1px solid $menu-header-submenu-border-color;
197
+ border-bottom: 1px solid $menu-header-submenu-border-color;
197
198
 
198
- a {
199
+ a.menu-link {
199
200
  color: $menu-header-submenu-link-color;
200
- padding-left: 22px;
201
+ background-color: $menu-header-submenu-bg;
201
202
 
202
203
  &:hover {
203
204
  background-color: $menu-header-submenu-link-hover-bg;
@@ -206,6 +207,23 @@ $menu-submenu-width: $menu-width - $menu-collapsed-width;
206
207
  }
207
208
  }
208
209
 
210
+ .menu-submenu .menu-header-submenu {
211
+ background-color: $menu-submenu-header-submenu-bg;
212
+ color: $menu-submenu-header-submenu-color;
213
+ border-top: 1px solid $menu-submenu-header-submenu-border-color;
214
+ border-bottom: 1px solid $menu-submenu-header-submenu-border-color;
215
+
216
+ a.menu-link {
217
+ color: $menu-submenu-header-submenu-link-color;
218
+ background-color: $menu-submenu-header-submenu-bg;
219
+
220
+ &:hover {
221
+ background-color: $menu-submenu-header-submenu-link-hover-bg;
222
+ color: $menu-submenu-header-submenu-link-hover-color;
223
+ }
224
+ }
225
+ }
226
+
209
227
  .menu-footer {
210
228
  background-color: $menu-footer-bg;
211
229
  color: $menu-footer-color;
@@ -265,7 +283,6 @@ $menu-submenu-width: $menu-width - $menu-collapsed-width;
265
283
 
266
284
  a {
267
285
  color: $menu-footer-submenu-link-color;
268
- padding-left: $menu-collapsed-width;
269
286
 
270
287
  &:hover {
271
288
  background-color: $menu-footer-submenu-link-hover-bg;
@@ -284,6 +301,7 @@ $menu-submenu-width: $menu-width - $menu-collapsed-width;
284
301
  .menu-header {
285
302
  color: $menu-submenu-header-color;
286
303
  background-color: $menu-submenu-header-bg;
304
+ border-bottom: 1px solid $menu-submenu-header-border-color;
287
305
  }
288
306
 
289
307
  .menu-link {
@@ -299,10 +317,12 @@ $menu-submenu-width: $menu-width - $menu-collapsed-width;
299
317
  color: $menu-submenu-link-hover-icon-color;
300
318
  }
301
319
  }
320
+ }
302
321
 
303
- .active &,
304
- .active:hover &,
305
- .active:focus & {
322
+ .active {
323
+ .menu-link,
324
+ .menu-link:hover,
325
+ .menu-link:focus {
306
326
  background-color: $menu-submenu-active-bg;
307
327
  color: $menu-submenu-active-color;
308
328
 
@@ -147,6 +147,7 @@ $menu-submenu-color: $menu-link-color !default;
147
147
  $menu-submenu-bg: $menu-active-bg !default;
148
148
  $menu-submenu-header-color: $menu-submenu-color !default;
149
149
  $menu-submenu-header-bg: $menu-submenu-bg !default;
150
+ $menu-submenu-header-border-color: $menu-divider-border-color !default;
150
151
  $menu-submenu-icon-size: 12px !default;
151
152
  $menu-submenu-link-height: 40px !default;
152
153
  $menu-submenu-link-color: $menu-link-color !default;
@@ -159,11 +160,11 @@ $menu-submenu-active-color: $menu-submenu-link-hover-color !default;
159
160
  $menu-submenu-active-icon-color: $menu-submenu-link-hover-icon-color !default;
160
161
  $menu-submenu-active-bg: $menu-submenu-link-hover-bg !default;
161
162
 
162
-
163
163
  $menu-header-height: 70px !default;
164
164
  $menu-header-icon-size: 24px !default;
165
165
  $menu-header-color: #ffffff !default;
166
166
  $menu-header-bg: $brand-primary !default;
167
+ $menu-header-border-color: #53b4e1 !default;
167
168
  $menu-header-heading-size: 14px !default;
168
169
  $menu-header-link-color: #ffffff !default;
169
170
  $menu-header-link-hover-color: $menu-header-link-color !default;
@@ -173,9 +174,8 @@ $menu-header-submenu-color: $menu-header-color !default;
173
174
  $menu-header-submenu-bg: $menu-header-bg !default;
174
175
  $menu-header-submenu-link-color: #ffffff !default;
175
176
  $menu-header-submenu-link-hover-color: $menu-header-link-color !default;
176
- $menu-header-submenu-link-hover-bg: #53b4e1 !default;
177
- $menu-header-submenu-border-color: $menu-header-submenu-link-hover-bg !default;
178
-
177
+ $menu-header-submenu-link-hover-bg: $menu-header-border-color !default;
178
+ $menu-header-submenu-border-color: $menu-header-border-color !default;
179
179
 
180
180
  $menu-footer-height: $menu-link-height !default;
181
181
  $menu-footer-icon-size: ($menu-link-height * 0.64) !default;
@@ -193,6 +193,13 @@ $menu-footer-submenu-link-hover-color: $menu-submenu-link-hover-color !default;
193
193
  $menu-footer-submenu-link-hover-bg: $menu-submenu-link-hover-bg !default;
194
194
  $menu-footer-submenu-border-color: $menu-link-hover-bg !default;
195
195
 
196
+ $menu-submenu-header-submenu-color: $menu-submenu-header-color !default;
197
+ $menu-submenu-header-submenu-bg: darken($menu-submenu-bg, 5%) !default;
198
+ $menu-submenu-header-submenu-link-color: darken($menu-submenu-link-color, 5%) !default;
199
+ $menu-submenu-header-submenu-link-hover-color: $menu-header-link-color !default;
200
+ $menu-submenu-header-submenu-link-hover-bg: $menu-submenu-header-submenu-bg !default;
201
+ $menu-submenu-header-submenu-border-color: $menu-submenu-header-border-color !default;
202
+
196
203
  $menu-default-toggle-icon-bar-bg: $gray-light !default;
197
204
 
198
205
  //== Buttons
data/docs/Gemfile.lock CHANGED
@@ -1,7 +1,7 @@
1
1
  PATH
2
2
  remote: ../
3
3
  specs:
4
- bootstrap-bookingsync-sass (1.0.0.beta7)
4
+ bootstrap-bookingsync-sass (1.0.0.beta8)
5
5
  bootstrap-sass (>= 3.3.5)
6
6
 
7
7
  GEM
@@ -1,5 +1,6 @@
1
1
  <ul class="list-group list-unstyled">
2
2
  <li><%= link_to("Menu", "#menu", class: "list-group-item") %></li>
3
+ <li><%= link_to("Menu for Apps", "#menu-for-apps", class: "list-group-item") %></li>
3
4
  <li><%= link_to("List group", "#list-group", class: "list-group-item") %></li>
4
5
  <li><%= link_to("List group with icons", "#list-group-with-icons",
5
6
  class: "list-group-item") %></li>
@@ -42,10 +42,18 @@
42
42
  <nav id="menu-header-submenu" class="collapse menu-header-submenu">
43
43
  <ol>
44
44
  <li role="presentation">
45
- <a href="#">Bed and Breakfast</a>
45
+ <a href="#" class="menu-link">
46
+ <div class="menu-body menu-link-body">
47
+ Bed and Breakfast
48
+ </div>
49
+ </a>
46
50
  </li>
47
- <li role="presentation" class="active">
48
- <a href="#">City Apartments</a>
51
+ <li role="presentation">
52
+ <a href="#" class="menu-link">
53
+ <div class="menu-body menu-link-body">
54
+ City Apartments
55
+ </div>
56
+ </a>
49
57
  </li>
50
58
  </ol>
51
59
  </nav>
@@ -135,14 +143,32 @@
135
143
  <nav id="menu-footer-submenu" class="collapse menu-footer-submenu">
136
144
  <ol>
137
145
  <li role="presentation">
138
- <a href="#">Help Center</a>
146
+ <a href="#" class="menu-link">
147
+ <div class="menu-icon menu-link-icon">
148
+ </div>
149
+ <div class="menu-body menu-link-body">
150
+ Help Center
151
+ </div>
152
+ </a>
139
153
  </li>
140
154
  <li role="separator" class="divider"></li>
141
155
  <li role="presentation">
142
- <a href="#">Profile</a>
156
+ <a href="#" class="menu-link">
157
+ <div class="menu-icon menu-link-icon">
158
+ </div>
159
+ <div class="menu-body menu-link-body">
160
+ Profile
161
+ </div>
162
+ </a>
143
163
  </li>
144
164
  <li role="presentation" class="active">
145
- <a href="#">Logout</a>
165
+ <a href="#" class="menu-link">
166
+ <div class="menu-icon menu-link-icon">
167
+ </div>
168
+ <div class="menu-body menu-link-body">
169
+ Logout
170
+ </div>
171
+ </a>
146
172
  </li>
147
173
  </ol>
148
174
  </nav>
@@ -181,3 +207,126 @@
181
207
  </div>
182
208
  </nav>
183
209
  ~~~
210
+
211
+ <div class="example">
212
+ <div class="sheet-header">
213
+ <h3 id="menu-for-apps">Menu for Apps</h3>
214
+ </div>
215
+
216
+ <div class="bs-callout bs-callout-danger">
217
+ <h4>Plugin dependency</h4>
218
+ <p>
219
+ This component requires BookingSync <code>menu</code> and Bootstrap <code>collapse</code> JS plugins.
220
+ </p>
221
+ </div>
222
+
223
+ <div class="bs-example bs-sheet bs-example-composition-body"
224
+ data-example-id="menu-for-apps">
225
+ <div class="bs-example-iframe-container-desktop">
226
+ <iframe class="bs-example-iframe" src="/embed/menu_for_apps/index.html"
227
+ frameborder="0"></iframe>
228
+ </div>
229
+ </div>
230
+ </div>
231
+
232
+ ~~~ html
233
+ <nav class="menu menu-fixed flex-col menu-submenu menu-app">
234
+ <header class="menu-header">
235
+ <div class="menu-body menu-header-body">
236
+ <h4 class="menu-header-heading">Awesome App</h4>
237
+ <small>
238
+ <a href="#menu-header-submenu"
239
+ data-toggle="collapse"
240
+ role="button"
241
+ aria-expanded="false"
242
+ aria-controls="menu-header-submenu"
243
+ class="collapsed">
244
+ San Francisco
245
+ <span class="caret"></span>
246
+ </a>
247
+ </small>
248
+ </div>
249
+ <nav id="menu-header-submenu" class="collapse menu-header-submenu">
250
+ <ol>
251
+ <li role="presentation">
252
+ <a href="#" class="menu-link">
253
+ <div class="menu-body menu-link-body">
254
+ French riviera
255
+ </div>
256
+ </a>
257
+ </li>
258
+ <li role="presentation">
259
+ <a href="#" class="menu-link">
260
+ <div class="menu-body menu-link-body">
261
+ New York
262
+ </div>
263
+ </a>
264
+ </li>
265
+ </ol>
266
+ </nav>
267
+ </header>
268
+ <div class="menu-body flex-1">
269
+ <ol>
270
+ <li role="presentation" class="active">
271
+ <a href="#" class="menu-link">
272
+ <div class="menu-body menu-link-body">
273
+ General
274
+ </div>
275
+ </a>
276
+ </li>
277
+ <li role="presentation">
278
+ <a href="#" class="menu-link">
279
+ <div class="menu-body menu-link-body">
280
+ Payments
281
+ </div>
282
+ </a>
283
+ </li>
284
+ <li role="presentation">
285
+ <a href="#" class="menu-link">
286
+ <div class="menu-body menu-link-body">
287
+ Apps
288
+ </div>
289
+ </a>
290
+ </li>
291
+ </ol>
292
+ </div>
293
+ <footer class="menu-footer">
294
+ <ol>
295
+ <li role="separator" class="divider"></li>
296
+ <li role="presentation">
297
+ <a href="#menu-footer-submenu"
298
+ data-toggle="collapse"
299
+ role="button"
300
+ aria-expanded="false"
301
+ aria-controls="menu-footer-submenu"
302
+ class="collapsed menu-link">
303
+ <div class="menu-body menu-link-body">
304
+ Settings
305
+ </div>
306
+ <div class="menu-caret">
307
+ <span class="caret"></span>
308
+ </div>
309
+ </a>
310
+ </li>
311
+ </ol>
312
+ <nav id="menu-footer-submenu" class="collapse menu-footer-submenu">
313
+ <ol>
314
+ <li role="presentation">
315
+ <a href="#" class="menu-link">
316
+ <div class="menu-body menu-link-body">
317
+ Help Center
318
+ </div>
319
+ </a>
320
+ </li>
321
+ <li role="presentation">
322
+ <a href="#" class="menu-link">
323
+ <div class="menu-body menu-link-body">
324
+ Videos
325
+ </div>
326
+ </a>
327
+ </li>
328
+ </ol>
329
+ </nav>
330
+ </footer>
331
+ </nav>
332
+ ~~~
@@ -20,10 +20,18 @@
20
20
  <nav id="menu-header-submenu" class="collapse menu-header-submenu">
21
21
  <ol>
22
22
  <li role="presentation">
23
- <a href="#">Bed and Breakfast</a>
23
+ <a href="#" class="menu-link">
24
+ <div class="menu-body menu-link-body">
25
+ Bed and Breakfast
26
+ </div>
27
+ </a>
24
28
  </li>
25
- <li role="presentation" class="active">
26
- <a href="#">City Apartments</a>
29
+ <li role="presentation">
30
+ <a href="#" class="menu-link">
31
+ <div class="menu-body menu-link-body">
32
+ City Apartments
33
+ </div>
34
+ </a>
27
35
  </li>
28
36
  </ol>
29
37
  </nav>
@@ -113,14 +121,32 @@
113
121
  <nav id="menu-footer-submenu" class="collapse menu-footer-submenu">
114
122
  <ol>
115
123
  <li role="presentation">
116
- <a href="#">Help Center</a>
124
+ <a href="#" class="menu-link">
125
+ <div class="menu-icon menu-link-icon">
126
+ </div>
127
+ <div class="menu-body menu-link-body">
128
+ Help Center
129
+ </div>
130
+ </a>
117
131
  </li>
118
132
  <li role="separator" class="divider"></li>
119
133
  <li role="presentation">
120
- <a href="#">Profile</a>
134
+ <a href="#" class="menu-link">
135
+ <div class="menu-icon menu-link-icon">
136
+ </div>
137
+ <div class="menu-body menu-link-body">
138
+ Profile
139
+ </div>
140
+ </a>
121
141
  </li>
122
142
  <li role="presentation" class="active">
123
- <a href="#">Logout</a>
143
+ <a href="#" class="menu-link">
144
+ <div class="menu-icon menu-link-icon">
145
+ </div>
146
+ <div class="menu-body menu-link-body">
147
+ Logout
148
+ </div>
149
+ </a>
124
150
  </li>
125
151
  </ol>
126
152
  </nav>
@@ -0,0 +1,99 @@
1
+ <nav class="menu menu-fixed flex-col menu-submenu menu-app">
2
+ <header class="menu-header">
3
+ <div class="menu-body menu-header-body">
4
+ <h4 class="menu-header-heading">Awesome App</h4>
5
+ <small>
6
+ <a href="#menu-header-submenu"
7
+ data-toggle="collapse"
8
+ role="button"
9
+ aria-expanded="false"
10
+ aria-controls="menu-header-submenu"
11
+ class="collapsed">
12
+ San Francisco
13
+ <span class="caret"></span>
14
+ </a>
15
+ </small>
16
+ </div>
17
+ <nav id="menu-header-submenu" class="collapse menu-header-submenu">
18
+ <ol>
19
+ <li role="presentation">
20
+ <a href="#" class="menu-link">
21
+ <div class="menu-body menu-link-body">
22
+ French riviera
23
+ </div>
24
+ </a>
25
+ </li>
26
+ <li role="presentation">
27
+ <a href="#" class="menu-link">
28
+ <div class="menu-body menu-link-body">
29
+ New York
30
+ </div>
31
+ </a>
32
+ </li>
33
+ </ol>
34
+ </nav>
35
+ </header>
36
+ <div class="menu-body flex-1">
37
+ <ol>
38
+ <li role="presentation" class="active">
39
+ <a href="#" class="menu-link">
40
+ <div class="menu-body menu-link-body">
41
+ General
42
+ </div>
43
+ </a>
44
+ </li>
45
+ <li role="presentation">
46
+ <a href="#" class="menu-link">
47
+ <div class="menu-body menu-link-body">
48
+ Payments
49
+ </div>
50
+ </a>
51
+ </li>
52
+ <li role="presentation">
53
+ <a href="#" class="menu-link">
54
+ <div class="menu-body menu-link-body">
55
+ Apps
56
+ </div>
57
+ </a>
58
+ </li>
59
+ </ol>
60
+ </div>
61
+ <footer class="menu-footer">
62
+ <ol>
63
+ <li role="separator" class="divider"></li>
64
+ <li role="presentation">
65
+ <a href="#menu-footer-submenu"
66
+ data-toggle="collapse"
67
+ role="button"
68
+ aria-expanded="false"
69
+ aria-controls="menu-footer-submenu"
70
+ class="collapsed menu-link">
71
+ <div class="menu-body menu-link-body">
72
+ Settings
73
+ </div>
74
+ <div class="menu-caret">
75
+ <span class="caret"></span>
76
+ </div>
77
+ </a>
78
+ </li>
79
+ </ol>
80
+ <nav id="menu-footer-submenu" class="collapse menu-footer-submenu">
81
+ <ol>
82
+ <li role="presentation">
83
+ <a href="#" class="menu-link">
84
+ <div class="menu-body menu-link-body">
85
+ Help Center
86
+ </div>
87
+ </a>
88
+ </li>
89
+ <li role="presentation">
90
+ <a href="#" class="menu-link">
91
+ <div class="menu-body menu-link-body">
92
+ Videos
93
+ </div>
94
+ </a>
95
+ </li>
96
+ </ol>
97
+ </nav>
98
+ </footer>
99
+ </nav>
@@ -1,5 +1,5 @@
1
1
  module Bootstrap
2
2
  module BookingSync
3
- VERSION = '1.0.0.beta7'
3
+ VERSION = '1.0.0.beta8'
4
4
  end
5
5
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: bootstrap-bookingsync-sass
3
3
  version: !ruby/object:Gem::Version
4
- version: 1.0.0.beta7
4
+ version: 1.0.0.beta8
5
5
  platform: ruby
6
6
  authors:
7
7
  - Sebastien Grosjean
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2016-08-21 00:00:00.000000000 Z
11
+ date: 2016-08-22 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: bootstrap-sass
@@ -154,6 +154,7 @@ files:
154
154
  - docs/content/embed/core_admin.html
155
155
  - docs/content/embed/fullscreen_modal.html
156
156
  - docs/content/embed/menu.html
157
+ - docs/content/embed/menu_for_apps.html
157
158
  - docs/content/embed/nested_section.html
158
159
  - docs/content/embed/section.html
159
160
  - docs/content/embed/tabulated_content.html