@openeuropa/bcl-theme-joinup 1.10.9 → 1.10.10

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.
Files changed (100) hide show
  1. package/css/oe-bcl-joinup.css +47 -34
  2. package/css/oe-bcl-joinup.css.map +1 -1
  3. package/css/oe-bcl-joinup.min.css +1 -1
  4. package/css/oe-bcl-joinup.min.css.map +1 -1
  5. package/js/oe-bcl-joinup.bundle.js +44 -0
  6. package/js/oe-bcl-joinup.bundle.js.map +1 -1
  7. package/js/oe-bcl-joinup.bundle.min.js +1 -1
  8. package/js/oe-bcl-joinup.bundle.min.js.map +1 -1
  9. package/js/oe-bcl-joinup.esm.js +44 -0
  10. package/js/oe-bcl-joinup.esm.js.map +1 -1
  11. package/js/oe-bcl-joinup.esm.min.js +1 -1
  12. package/js/oe-bcl-joinup.esm.min.js.map +1 -1
  13. package/js/oe-bcl-joinup.umd.js +44 -0
  14. package/js/oe-bcl-joinup.umd.js.map +1 -1
  15. package/js/oe-bcl-joinup.umd.min.js +1 -1
  16. package/js/oe-bcl-joinup.umd.min.js.map +1 -1
  17. package/package.json +6 -6
  18. package/templates/bcl-accordion/accordion.html.twig +42 -46
  19. package/templates/bcl-alert/alert.html.twig +18 -21
  20. package/templates/bcl-badge/badge.html.twig +11 -15
  21. package/templates/bcl-banner/banner.html.twig +34 -37
  22. package/templates/bcl-base-templates/content-type.html.twig +63 -67
  23. package/templates/bcl-base-templates/listing-page.html.twig +31 -31
  24. package/templates/bcl-base-templates/sidebar-search.html.twig +10 -10
  25. package/templates/bcl-blockquote/blockquote.html.twig +17 -20
  26. package/templates/bcl-breadcrumb/breadcrumb.html.twig +24 -28
  27. package/templates/bcl-button/button.html.twig +24 -27
  28. package/templates/bcl-button-group/button-group.html.twig +25 -29
  29. package/templates/bcl-card/card.html.twig +98 -101
  30. package/templates/bcl-card-layout/card-layout.html.twig +34 -37
  31. package/templates/bcl-carousel/carousel.html.twig +64 -67
  32. package/templates/bcl-contact-form/contact-form.html.twig +1 -1
  33. package/templates/bcl-content-banner/content-banner.html.twig +37 -40
  34. package/templates/bcl-date-block/date-block.html.twig +26 -29
  35. package/templates/bcl-description-list/description-list-details.html.twig +6 -9
  36. package/templates/bcl-description-list/description-list-title.html.twig +11 -14
  37. package/templates/bcl-description-list/description-list.html.twig +44 -48
  38. package/templates/bcl-dropdown/dropdown.html.twig +48 -52
  39. package/templates/bcl-event/event.html.twig +7 -7
  40. package/templates/bcl-fact-figures/fact-figures.html.twig +34 -37
  41. package/templates/bcl-featured-media/featured-media.html.twig +42 -46
  42. package/templates/bcl-file/file-translations.html.twig +29 -32
  43. package/templates/bcl-file/file.html.twig +46 -49
  44. package/templates/bcl-footer/footer.html.twig +31 -34
  45. package/templates/bcl-form/form.html.twig +70 -73
  46. package/templates/bcl-form-input/form-input.html.twig +57 -61
  47. package/templates/bcl-gallery/gallery-item.html.twig +20 -23
  48. package/templates/bcl-gallery/gallery.html.twig +62 -66
  49. package/templates/bcl-glossary/glossary-detail.html.twig +19 -19
  50. package/templates/bcl-glossary/glossary-listing.html.twig +6 -6
  51. package/templates/bcl-group/group-landing.html.twig +69 -69
  52. package/templates/bcl-group/group.html.twig +19 -19
  53. package/templates/bcl-header/header.html.twig +44 -48
  54. package/templates/bcl-heading/heading.html.twig +13 -17
  55. package/templates/bcl-icon/icon.html.twig +10 -13
  56. package/templates/bcl-inpage-navigation/inpage-navigation.html.twig +20 -23
  57. package/templates/bcl-landing-page/landing-page.html.twig +33 -33
  58. package/templates/bcl-language-list/language-list-grid.html.twig +25 -28
  59. package/templates/bcl-language-list/language-list-modal.html.twig +52 -52
  60. package/templates/bcl-language-list/language-list.html.twig +33 -37
  61. package/templates/bcl-language-switcher/language-switcher.html.twig +12 -15
  62. package/templates/bcl-link/link.html.twig +24 -27
  63. package/templates/bcl-links-block/links-block.html.twig +29 -33
  64. package/templates/bcl-list-group/list-group.html.twig +43 -47
  65. package/templates/bcl-listing/listing.html.twig +88 -91
  66. package/templates/bcl-mega-menu/mega-menu-items.html.twig +18 -21
  67. package/templates/bcl-mega-menu/mega-menu-submenu.html.twig +25 -26
  68. package/templates/bcl-mega-menu/mega-menu.html.twig +37 -38
  69. package/templates/bcl-modal/modal.html.twig +17 -20
  70. package/templates/bcl-navbar/navbar.html.twig +35 -38
  71. package/templates/bcl-navigation/navigation.html.twig +105 -110
  72. package/templates/bcl-offcanvas/offcanvas.html.twig +33 -36
  73. package/templates/bcl-page/page.html.twig +27 -27
  74. package/templates/bcl-pagination/pagination-item.html.twig +22 -26
  75. package/templates/bcl-pagination/pagination.html.twig +59 -62
  76. package/templates/bcl-pagination-v2/pagination-item.html.twig +31 -35
  77. package/templates/bcl-pagination-v2/pagination.html.twig +79 -82
  78. package/templates/bcl-person/person.html.twig +12 -12
  79. package/templates/bcl-placeholder/placeholder.html.twig +14 -18
  80. package/templates/bcl-progress/progress.html.twig +16 -20
  81. package/templates/bcl-project/project-lists.html.twig +25 -29
  82. package/templates/bcl-project/project.html.twig +35 -35
  83. package/templates/bcl-project-status/project-contributions.html.twig +25 -28
  84. package/templates/bcl-project-status/project-status.html.twig +32 -37
  85. package/templates/bcl-recent-activities/recent-activities.html.twig +13 -16
  86. package/templates/bcl-search/search.html.twig +12 -12
  87. package/templates/bcl-search-form/search-form.html.twig +21 -24
  88. package/templates/bcl-select/select.html.twig +52 -56
  89. package/templates/bcl-spinner/spinner.html.twig +10 -13
  90. package/templates/bcl-subscription/subscription-modal.html.twig +7 -7
  91. package/templates/bcl-subscription/subscription.html.twig +3 -3
  92. package/templates/bcl-subscription-block/subscription-block.html.twig +14 -17
  93. package/templates/bcl-table/table.html.twig +61 -65
  94. package/templates/bcl-textarea/textarea.html.twig +44 -47
  95. package/templates/bcl-timeline/timeline-item.html.twig +12 -15
  96. package/templates/bcl-timeline/timeline.html.twig +42 -45
  97. package/templates/bcl-toasts/toasts.html.twig +56 -60
  98. package/templates/bcl-user/user-compact.html.twig +24 -27
  99. package/templates/bcl-user/user-terms.html.twig +6 -6
  100. package/templates/bcl-user/user.html.twig +117 -117
@@ -17532,6 +17532,9 @@ em.placeholder {
17532
17532
  width: 100%;
17533
17533
  -ms-flex-align: start;
17534
17534
  align-items: flex-start;
17535
+ height: 100%;
17536
+ }
17537
+ .bcl-header__navbar.navbar:not(:has(.bcl-mega-menu__container.show)) {
17535
17538
  overflow: auto;
17536
17539
  }
17537
17540
  .bcl-header__navbar.navbar .navbar-nav {
@@ -18230,8 +18233,8 @@ a.badge:focus-visible {
18230
18233
  outline-offset: -3px;
18231
18234
  }
18232
18235
 
18233
- .badge.bg-primary a,
18234
- .badge.bg-primary {
18236
+ .badge.text-bg-primary a,
18237
+ .badge.text-bg-primary {
18235
18238
  color: #fff;
18236
18239
  }
18237
18240
 
@@ -18253,8 +18256,8 @@ a.badge:focus-within.text-bg-primary, a.badge:active.text-bg-primary, a.badge:ho
18253
18256
  background-color: rgb(17, 50.15, 100.3) !important;
18254
18257
  }
18255
18258
 
18256
- .badge.bg-secondary a,
18257
- .badge.bg-secondary {
18259
+ .badge.text-bg-secondary a,
18260
+ .badge.text-bg-secondary {
18258
18261
  color: #fff;
18259
18262
  }
18260
18263
 
@@ -18276,8 +18279,8 @@ a.badge:focus-within.text-bg-secondary, a.badge:active.text-bg-secondary, a.badg
18276
18279
  background-color: rgb(196.3388131257, 204.796412111, 213.3475868743) !important;
18277
18280
  }
18278
18281
 
18279
- .badge.bg-success a,
18280
- .badge.bg-success {
18282
+ .badge.text-bg-success a,
18283
+ .badge.text-bg-success {
18281
18284
  color: #fff;
18282
18285
  }
18283
18286
 
@@ -18299,8 +18302,8 @@ a.badge:focus-within.text-bg-success, a.badge:active.text-bg-success, a.badge:ho
18299
18302
  background-color: rgb(20.4, 162.35, 108.8) !important;
18300
18303
  }
18301
18304
 
18302
- .badge.bg-info a,
18303
- .badge.bg-info {
18305
+ .badge.text-bg-info a,
18306
+ .badge.text-bg-info {
18304
18307
  color: #fff;
18305
18308
  }
18306
18309
 
@@ -18322,8 +18325,8 @@ a.badge:focus-within.text-bg-info, a.badge:active.text-bg-info, a.badge:hover.te
18322
18325
  background-color: rgb(11.05, 100.3, 118.15) !important;
18323
18326
  }
18324
18327
 
18325
- .badge.bg-warning a,
18326
- .badge.bg-warning {
18328
+ .badge.text-bg-warning a,
18329
+ .badge.text-bg-warning {
18327
18330
  color: #000;
18328
18331
  }
18329
18332
 
@@ -18345,8 +18348,8 @@ a.badge:focus-within.text-bg-warning, a.badge:active.text-bg-warning, a.badge:ho
18345
18348
  background-color: rgb(199.75, 142.8, 56.95) !important;
18346
18349
  }
18347
18350
 
18348
- .badge.bg-danger a,
18349
- .badge.bg-danger {
18351
+ .badge.text-bg-danger a,
18352
+ .badge.text-bg-danger {
18350
18353
  color: #fff;
18351
18354
  }
18352
18355
 
@@ -18368,9 +18371,8 @@ a.badge:focus-within.text-bg-danger, a.badge:active.text-bg-danger, a.badge:hove
18368
18371
  background-color: rgb(199.75, 44.2, 44.2) !important;
18369
18372
  }
18370
18373
 
18371
- .badge.bg-light a, .pagination-v2 .pagination.pagination--glossary .page-item .badge.page-link:hover a,
18372
- .badge.bg-light,
18373
- .pagination-v2 .pagination.pagination--glossary .page-item .badge.page-link:hover {
18374
+ .badge.text-bg-light a,
18375
+ .badge.text-bg-light {
18374
18376
  color: #000;
18375
18377
  }
18376
18378
 
@@ -18393,8 +18395,8 @@ a.badge:focus-within.text-bg-light, a.badge:active.text-bg-light, a.badge:hover.
18393
18395
  background-color: rgb(210.8, 211.65, 212.5) !important;
18394
18396
  }
18395
18397
 
18396
- .badge.bg-dark a,
18397
- .badge.bg-dark {
18398
+ .badge.text-bg-dark a,
18399
+ .badge.text-bg-dark {
18398
18400
  color: #fff;
18399
18401
  }
18400
18402
 
@@ -18416,8 +18418,8 @@ a.badge:focus-within.text-bg-dark, a.badge:active.text-bg-dark, a.badge:hover.te
18416
18418
  background-color: rgb(28.05, 31.45, 34.85) !important;
18417
18419
  }
18418
18420
 
18419
- .badge.bg-brand a,
18420
- .badge.bg-brand {
18421
+ .badge.text-bg-brand a,
18422
+ .badge.text-bg-brand {
18421
18423
  color: #fff;
18422
18424
  }
18423
18425
 
@@ -19878,6 +19880,17 @@ select.multi-select {
19878
19880
  text-decoration: underline;
19879
19881
  }
19880
19882
 
19883
+ @media (min-width: 992px) {
19884
+ .__submenu_body {
19885
+ block-size: 288px;
19886
+ overflow-y: auto;
19887
+ scrollbar-color: tint-color(#253ebe, 70%) transparent;
19888
+ scrollbar-width: thin;
19889
+ }
19890
+ .__submenu_body:has(> .__see_all) ul.bcl-mega-menu__items {
19891
+ height: calc(100% - 48px); /* 48px = see all button height */
19892
+ }
19893
+ }
19881
19894
  ul.bcl-mega-menu__items {
19882
19895
  list-style: none;
19883
19896
  margin: 0;
@@ -19885,12 +19898,6 @@ ul.bcl-mega-menu__items {
19885
19898
  -moz-padding-start: 0;
19886
19899
  padding-inline-start: 0;
19887
19900
  }
19888
- @media (min-width: 992px) {
19889
- ul.bcl-mega-menu__items {
19890
- block-size: 288px;
19891
- overflow-y: auto;
19892
- }
19893
- }
19894
19901
  @media (max-width: 991.98px) {
19895
19902
  ul.bcl-mega-menu__items {
19896
19903
  margin: 1rem 0 0;
@@ -20045,25 +20052,25 @@ ul.bcl-mega-menu__items > li > button[aria-expanded=true] {
20045
20052
  }
20046
20053
  }
20047
20054
  @media (min-width: 992px) {
20048
- .bcl-mega-menu__submenu > .bcl-mega-menu__items {
20055
+ .bcl-mega-menu__submenu > .__submenu_body > .bcl-mega-menu__items {
20049
20056
  -ms-flex: 1 1 0px;
20050
20057
  flex: 1 1 0;
20051
20058
  overflow-y: auto;
20052
20059
  }
20053
- .bcl-mega-menu__submenu > .bcl-mega-menu__items > li > :is(span, a, button) {
20060
+ .bcl-mega-menu__submenu > .__submenu_body > .bcl-mega-menu__items > li > :is(span, a, button) {
20054
20061
  padding: 0.75rem 1.75rem;
20055
20062
  }
20056
20063
  }
20057
- .bcl-mega-menu__submenu > .__see_all {
20064
+ .bcl-mega-menu__submenu .__see_all {
20058
20065
  border-top: 1px solid #b9c5e9;
20059
20066
  }
20060
20067
  @media (min-width: 992px) {
20061
- .bcl-mega-menu__submenu > .__see_all {
20068
+ .bcl-mega-menu__submenu .__see_all {
20062
20069
  border-top: 1px solid tint-color(#253ebe, 80%);
20063
20070
  margin: 0 1.75rem;
20064
20071
  }
20065
20072
  }
20066
- .bcl-mega-menu__submenu > .__see_all > .see-all-button {
20073
+ .bcl-mega-menu__submenu .__see_all > .see-all-button {
20067
20074
  padding: 0.75rem 1rem;
20068
20075
  display: -ms-flexbox;
20069
20076
  display: flex;
@@ -20072,19 +20079,19 @@ ul.bcl-mega-menu__items > li > button[aria-expanded=true] {
20072
20079
  color: #1073de;
20073
20080
  }
20074
20081
  @media (min-width: 992px) {
20075
- .bcl-mega-menu__submenu > .__see_all > .see-all-button {
20082
+ .bcl-mega-menu__submenu .__see_all > .see-all-button {
20076
20083
  padding: 0.75rem 1.75rem;
20077
20084
  margin: 0 -1.75rem;
20078
20085
  }
20079
20086
  }
20080
- .bcl-mega-menu__submenu > .__see_all > .see-all-button:hover {
20087
+ .bcl-mega-menu__submenu .__see_all > .see-all-button:hover {
20081
20088
  background: tint-color(#253ebe, 90%);
20082
20089
  }
20083
- .bcl-mega-menu__submenu > .__see_all > .see-all-button > svg {
20090
+ .bcl-mega-menu__submenu .__see_all > .see-all-button > svg {
20084
20091
  -ms-flex-negative: 0;
20085
20092
  flex-shrink: 0;
20086
20093
  }
20087
- .bcl-mega-menu__submenu > .__see_all > .see-all-button > span {
20094
+ .bcl-mega-menu__submenu .__see_all > .see-all-button > span {
20088
20095
  text-overflow: ellipsis;
20089
20096
  overflow: hidden;
20090
20097
  display: block;
@@ -20111,6 +20118,12 @@ ul.bcl-mega-menu__items > li > button[aria-expanded=true] {
20111
20118
  -webkit-transform: translateX(-50%);
20112
20119
  transform: translateX(-50%);
20113
20120
  }
20121
+ .bcl-mega-menu .__submenu_body {
20122
+ max-height: var(--oel-mega-menu-submenu-height);
20123
+ overflow: auto;
20124
+ scrollbar-color: tint-color(#253ebe, 70%) transparent;
20125
+ scrollbar-width: thin;
20126
+ }
20114
20127
  }
20115
20128
  @media (max-width: 767.98px) {
20116
20129
  .breadcrumb-item + .breadcrumb-item {