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

Sign up to get free protection for your applications and to get access to all the features.
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