@openeuropa/bcl-theme-default 0.4185.202511191330 → 0.4185.202512021245

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.
@@ -17799,6 +17799,9 @@ em.placeholder {
17799
17799
  align-items: flex-end;
17800
17800
  }
17801
17801
 
17802
+ .bcl-header {
17803
+ --oel-mega-menu-offset-top: 0px;
17804
+ }
17802
17805
  .bcl-header .notification {
17803
17806
  position: relative;
17804
17807
  padding-right: 0;
@@ -17844,7 +17847,7 @@ em.placeholder {
17844
17847
  header:has(.bcl-header__navbar #main-navbar.show),
17845
17848
  header:has(.bcl-header__navbar.collapsing),
17846
17849
  header:has(.bcl-header__navbar.show) {
17847
- height: 100vh;
17850
+ height: calc(100vh - var(--oel-mega-menu-offset-top, 0px));
17848
17851
  display: -ms-flexbox;
17849
17852
  display: flex;
17850
17853
  -ms-flex-flow: column;
@@ -18310,6 +18313,10 @@ em.placeholder {
18310
18313
  border-top-left-radius: 0;
18311
18314
  border-bottom-left-radius: 0;
18312
18315
  }
18316
+ .bcl-search-form.submittable .bcl-search-form__submit:focus-visible {
18317
+ outline-offset: 2px;
18318
+ outline-color: #253ebe;
18319
+ }
18313
18320
  .bcl-search-form.submittable .bcl-search-form__group {
18314
18321
  display: -ms-flexbox;
18315
18322
  display: flex;
@@ -18343,12 +18350,53 @@ em.placeholder {
18343
18350
  padding-bottom: 0.5rem;
18344
18351
  padding-left: 1rem;
18345
18352
  font-size: 1.25rem;
18353
+ border-color: #6c757d;
18346
18354
  }
18347
18355
  .form-select:focus-visible {
18356
+ border-color: #6c757d;
18357
+ box-shadow: none;
18348
18358
  outline: 2px solid #253ebe;
18349
18359
  box-shadow: none;
18350
18360
  border-radius: 4px;
18351
- outline-offset: -1px;
18361
+ outline-offset: 2px;
18362
+ }
18363
+ .form-select:focus-visible.is-valid {
18364
+ outline-color: #09854c;
18365
+ }
18366
+ .form-select:focus-visible.is-valid:focus {
18367
+ box-shadow: none;
18368
+ border-color: #6c757d;
18369
+ }
18370
+ .form-select:focus-visible.is-invalid {
18371
+ outline-color: #a51f2c;
18372
+ }
18373
+ .form-select:focus-visible.is-invalid:focus {
18374
+ box-shadow: none;
18375
+ border-color: #6c757d;
18376
+ }
18377
+ .form-select:focus {
18378
+ box-shadow: none;
18379
+ border-color: #6c757d;
18380
+ }
18381
+ .form-select.is-valid:focus, .form-select.is-invalid:focus {
18382
+ box-shadow: none;
18383
+ }
18384
+
18385
+ .form-check-input {
18386
+ border-color: #253ebe;
18387
+ }
18388
+ .form-check-input:focus-visible[type=radio] {
18389
+ border-radius: 50%;
18390
+ }
18391
+ .form-check-input:focus {
18392
+ border-color: #253ebe;
18393
+ box-shadow: none;
18394
+ }
18395
+ .form-check-input:focus-visible {
18396
+ outline: 2px solid #253ebe;
18397
+ box-shadow: none;
18398
+ border-radius: 4px;
18399
+ outline-offset: 1px;
18352
18400
  }
18353
18401
 
18354
18402
  .form-control {
@@ -18356,6 +18404,7 @@ em.placeholder {
18356
18404
  padding: 0.5rem 1rem;
18357
18405
  font-size: 1.25rem;
18358
18406
  border-radius: 0.3rem;
18407
+ border-color: #6c757d;
18359
18408
  }
18360
18409
  .form-control::-webkit-file-upload-button {
18361
18410
  padding: 0.5rem 1rem;
@@ -18365,11 +18414,31 @@ em.placeholder {
18365
18414
  padding: 0.5rem 1rem;
18366
18415
  margin: -0.5rem 1rem -0.5rem -1rem;
18367
18416
  }
18368
- .form-control:focus-visible {
18417
+ .form-control:focus:focus-visible {
18418
+ border-color: #6c757d;
18369
18419
  outline: 2px solid #253ebe;
18370
18420
  box-shadow: none;
18371
18421
  border-radius: 4px;
18372
- outline-offset: -1px;
18422
+ outline-offset: 2px;
18423
+ }
18424
+ .form-control.is-valid:focus, .form-control.is-invalid:focus {
18425
+ box-shadow: none;
18426
+ }
18427
+ .form-control.is-valid:focus:focus-visible {
18428
+ transition: none;
18429
+ border-color: #6c757d;
18430
+ outline: 2px solid #09854c;
18431
+ box-shadow: none;
18432
+ border-radius: 4px;
18433
+ outline-offset: 2px;
18434
+ }
18435
+ .form-control.is-invalid:focus:focus-visible {
18436
+ transition: none;
18437
+ border-color: #6c757d;
18438
+ outline: 2px solid #a51f2c;
18439
+ box-shadow: none;
18440
+ border-radius: 4px;
18441
+ outline-offset: 2px;
18373
18442
  }
18374
18443
 
18375
18444
  .form-check:not(.form-switch) {
@@ -18384,19 +18453,6 @@ em.placeholder {
18384
18453
  margin-top: 0.15rem;
18385
18454
  }
18386
18455
 
18387
- .form-check-input:focus-visible {
18388
- outline: 4px solid #253ebe;
18389
- box-shadow: none;
18390
- border-radius: 4px;
18391
- outline-offset: 0;
18392
- }
18393
- .form-check-input:focus-visible[type=radio] {
18394
- border-radius: 50%;
18395
- }
18396
- .form-check-input:checked:focus-visible {
18397
- border-color: #fff;
18398
- }
18399
-
18400
18456
  @media (min-width: 768px) {
18401
18457
  .form-check:not(.form-switch) {
18402
18458
  padding-left: 1.5rem;
@@ -18430,23 +18486,17 @@ em.placeholder {
18430
18486
  }
18431
18487
  textarea.form-control.is-invalid,
18432
18488
  .form-control.is-invalid {
18433
- background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM8 4C7.46459 4 7.04623 4.46229 7.0995 4.99504L7.45025 8.50248C7.47849 8.78492 7.71616 9 8 9C8.28384 9 8.52151 8.78492 8.54975 8.50248L8.9005 4.99504C8.95377 4.46228 8.53541 4 8 4ZM8.00154 10C7.44926 10 7.00154 10.4477 7.00154 11C7.00154 11.5523 7.44926 12 8.00154 12C8.55383 12 9.00154 11.5523 9.00154 11C9.00154 10.4477 8.55383 10 8.00154 10Z' fill='%23D72E3D'/%3E%3C/svg%3E%0A");
18489
+ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM8 4C7.46459 4 7.04623 4.46229 7.0995 4.99504L7.45025 8.50248C7.47849 8.78492 7.71616 9 8 9C8.28384 9 8.52151 8.78492 8.54975 8.50248L8.9005 4.99504C8.95377 4.46228 8.53541 4 8 4ZM8.00154 10C7.44926 10 7.00154 10.4477 7.00154 11C7.00154 11.5523 7.44926 12 8.00154 12C8.55383 12 9.00154 11.5523 9.00154 11C9.00154 10.4477 8.55383 10 8.00154 10Z' fill='%23A51F2C'/%3E%3C/svg%3E%0A");
18434
18490
  }
18435
18491
  textarea.form-control.is-valid,
18436
18492
  .form-control.is-valid {
18437
18493
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM12.0303 4.96967C11.7374 4.67678 11.2626 4.67678 10.9697 4.96967C10.9626 4.97674 10.9559 4.98424 10.9498 4.9921L7.4774 9.41674L5.38388 7.32322C5.09098 7.03033 4.61611 7.03033 4.32322 7.32322C4.03032 7.61612 4.03032 8.09099 4.32322 8.38388L6.96966 11.0303C7.26256 11.3232 7.73743 11.3232 8.03032 11.0303C8.03685 11.0238 8.043 11.0169 8.04876 11.0097L12.041 6.01947C12.3232 5.72582 12.3196 5.25897 12.0303 4.96967Z' fill='%2328A745'/%3E%3C/svg%3E%0A");
18438
18494
  }
18439
18495
 
18440
- .form-select:not([multiple]):not([size]):focus-visible {
18441
- outline: 2px solid #253ebe;
18442
- box-shadow: none;
18443
- border-radius: 4px;
18444
- outline-offset: -1px;
18445
- }
18446
- .form-select:not([multiple]):not([size]).is-invalid {
18447
- background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E"), url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM8 4C7.46459 4 7.04623 4.46229 7.0995 4.99504L7.45025 8.50248C7.47849 8.78492 7.71616 9 8 9C8.28384 9 8.52151 8.78492 8.54975 8.50248L8.9005 4.99504C8.95377 4.46228 8.53541 4 8 4ZM8.00154 10C7.44926 10 7.00154 10.4477 7.00154 11C7.00154 11.5523 7.44926 12 8.00154 12C8.55383 12 9.00154 11.5523 9.00154 11C9.00154 10.4477 8.55383 10 8.00154 10Z' fill='%23D72E3D'/%3E%3C/svg%3E%0A");
18496
+ select.form-select:not([multiple]):not([size]).is-invalid {
18497
+ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E"), url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM8 4C7.46459 4 7.04623 4.46229 7.0995 4.99504L7.45025 8.50248C7.47849 8.78492 7.71616 9 8 9C8.28384 9 8.52151 8.78492 8.54975 8.50248L8.9005 4.99504C8.95377 4.46228 8.53541 4 8 4ZM8.00154 10C7.44926 10 7.00154 10.4477 7.00154 11C7.00154 11.5523 7.44926 12 8.00154 12C8.55383 12 9.00154 11.5523 9.00154 11C9.00154 10.4477 8.55383 10 8.00154 10Z' fill='%23A51F2C'/%3E%3C/svg%3E%0A");
18448
18498
  }
18449
- .form-select:not([multiple]):not([size]).is-valid {
18499
+ select.form-select:not([multiple]):not([size]).is-valid {
18450
18500
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%23343a40' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3E%3C/svg%3E"), url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM12.0303 4.96967C11.7374 4.67678 11.2626 4.67678 10.9697 4.96967C10.9626 4.97674 10.9559 4.98424 10.9498 4.9921L7.4774 9.41674L5.38388 7.32322C5.09098 7.03033 4.61611 7.03033 4.32322 7.32322C4.03032 7.61612 4.03032 8.09099 4.32322 8.38388L6.96966 11.0303C7.26256 11.3232 7.73743 11.3232 8.03032 11.0303C8.03685 11.0238 8.043 11.0169 8.04876 11.0097L12.041 6.01947C12.3232 5.72582 12.3196 5.25897 12.0303 4.96967Z' fill='%2328A745'/%3E%3C/svg%3E%0A");
18451
18501
  }
18452
18502
 
@@ -19338,7 +19388,7 @@ select.multi-select {
19338
19388
  --ss-font-color: #4d4d4d;
19339
19389
  --ss-font-placeholder-color: #212529;
19340
19390
  --ss-disabled-color: #dcdee2;
19341
- --ss-border-color: #dcdee2;
19391
+ --ss-border-color: #6c757d;
19342
19392
  --ss-highlight-color: #fffb8c;
19343
19393
  --ss-success-color: #00b755;
19344
19394
  --ss-error-color: #dc3545;
@@ -19428,8 +19478,11 @@ select.multi-select {
19428
19478
  overflow: hidden;
19429
19479
  min-height: 38px;
19430
19480
  }
19431
- .ss-main.ss-2:focus {
19432
- box-shadow: 0 0 5px var(--ss-focus-color);
19481
+ .ss-main.ss-2:focus-visible {
19482
+ outline: 2px solid #253ebe;
19483
+ box-shadow: none;
19484
+ border-radius: 4px;
19485
+ outline-offset: 2px;
19433
19486
  }
19434
19487
  .ss-main.ss-2.form-select {
19435
19488
  background: none;
@@ -19712,7 +19765,10 @@ select.multi-select {
19712
19765
  vertical-align: middle;
19713
19766
  }
19714
19767
  .ss-content.ss-content-2 .ss-search input:focus {
19715
- box-shadow: 0 0 5px var(--ss-focus-color);
19768
+ outline: 2px solid #253ebe;
19769
+ box-shadow: none;
19770
+ border-radius: 4px;
19771
+ outline-offset: 2px;
19716
19772
  }
19717
19773
  .ss-content.ss-content-2 .ss-search .ss-addable {
19718
19774
  display: -ms-inline-flexbox;
@@ -19904,23 +19960,35 @@ select.multi-select {
19904
19960
  background-color: var(--ss-highlight-color);
19905
19961
  }
19906
19962
 
19907
- .ss-main.multi-select.is-invalid,
19908
- .was-validated .multi-select:invalid + .ss-main.multi-select {
19963
+ .form-select.ss-main.multi-select.is-invalid,
19964
+ .was-validated .multi-select:invalid + .form-select.ss-main.multi-select {
19909
19965
  border-color: #a51f2c;
19910
- background-position: right 1.5rem center;
19966
+ background-position: right 2.5rem center;
19911
19967
  background-repeat: no-repeat;
19968
+ padding-right: 0.5rem;
19912
19969
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
19913
- background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM8 4C7.46459 4 7.04623 4.46229 7.0995 4.99504L7.45025 8.50248C7.47849 8.78492 7.71616 9 8 9C8.28384 9 8.52151 8.78492 8.54975 8.50248L8.9005 4.99504C8.95377 4.46228 8.53541 4 8 4ZM8.00154 10C7.44926 10 7.00154 10.4477 7.00154 11C7.00154 11.5523 7.44926 12 8.00154 12C8.55383 12 9.00154 11.5523 9.00154 11C9.00154 10.4477 8.55383 10 8.00154 10Z' fill='%23D72E3D'/%3E%3C/svg%3E%0A");
19970
+ background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='none' viewBox='0 0 16 16'%3E%3Cpath fill='%23a51f2c' d='M16 8A8 8 0 1 1 0 8a8 8 0 0 1 16 0M8 4a.905.905 0 0 0-.9.995l.35 3.507a.552.552 0 0 0 1.1 0l.35-3.507A.905.905 0 0 0 8 4m.002 6a1 1 0 1 0 0 2 1 1 0 0 0 0-2'/%3E%3C/svg%3E");
19971
+ }
19972
+ .form-select.ss-main.multi-select.is-invalid:focus-visible,
19973
+ .was-validated .multi-select:invalid + .form-select.ss-main.multi-select:focus-visible {
19974
+ border-color: #6c757d;
19975
+ outline-color: #a51f2c;
19914
19976
  }
19915
19977
 
19916
- .ss-main.multi-select.is-valid,
19917
- .was-validated .multi-select:valid + .ss-main.multi-select {
19978
+ .form-select.ss-main.multi-select.is-valid,
19979
+ .was-validated .multi-select:valid + .form-select.ss-main.multi-select {
19918
19980
  border-color: #09854c;
19919
- background-position: right 1.5rem center;
19981
+ background-position: right 2.5rem center;
19920
19982
  background-repeat: no-repeat;
19983
+ padding-right: 0.5rem;
19921
19984
  background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
19922
19985
  background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M16 8C16 12.4183 12.4183 16 8 16C3.58172 16 0 12.4183 0 8C0 3.58172 3.58172 0 8 0C12.4183 0 16 3.58172 16 8ZM12.0303 4.96967C11.7374 4.67678 11.2626 4.67678 10.9697 4.96967C10.9626 4.97674 10.9559 4.98424 10.9498 4.9921L7.4774 9.41674L5.38388 7.32322C5.09098 7.03033 4.61611 7.03033 4.32322 7.32322C4.03032 7.61612 4.03032 8.09099 4.32322 8.38388L6.96966 11.0303C7.26256 11.3232 7.73743 11.3232 8.03032 11.0303C8.03685 11.0238 8.043 11.0169 8.04876 11.0097L12.041 6.01947C12.3232 5.72582 12.3196 5.25897 12.0303 4.96967Z' fill='%2328A745'/%3E%3C/svg%3E%0A");
19923
19986
  }
19987
+ .form-select.ss-main.multi-select.is-valid:focus-visible,
19988
+ .was-validated .multi-select:valid + .form-select.ss-main.multi-select:focus-visible {
19989
+ border-color: #6c757d;
19990
+ outline-color: #09854c;
19991
+ }
19924
19992
 
19925
19993
  .ss-sr-only {
19926
19994
  position: absolute;