@openeuropa/bcl-subscription 1.10.5 → 1.10.7

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.
@@ -5,7 +5,6 @@ exports[`OE - Subscription renders correctly 1`] = `
5
5
  <header
6
6
  class="bcl-header bcl-header--eu"
7
7
  >
8
- <!-- navbar_settings -->
9
8
  <nav
10
9
  aria-label="Top Navigation"
11
10
  class="w-100 shadow-sm bcl-header__top-navbar navbar navbar-expand-lg navbar-light"
@@ -29,11 +28,11 @@ exports[`OE - Subscription renders correctly 1`] = `
29
28
  />
30
29
  </a>
31
30
  <button
32
- aria-controls="topNavbarDropdown"
31
+ aria-controls="header-navbar"
33
32
  aria-expanded="false"
34
33
  aria-label="Toggle navigation"
35
- class="navbar-toggler"
36
- data-bs-target="#topNavbarDropdown"
34
+ class="navbar-toggler bcl-navbar-toggler"
35
+ data-bs-target="#header-navbar"
37
36
  data-bs-toggle="collapse"
38
37
  type="button"
39
38
  >
@@ -41,202 +40,466 @@ exports[`OE - Subscription renders correctly 1`] = `
41
40
  class="navbar-toggler-icon"
42
41
  />
43
42
  </button>
44
- <div
45
- class="collapse navbar-collapse"
46
- id="topNavbarDropdown"
47
- >
48
- <ul
49
- class="nav"
50
- >
51
- <li
52
- class="nav-item"
53
- >
54
- <a
55
- class="nav-link"
56
- data-bs-target="#languageModal"
57
- data-bs-toggle="modal"
58
- href="/example.html"
59
- >
60
- <svg
61
- class="me-2-5 bi icon--xs"
62
- >
63
- <use
64
- xlink:href="/icons.svg#chat-left-dots-fill"
65
- />
66
- </svg>
67
- English
68
- </a>
69
- </li>
70
- <li
71
- class="nav-item"
72
- >
73
- <a
74
- class="nav-link"
75
- data-bs-target="#loginModal"
76
- data-bs-toggle="modal"
77
- href="/example.html"
78
- >
79
- <svg
80
- class="me-2-5 bi icon--xs"
81
- >
82
- <use
83
- xlink:href="/icons.svg#person-fill"
84
- />
85
- </svg>
86
- Log in
87
- </a>
88
- </li>
89
- </ul>
90
- </div>
91
43
  </div>
92
44
  </nav>
93
45
  <!-- project name -->
94
46
  <!-- navbar -->
95
47
  <nav
96
48
  aria-label="Main Navigation"
97
- class="bcl-header__navbar navbar navbar-expand-lg navbar-dark"
49
+ class="bcl-header__navbar collapse navbar-collapse navbar navbar-expand-lg navbar-dark"
50
+ id="header-navbar"
98
51
  >
99
52
  <div
100
53
  class="container"
101
54
  >
102
- <button
103
- aria-controls="navbarNavDropdown"
104
- aria-expanded="false"
105
- aria-label="Toggle navigation"
106
- class="navbar-toggler"
107
- data-bs-target="#navbarNavDropdown"
108
- data-bs-toggle="collapse"
109
- type="button"
55
+ <ul
56
+ class="me-auto navbar-nav"
110
57
  >
111
- <span
112
- class="navbar-toggler-icon"
113
- />
114
- </button>
115
- <div
116
- class="collapse navbar-collapse"
117
- id="navbarNavDropdown"
118
- >
119
- <ul
120
- class="me-auto navbar-nav"
58
+ <li
59
+ class="nav-item"
121
60
  >
122
- <li
123
- class="nav-item"
124
- >
125
- <a
126
- aria-current="page"
127
- class="nav-link active"
128
- href="/example.html"
129
- >
130
- Home
131
- </a>
132
- </li>
133
- <li
134
- class="nav-item"
135
- >
136
- <a
137
- class="nav-link"
138
- href="/example.html"
139
- >
140
- Item 01
141
- </a>
142
- </li>
143
- <li
144
- class="nav-item"
145
- >
146
- <a
147
- class="nav-link"
148
- href="/example.html"
149
- >
150
- Item 02
151
- </a>
152
- </li>
153
- <li
154
- class="nav-item dropdown"
61
+ <div
62
+ class="bcl-mega-menu"
155
63
  >
156
- <a
64
+ <button
65
+ aria-controls="mega-menu-dropdown-megamenu"
157
66
  aria-expanded="false"
158
- class="nav-link dropdown-toggle"
67
+ aria-haspopup="menu"
68
+ class="dropdown-toggle nav-link"
69
+ data-bs-auto-close="outside"
159
70
  data-bs-toggle="dropdown"
160
- href="#"
161
- id="navbarDropdownMenuLink"
162
- role="button"
71
+ id="dropdown-megamenu"
72
+ type="button"
163
73
  >
164
- Dropdown link
165
- </a>
166
- <ul
167
- aria-labelledby="navbarDropdownMenuLink"
168
- class="dropdown-menu"
74
+ A link with dropdown
75
+ </button>
76
+ <nav
77
+ aria-label="Main mega menu"
78
+ aria-labelledby="dropdown-megamenu"
79
+ class="bcl-mega-menu__container dropdown-menu"
80
+ id="mega-menu-dropdown-megamenu"
169
81
  >
170
- <li>
171
- <a
172
- class="dropdown-item"
173
- href="/example.html"
174
- >
175
- Action
176
- </a>
177
- </li>
178
- <li>
179
- <a
180
- class="dropdown-item"
181
- href="/example.html"
182
- >
183
- Another action
184
- </a>
185
- </li>
186
- <li>
187
- <a
188
- class="dropdown-item"
189
- href="/example.html"
82
+ <div
83
+ class="container"
84
+ >
85
+ <div
86
+ class="container d-lg-none bcl-mega-menu__back-button-block"
190
87
  >
191
- Something else here
192
- </a>
193
- </li>
194
- <li>
195
- <a
196
- class="dropdown-item"
197
- href="/example.html"
88
+ <button
89
+ aria-label="Back to main menu"
90
+ class="back-button btn btn-link btn-md"
91
+ type="button"
92
+ >
93
+ <svg
94
+ class="me-2-5 bi icon--fluid"
95
+ >
96
+ <use
97
+ xlink:href="/icons.svg#arrow-left"
98
+ />
99
+ </svg>
100
+ Back
101
+ </button>
102
+ </div>
103
+ <div
104
+ class="position-relative"
198
105
  >
199
- Very long label with custom text and custom link as an example
200
- </a>
201
- </li>
202
- </ul>
203
- </li>
204
- </ul>
205
- <form
206
- class="d-flex mt-3 mt-lg-0"
106
+ <div
107
+ class="row"
108
+ >
109
+ <div
110
+ class="col-md-12 col-xl-3 position-relative bcl-mega-menu__info"
111
+ >
112
+ <div
113
+ class="content-block"
114
+ >
115
+ <h4>
116
+ About the European Commission
117
+ </h4>
118
+ <p>
119
+ Description text, lorem ipsum dolor sit amet, consectetur adipiscing elit.
120
+ </p>
121
+ <p
122
+ class="m-0"
123
+ >
124
+ <a
125
+ class="content-link"
126
+ href="/example.html"
127
+ >
128
+ Discover more
129
+ <svg
130
+ class="ms-2-5 bi icon--s"
131
+ >
132
+ <use
133
+ xlink:href="/icons.svg#arrow-right"
134
+ />
135
+ </svg>
136
+ </a>
137
+ </p>
138
+ </div>
139
+ <div
140
+ class="shadow-container"
141
+ >
142
+ <span
143
+ class="shadow-bg"
144
+ />
145
+ </div>
146
+ </div>
147
+ <div
148
+ class="col-md-12 col-lg-4 col-xl-3 bcl-mega-menu__menu"
149
+ >
150
+ <ul
151
+ class="bcl-mega-menu__items __level-1"
152
+ >
153
+ <li
154
+ class="__parent"
155
+ >
156
+ <button
157
+ aria-controls="mm-panel-custom-trigger-mm-1"
158
+ aria-expanded="false"
159
+ aria-haspopup="menu"
160
+ class="active"
161
+ id="custom-trigger-mm-1"
162
+ type="button"
163
+ >
164
+ Base Category Item
165
+ </button>
166
+ <div
167
+ aria-labelledby="custom-trigger-mm-1"
168
+ class="bcl-mega-menu__submenu __level-2"
169
+ hidden=""
170
+ id="mm-panel-custom-trigger-mm-1"
171
+ role="group"
172
+ >
173
+ <div
174
+ class="__header"
175
+ >
176
+ <p
177
+ class="__label"
178
+ >
179
+ Base Category Item
180
+ </p>
181
+ </div>
182
+ <ul
183
+ class="bcl-mega-menu__items __level-2"
184
+ >
185
+ <li
186
+ class="__leaf"
187
+ >
188
+ <a
189
+ class="active"
190
+ href="/example.html"
191
+ >
192
+ Base Sub Category Item
193
+ </a>
194
+ </li>
195
+ <li
196
+ class="__leaf"
197
+ >
198
+ <a
199
+ href="/example.html"
200
+ >
201
+ Base Sub Category Item
202
+ </a>
203
+ </li>
204
+ <li
205
+ class="__leaf"
206
+ >
207
+ <a
208
+ href="/example.html"
209
+ >
210
+ Base Sub Category Item
211
+ </a>
212
+ </li>
213
+ <li
214
+ class="__leaf"
215
+ >
216
+ <a
217
+ href="/example.html"
218
+ >
219
+ Base Sub Category Item
220
+ </a>
221
+ </li>
222
+ <li
223
+ class="__see_all __leaf"
224
+ >
225
+ <a
226
+ aria-label="See all items in ‘Base Category Item’"
227
+ class="see-all-button"
228
+ href="/example.html"
229
+ >
230
+ <span>
231
+ See all
232
+ </span>
233
+ <svg
234
+ class="ms-2-5 bi icon--s"
235
+ >
236
+ <use
237
+ xlink:href="/icons.svg#arrow-right"
238
+ />
239
+ </svg>
240
+ </a>
241
+ </li>
242
+ </ul>
243
+ </div>
244
+ </li>
245
+ <li
246
+ class="__leaf"
247
+ >
248
+ <span>
249
+ Base Category Item
250
+ </span>
251
+ </li>
252
+ <li
253
+ class="__parent"
254
+ >
255
+ <button
256
+ aria-controls="mm-panel-custom-trigger-mm-2"
257
+ aria-expanded="false"
258
+ aria-haspopup="menu"
259
+ id="custom-trigger-mm-2"
260
+ type="button"
261
+ >
262
+ Base Category Item
263
+ </button>
264
+ <div
265
+ aria-labelledby="custom-trigger-mm-2"
266
+ class="bcl-mega-menu__submenu __level-2"
267
+ hidden=""
268
+ id="mm-panel-custom-trigger-mm-2"
269
+ role="group"
270
+ >
271
+ <div
272
+ class="__header"
273
+ >
274
+ <p
275
+ class="__label"
276
+ >
277
+ Base Category Item
278
+ </p>
279
+ </div>
280
+ <ul
281
+ class="bcl-mega-menu__items __level-2"
282
+ >
283
+ <li
284
+ class="__leaf"
285
+ >
286
+ <a
287
+ href="/example.html"
288
+ >
289
+ Base Sub Category Item
290
+ </a>
291
+ </li>
292
+ <li
293
+ class="__leaf"
294
+ >
295
+ <a
296
+ href="/example.html"
297
+ >
298
+ Base Sub Category Item
299
+ </a>
300
+ </li>
301
+ <li
302
+ class="__leaf"
303
+ >
304
+ <a
305
+ href="/example.html"
306
+ >
307
+ Base Sub Category Item
308
+ </a>
309
+ </li>
310
+ <li
311
+ class="__leaf"
312
+ >
313
+ <a
314
+ href="/example.html"
315
+ >
316
+ Base Sub Category Item
317
+ </a>
318
+ </li>
319
+ <li
320
+ class="__leaf"
321
+ >
322
+ <a
323
+ href="/example.html"
324
+ >
325
+ Base Sub Category Item
326
+ </a>
327
+ </li>
328
+ <li
329
+ class="__leaf"
330
+ >
331
+ <a
332
+ href="/example.html"
333
+ >
334
+ Base Sub Category Item
335
+ </a>
336
+ </li>
337
+ <li
338
+ class="__leaf"
339
+ >
340
+ <a
341
+ href="/example.html"
342
+ >
343
+ Base Sub Category Item
344
+ </a>
345
+ </li>
346
+ <li
347
+ class="__leaf"
348
+ >
349
+ <a
350
+ href="/example.html"
351
+ >
352
+ Base Sub Category Item
353
+ </a>
354
+ </li>
355
+ </ul>
356
+ </div>
357
+ </li>
358
+ <li
359
+ class="__leaf"
360
+ >
361
+ <a
362
+ href="/example.html"
363
+ >
364
+ Base Category Item
365
+ </a>
366
+ </li>
367
+ <li
368
+ class="__leaf"
369
+ >
370
+ <a
371
+ href="/example.html"
372
+ >
373
+ Base Category Item
374
+ </a>
375
+ </li>
376
+ <li
377
+ class="__leaf"
378
+ >
379
+ <a
380
+ href="/example.html"
381
+ >
382
+ Base Category Item
383
+ </a>
384
+ </li>
385
+ <li
386
+ class="__leaf"
387
+ >
388
+ <a
389
+ href="/example.html"
390
+ >
391
+ Base Category Item
392
+ </a>
393
+ </li>
394
+ <li
395
+ class="__leaf"
396
+ >
397
+ <a
398
+ href="/example.html"
399
+ >
400
+ Base Category Item
401
+ </a>
402
+ </li>
403
+ <li
404
+ class="__leaf"
405
+ >
406
+ <a
407
+ href="/example.html"
408
+ >
409
+ Base Category Item
410
+ </a>
411
+ </li>
412
+ </ul>
413
+ </div>
414
+ </div>
415
+ </div>
416
+ </div>
417
+ </nav>
418
+ </div>
419
+ </li>
420
+ <li
421
+ class="nav-item"
422
+ >
423
+ <a
424
+ aria-current="page"
425
+ class="nav-link active"
426
+ href="/example.html"
427
+ >
428
+ Home
429
+ </a>
430
+ </li>
431
+ <li
432
+ class="nav-item"
433
+ >
434
+ <a
435
+ class="nav-link"
436
+ href="/example.html"
437
+ >
438
+ Item 01
439
+ </a>
440
+ </li>
441
+ <li
442
+ class="nav-item"
207
443
  >
208
- <label
209
- class="form-label visually-hidden"
210
- for="inlineFormInputGroupSearch"
444
+ <a
445
+ class="nav-link"
446
+ href="/example.html"
211
447
  >
212
- Search
213
- </label>
214
- <input
215
- class="border-start-0 rounded-0 rounded-start form-control"
216
- id="inlineFormInputGroupSearch"
217
- placeholder="Search"
218
- required="true"
219
- type="text"
220
- />
448
+ Item 02
449
+ </a>
450
+ </li>
451
+ <li
452
+ class="nav-item dropdown"
453
+ >
221
454
  <button
222
- class="border-start-0 rounded-0 rounded-end btn btn-light btn-md"
455
+ aria-expanded="false"
456
+ autocomplete="off"
457
+ class="dropdown-toggle btn btn-primary btn-md"
458
+ data-bs-toggle="dropdown"
459
+ id="navbarDropdownMenuLink"
223
460
  type="button"
224
461
  >
225
- <span
226
- class="visually-hidden"
227
- >
228
- search
229
- </span>
230
- <svg
231
- class="bi icon--fluid"
232
- >
233
- <use
234
- xlink:href="/icons.svg#search"
235
- />
236
- </svg>
462
+ Dropdown link
237
463
  </button>
238
- </form>
239
- </div>
464
+ <ul
465
+ aria-labelledby="navbarDropdownMenuLink"
466
+ class="dropdown-menu"
467
+ >
468
+ <li>
469
+ <a
470
+ class="dropdown-item"
471
+ href="/example.html"
472
+ >
473
+ Action
474
+ </a>
475
+ </li>
476
+ <li>
477
+ <a
478
+ class="dropdown-item"
479
+ href="/example.html"
480
+ >
481
+ Another action
482
+ </a>
483
+ </li>
484
+ <li>
485
+ <a
486
+ class="dropdown-item"
487
+ href="/example.html"
488
+ >
489
+ Something else here
490
+ </a>
491
+ </li>
492
+ <li>
493
+ <a
494
+ class="dropdown-item"
495
+ href="/example.html"
496
+ >
497
+ Very long label with custom text and custom link as an example
498
+ </a>
499
+ </li>
500
+ </ul>
501
+ </li>
502
+ </ul>
240
503
  </div>
241
504
  </nav>
242
505
  <!-- breadcrumbs -->
package/package.json CHANGED
@@ -2,13 +2,13 @@
2
2
  "name": "@openeuropa/bcl-subscription",
3
3
  "author": "European Commission",
4
4
  "license": "EUPL-1.2",
5
- "version": "1.10.5",
5
+ "version": "1.10.7",
6
6
  "publishConfig": {
7
7
  "access": "public"
8
8
  },
9
9
  "description": "OE - BCL subscription",
10
10
  "dependencies": {
11
- "@openeuropa/bcl-subscription-block": "^1.10.5"
11
+ "@openeuropa/bcl-subscription-block": "^1.10.7"
12
12
  },
13
13
  "repository": {
14
14
  "type": "git",
@@ -24,5 +24,5 @@
24
24
  "design-system",
25
25
  "twig"
26
26
  ],
27
- "gitHead": "917b95d7bf149e937571d1d6040fb1cf6405755b"
27
+ "gitHead": "5f7e5c2fd90eceb81c0ffcf52dcf8e3921c3acae"
28
28
  }