@ouestfrance/sipa-bms-ui 8.37.0 → 8.38.0

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.
@@ -1,4 +1,4 @@
1
- @import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap");.bms-button {
1
+ @charset "UTF-8";@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@400;700&display=swap");.bms-button {
2
2
  font-size: 1em;
3
3
  --button-padding: 0.5em;
4
4
  box-sizing: border-box;
@@ -358,8 +358,9 @@
358
358
  --bms-button-disabled-background-color: transparent;
359
359
  --bms-button-disabled-border-color: transparent;
360
360
  --bms-button-disabled-text-color: var(--bms-disabled-color);
361
- }.toggle-icon[data-v-454a2f72] {
362
- --icon-color: var(--bms-grey-100);
361
+ }.toggle-icon[data-v-a7ed1829] {
362
+ /* Default icon: align with field labels (--bms-font-color) */
363
+ --icon-color: var(--bms-font-color);
363
364
  --underline-color: transparent;
364
365
  background: none;
365
366
  border: none;
@@ -373,14 +374,14 @@
373
374
  height: 34px;
374
375
  padding: 7px 0;
375
376
  }
376
- .toggle-icon[data-v-454a2f72] svg {
377
+ .toggle-icon[data-v-a7ed1829] svg {
377
378
  color: var(--icon-color);
378
379
  transition: color 0.2s;
379
380
  width: 20px;
380
381
  height: 20px;
381
382
  display: block;
382
383
  }
383
- .toggle-icon[data-v-454a2f72]::after {
384
+ .toggle-icon[data-v-a7ed1829]::after {
384
385
  content: "";
385
386
  position: absolute;
386
387
  bottom: 3px;
@@ -391,36 +392,36 @@
391
392
  background-color: var(--underline-color);
392
393
  transition: background-color 0.2s;
393
394
  }
394
- .toggle-icon[data-v-454a2f72]:hover:not(.disabled), .toggle-icon._hover[data-v-454a2f72]:not(.disabled) {
395
+ .toggle-icon[data-v-a7ed1829]:hover:not(.disabled), .toggle-icon._hover[data-v-a7ed1829]:not(.disabled) {
395
396
  --icon-color: light-dark(var(--bms-grey-140), var(--bms-grey-25));
396
397
  --underline-color: light-dark(var(--bms-grey-140), var(--bms-grey-25));
397
398
  }
398
- .toggle-icon.active[data-v-454a2f72] {
399
+ .toggle-icon.active[data-v-a7ed1829] {
399
400
  --icon-color: var(--bms-main-100);
400
401
  --underline-color: var(--bms-main-100);
401
402
  }
402
- .toggle-icon.active[data-v-454a2f72]:hover:not(.disabled), .toggle-icon.active._hover[data-v-454a2f72]:not(.disabled) {
403
+ .toggle-icon.active[data-v-a7ed1829]:hover:not(.disabled), .toggle-icon.active._hover[data-v-a7ed1829]:not(.disabled) {
403
404
  --icon-color: light-dark(var(--bms-main-140), var(--bms-main-75));
404
405
  --underline-color: light-dark(var(--bms-main-140), var(--bms-main-75));
405
406
  }
406
- .toggle-icon.disabled[data-v-454a2f72] {
407
- --icon-color: var(--bms-grey-50);
407
+ .toggle-icon.disabled[data-v-a7ed1829] {
408
+ --icon-color: light-dark(var(--bms-grey-50), var(--bms-grey-75));
408
409
  cursor: default;
409
410
  pointer-events: none;
410
411
  }
411
- .toggle-icon.disabled.active[data-v-454a2f72] {
412
- --underline-color: var(--bms-grey-50);
412
+ .toggle-icon.disabled.active[data-v-a7ed1829] {
413
+ --underline-color: light-dark(var(--bms-grey-50), var(--bms-grey-75));
413
414
  }
414
- .toggle-icon.small[data-v-454a2f72] {
415
+ .toggle-icon.small[data-v-a7ed1829] {
415
416
  width: 24px;
416
417
  height: 24px;
417
418
  padding: 0.25em 0;
418
419
  }
419
- .toggle-icon.small[data-v-454a2f72] svg {
420
+ .toggle-icon.small[data-v-a7ed1829] svg {
420
421
  width: 1em;
421
422
  height: 1em;
422
423
  }
423
- .toggle-icon.small[data-v-454a2f72]::after {
424
+ .toggle-icon.small[data-v-a7ed1829]::after {
424
425
  height: 1.5px;
425
426
  bottom: -2px;
426
427
  left: 50%;
@@ -1276,44 +1277,46 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1276
1277
  .switch-wrapper.disabled[data-v-6de1a5c6] {
1277
1278
  --switch-background-color: var(--bms-grey-25);
1278
1279
  --switch-color: var(--bms-grey-50);
1279
- }.input-toggle[data-v-ff0d1a1d] {
1280
- --label-color: var(--bms-grey-100);
1280
+ }
1281
+ .input-toggle[data-v-d84b1655] {
1282
+ /* Align with FieldComponent label (--field-label-color → --bms-font-color) */
1283
+ --label-color: var(--bms-font-color);
1281
1284
  --cursor: pointer;
1282
1285
  font-weight: var(--field-label-font-weight);
1283
1286
  display: flex;
1284
1287
  align-items: center;
1285
1288
  gap: 0.5em;
1286
1289
  }
1287
- .input-toggle__label-group[data-v-ff0d1a1d] {
1290
+ .input-toggle__label-group[data-v-d84b1655] {
1288
1291
  display: flex;
1289
1292
  align-items: center;
1290
1293
  }
1291
- .input-toggle.overflow[data-v-ff0d1a1d] {
1294
+ .input-toggle.overflow[data-v-d84b1655] {
1292
1295
  width: 100%;
1293
1296
  }
1294
- .input-toggle.overflow .input-toggle__label-group[data-v-ff0d1a1d] {
1297
+ .input-toggle.overflow .input-toggle__label-group[data-v-d84b1655] {
1295
1298
  flex: 1;
1296
1299
  min-width: 0;
1297
1300
  }
1298
- .input-toggle.overflow .input-switch-info[data-v-ff0d1a1d] {
1301
+ .input-toggle.overflow .input-switch-info[data-v-d84b1655] {
1299
1302
  width: 100%;
1300
1303
  white-space: nowrap;
1301
1304
  overflow: hidden;
1302
1305
  word-break: break-all;
1303
1306
  text-overflow: ellipsis;
1304
1307
  }
1305
- .input-toggle .input-switch-info[data-v-ff0d1a1d] {
1308
+ .input-toggle .input-switch-info[data-v-d84b1655] {
1306
1309
  color: var(--label-color);
1307
1310
  transition: 0.2s;
1308
1311
  }
1309
- .input-toggle.isOn[data-v-ff0d1a1d] {
1312
+ .input-toggle.isOn[data-v-d84b1655] {
1310
1313
  --label-color: var(--bms-main-100);
1311
1314
  }
1312
- .input-toggle.disabled[data-v-ff0d1a1d] {
1313
- --label-color: var(--bms-grey-50);
1315
+ .input-toggle.disabled[data-v-d84b1655] {
1316
+ --label-color: light-dark(var(--bms-grey-50), var(--bms-grey-75));
1314
1317
  --cursor: default;
1315
1318
  }
1316
- .input-toggle[data-v-ff0d1a1d]:hover {
1319
+ .input-toggle[data-v-d84b1655]:hover {
1317
1320
  cursor: var(--cursor);
1318
1321
  }.tag[data-v-e5e0c8c0] {
1319
1322
  --tag-border-color: var(--bms-main-100);
@@ -1473,12 +1476,12 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1473
1476
  line-height: 1;
1474
1477
  width: 100%;
1475
1478
  height: 100%;
1476
- }.select-wrapper[data-v-0e5e744a] {
1479
+ }.select-wrapper[data-v-374cfaec] {
1477
1480
  --field-border-color: light-dark(var(--bms-grey-50), var(--bms-grey-140));
1478
1481
  --field-border-color-active: var(--bms-main-100);
1479
1482
  --input-background-color: var(--bms-white);
1480
1483
  }
1481
- .select-wrapper .field__input-label[data-v-0e5e744a] {
1484
+ .select-wrapper .field__input-label[data-v-374cfaec] {
1482
1485
  display: block;
1483
1486
  color: var(--bms-grey-50);
1484
1487
  font-size: 12px;
@@ -1486,7 +1489,7 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1486
1489
  margin-top: 6px;
1487
1490
  margin-bottom: 4px;
1488
1491
  }
1489
- .select-wrapper .select-input[data-v-0e5e744a] {
1492
+ .select-wrapper .select-input[data-v-374cfaec] {
1490
1493
  width: 100%;
1491
1494
  padding: 0 0 0 var(--field-padding);
1492
1495
  border-radius: var(--bms-border-radius);
@@ -1497,16 +1500,16 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1497
1500
  align-items: center;
1498
1501
  justify-content: space-between;
1499
1502
  }
1500
- .select-wrapper .select-input .field__input-icon[data-v-0e5e744a] {
1503
+ .select-wrapper .select-input .field__input-icon[data-v-374cfaec] {
1501
1504
  display: flex;
1502
1505
  }
1503
- .select-wrapper .select-input .field__input-icon--start[data-v-0e5e744a] {
1506
+ .select-wrapper .select-input .field__input-icon--start[data-v-374cfaec] {
1504
1507
  margin-right: 0.5em;
1505
1508
  }
1506
- .select-wrapper .select-input .field__input-icon--end[data-v-0e5e744a] {
1509
+ .select-wrapper .select-input .field__input-icon--end[data-v-374cfaec] {
1507
1510
  margin-left: 0.5em;
1508
1511
  }
1509
- .select-wrapper .select-input input[data-v-0e5e744a] {
1512
+ .select-wrapper .select-input input[data-v-374cfaec] {
1510
1513
  border: none;
1511
1514
  background-color: transparent;
1512
1515
  flex-grow: 1;
@@ -1522,63 +1525,61 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1522
1525
  width: 100%;
1523
1526
  height: 100%;
1524
1527
  }
1525
- .select-wrapper .select-input__tags[data-v-0e5e744a] {
1528
+ .select-wrapper .select-input__tags[data-v-374cfaec] {
1526
1529
  display: flex;
1527
1530
  gap: 0.5em;
1528
1531
  padding: var(--field-margin);
1529
1532
  flex-wrap: wrap;
1530
1533
  }
1531
- .select-wrapper .select-input__tags[data-v-0e5e744a]:not(:empty) {
1534
+ .select-wrapper .select-input__tags[data-v-374cfaec]:not(:empty) {
1532
1535
  margin-right: 0.5em;
1533
1536
  }
1534
- .select-wrapper .select-input[data-v-0e5e744a]:hover {
1537
+ .select-wrapper .select-input[data-v-374cfaec]:hover {
1535
1538
  --field-border-color: var(--bms-grey-100);
1536
1539
  }
1537
- .select-wrapper .select-input[data-v-0e5e744a]:has(input:focus) {
1540
+ .select-wrapper .select-input[data-v-374cfaec]:has(input:focus) {
1538
1541
  --field-border-color: var(--field-border-color-active);
1539
1542
  }
1540
- .select-wrapper .select-input.is-error[data-v-0e5e744a] {
1543
+ .select-wrapper .select-input.is-error[data-v-374cfaec] {
1541
1544
  --field-border-color: var(--bms-red-100);
1542
1545
  --input-background-color: var(--bms-red-25);
1543
1546
  }
1544
- .select-wrapper .select-input.is-disabled[data-v-0e5e744a] {
1547
+ .select-wrapper .select-input.is-disabled[data-v-374cfaec] {
1545
1548
  --field-border-color: var(--bms-field-disabled-border-color);
1546
1549
  --input-background-color: var(--bms-field-disabled-background);
1547
1550
  color: var(--bms-field-disabled-text-color);
1548
1551
  pointer-events: none;
1549
1552
  }
1550
- .select-wrapper .select-input.is-disabled input[data-v-0e5e744a]:disabled {
1553
+ .select-wrapper .select-input.is-disabled input[data-v-374cfaec]:disabled {
1551
1554
  opacity: 1;
1552
1555
  -webkit-text-fill-color: currentColor;
1553
1556
  }
1554
- .select-wrapper .icon-container[data-v-0e5e744a] {
1557
+ .select-wrapper .icon-container[data-v-374cfaec] {
1555
1558
  height: 100%;
1556
1559
  display: flex;
1557
1560
  align-items: center;
1558
1561
  }
1559
- .select-wrapper .icon-container[data-v-0e5e744a]:hover {
1562
+ .select-wrapper .icon-container[data-v-374cfaec]:hover {
1560
1563
  cursor: pointer;
1561
1564
  }
1562
- .select-wrapper .icon-button[data-v-0e5e744a] {
1565
+ .select-wrapper .icon-button[data-v-374cfaec] {
1563
1566
  width: 1em;
1564
1567
  margin: 0 var(--field-padding);
1565
1568
  display: block;
1566
1569
  }
1567
- .combobox-option[data-v-0e5e744a] {
1570
+ .combobox-option[data-v-374cfaec] {
1568
1571
  display: flex;
1569
1572
  align-items: center;
1570
1573
  gap: 0.5em;
1571
1574
  }
1572
- .combobox-option__check[data-v-0e5e744a] {
1575
+ .combobox-option__check[data-v-374cfaec] {
1573
1576
  width: 1em;
1574
1577
  display: flex;
1575
1578
  justify-content: center;
1576
1579
  }
1577
- .combobox-option--select-all[data-v-0e5e744a] {
1580
+ .combobox-option--select-all[data-v-374cfaec] {
1578
1581
  font-weight: 600;
1579
1582
  width: 100%;
1580
- border-bottom: 1px solid var(--bms-border-color);
1581
- padding-bottom: 0.25em;
1582
1583
  }.field__input textarea[data-v-6d84521c] {
1583
1584
  display: flex;
1584
1585
  align-items: center;
@@ -1667,11 +1668,8 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1667
1668
  }
1668
1669
  .page[data-v-31057778] .header .actions .add-button {
1669
1670
  text-align: end;
1670
- }.card[data-v-4a124ead] {
1671
- --summary-card-background-color: light-dark(
1672
- rgba(255, 255, 255, 0.5),
1673
- rgba(0, 0, 0, 0.5)
1674
- );
1671
+ }.card[data-v-64676bba] {
1672
+ --summary-card-background-color: var(--bms-card-default-glass-background);
1675
1673
  --summary-card-color: var(--bms-font-color);
1676
1674
  --card-margin: 2px;
1677
1675
  border: 1px solid var(--bms-border-color);
@@ -1679,31 +1677,31 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1679
1677
  position: relative;
1680
1678
  overflow: hidden;
1681
1679
  }
1682
- .card.card--information[data-v-4a124ead] {
1680
+ .card.card--information[data-v-64676bba] {
1683
1681
  --summary-card-color: var(--bms-white);
1684
1682
  --summary-card-background-color: var(--bms-main-100);
1685
1683
  }
1686
- .card.card--success[data-v-4a124ead] {
1684
+ .card.card--success[data-v-64676bba] {
1687
1685
  --summary-card-color: var(--bms-white);
1688
1686
  --summary-card-background-color: var(--bms-success-color);
1689
1687
  }
1690
- .card.card--warning[data-v-4a124ead] {
1688
+ .card.card--warning[data-v-64676bba] {
1691
1689
  --summary-card-color: var(--bms-white);
1692
1690
  --summary-card-background-color: var(--bms-warning-color);
1693
1691
  }
1694
- .card.card--danger[data-v-4a124ead] {
1692
+ .card.card--danger[data-v-64676bba] {
1695
1693
  --summary-card-color: var(--bms-white);
1696
1694
  --summary-card-background-color: var(--bms-danger-color);
1697
1695
  }
1698
- .card[data-v-4a124ead] {
1696
+ .card[data-v-64676bba] {
1699
1697
  --card-content-border-radius: var(--bms-border-radius-large);
1700
1698
  }
1701
- .card .hasAction[data-v-4a124ead] {
1699
+ .card .hasAction[data-v-64676bba] {
1702
1700
  --card-content-border-radius: var(--bms-border-radius-large)
1703
1701
  var(--bms-border-radius-large) 0 0;
1704
1702
  cursor: pointer;
1705
1703
  }
1706
- .card__body[data-v-4a124ead] {
1704
+ .card__body[data-v-64676bba] {
1707
1705
  position: relative;
1708
1706
  min-height: 50px;
1709
1707
  min-width: 50px;
@@ -1714,18 +1712,18 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1714
1712
  justify-content: space-between;
1715
1713
  flex-direction: column;
1716
1714
  }
1717
- .card__body__content[data-v-4a124ead] {
1715
+ .card__body__content[data-v-64676bba] {
1718
1716
  height: 100%;
1719
1717
  border-radius: var(--card-content-border-radius);
1720
1718
  background-color: var(--summary-card-background-color);
1721
1719
  backdrop-filter: blur(40px);
1722
1720
  color: var(--summary-card-color);
1723
1721
  }
1724
- .card__body__content__link[data-v-4a124ead] {
1722
+ .card__body__content__link[data-v-64676bba] {
1725
1723
  color: var(--summary-card-color);
1726
1724
  text-decoration: none;
1727
1725
  }
1728
- .card__body__action[data-v-4a124ead] {
1726
+ .card__body__action[data-v-64676bba] {
1729
1727
  border-top: 1px solid var(--bms-border-color);
1730
1728
  border-radius: 0 0 var(--bms-border-radius-large) var(--bms-border-radius-large);
1731
1729
  background-color: var(--bms-white);
@@ -1733,7 +1731,7 @@ input[type=radio][data-v-c0c9efa3]:checked::before {
1733
1731
  padding: 0.5em;
1734
1732
  cursor: pointer;
1735
1733
  }
1736
- .card .blob[data-v-4a124ead] {
1734
+ .card .blob[data-v-64676bba] {
1737
1735
  transform: translate(10px, 10px);
1738
1736
  width: 60%;
1739
1737
  height: 60%;
@@ -2653,13 +2651,13 @@ nav .additional[data-v-8b4752b4] {
2653
2651
  .bms-table__row__cell--child-element__icon[data-v-c01ccc48] {
2654
2652
  display: flex;
2655
2653
  margin-right: 1em;
2656
- }.bms-table[data-v-e3356948] {
2654
+ }.bms-table[data-v-2b029949] {
2657
2655
  --table-cell-padding: 1em;
2658
2656
  --table-cell-radius: var(--bms-border-radius-large);
2659
2657
  --dynamic-border-height: 2px;
2660
2658
  --table-border: 1px solid var(--bms-border-color);
2661
2659
  }
2662
- .bms-table__loader[data-v-e3356948] {
2660
+ .bms-table__loader[data-v-2b029949] {
2663
2661
  position: absolute;
2664
2662
  background: color-mix(in srgb, var(--bms-white) 72%, transparent);
2665
2663
  inset: 0;
@@ -2669,119 +2667,126 @@ nav .additional[data-v-8b4752b4] {
2669
2667
  font-size: 3em;
2670
2668
  z-index: 10;
2671
2669
  }
2672
- .bms-table__actions[data-v-e3356948] {
2670
+ .bms-table__actions[data-v-2b029949] {
2673
2671
  display: flex;
2674
2672
  align-items: center;
2675
2673
  justify-content: space-between;
2676
2674
  margin-bottom: 1em;
2677
2675
  }
2678
- .bms-table__actions--small[data-v-e3356948] {
2676
+ .bms-table__actions--small[data-v-2b029949] {
2679
2677
  margin-bottom: 0.5em;
2680
2678
  }
2681
- .bms-table__actions__saved-filters[data-v-e3356948] {
2679
+ .bms-table__actions__saved-filters[data-v-2b029949] {
2682
2680
  display: flex;
2683
2681
  align-items: center;
2684
2682
  flex-wrap: wrap;
2685
2683
  gap: 1em;
2686
2684
  }
2687
- .bms-table__actions__search[data-v-e3356948] {
2685
+ .bms-table__actions__search[data-v-2b029949] {
2688
2686
  display: flex;
2689
2687
  align-items: center;
2690
2688
  gap: 1em;
2691
2689
  }
2692
- .bms-table__actions__custom[data-v-e3356948] {
2690
+ .bms-table__actions__custom[data-v-2b029949] {
2693
2691
  display: flex;
2694
2692
  gap: 1em;
2695
2693
  }
2696
- .bms-table__actions__custom[data-v-e3356948]:empty {
2694
+ .bms-table__actions__custom[data-v-2b029949]:empty {
2697
2695
  display: none;
2698
2696
  }
2699
- .bms-table__selected[data-v-e3356948] {
2697
+ .bms-table__selected[data-v-2b029949] {
2700
2698
  margin-bottom: 1em;
2701
2699
  }
2702
- .bms-table__selected .select-mode-all[data-v-e3356948] {
2700
+ .bms-table__selected .select-mode-all[data-v-2b029949] {
2703
2701
  cursor: pointer;
2704
2702
  color: var(--bms-main-100);
2705
2703
  }
2706
- .bms-table__cell__checkbox[data-v-e3356948] {
2704
+ .bms-table__cell__checkbox[data-v-2b029949] {
2707
2705
  width: 4em;
2708
2706
  }
2709
- .bms-table__cell--action[data-v-e3356948] {
2707
+ .bms-table__cell--action[data-v-2b029949] {
2710
2708
  display: flex;
2711
2709
  justify-content: end;
2712
2710
  }
2713
- .bms-table__cell--empty[data-v-e3356948] {
2711
+ .bms-table__cell--empty[data-v-2b029949] {
2714
2712
  height: 360px;
2715
2713
  }
2716
- .bms-table__table[data-v-e3356948] {
2714
+ .bms-table__table[data-v-2b029949] {
2717
2715
  width: 100%;
2718
2716
  border-spacing: 0 var(--dynamic-border-height);
2719
2717
  border-radius: var(--bms-border-radius-large);
2720
2718
  border: var(--table-border);
2721
2719
  position: relative;
2722
2720
  }
2723
- .bms-table__table-wrapper[data-v-e3356948] {
2721
+ .bms-table__table-wrapper[data-v-2b029949] {
2724
2722
  position: relative;
2725
2723
  }
2726
- .bms-table__table thead[data-v-e3356948] {
2724
+ .bms-table__table thead[data-v-2b029949] {
2727
2725
  position: sticky;
2728
2726
  z-index: 2;
2729
2727
  top: var(--header-height, 0);
2730
2728
  }
2731
- .bms-table__table--dense[data-v-e3356948] {
2729
+ .bms-table__table--dense[data-v-2b029949] {
2732
2730
  --table-cell-padding: 0.5em 1em;
2733
2731
  }
2734
- .bms-table__table[data-v-e3356948] tr td {
2732
+ .bms-table__table[data-v-2b029949] tr td {
2735
2733
  padding: var(--table-cell-padding);
2736
2734
  }
2737
- .bms-table__table th[data-v-e3356948] {
2735
+ .bms-table__table th[data-v-2b029949] {
2738
2736
  --header-content-sort-icon-color: var(--bms-grey-25);
2739
2737
  --header-content-justify: start;
2740
2738
  width: var(--table-cell-width, auto);
2741
2739
  padding: var(--table-cell-padding);
2742
2740
  }
2743
- .bms-table__table th.sortable[data-v-e3356948]:hover {
2744
- --header-content-sort-icon-color: var(--bms-grey-100);
2741
+ .bms-table__table th.sortable[data-v-2b029949]:hover {
2742
+ --header-content-sort-icon-color: light-dark(
2743
+ var(--bms-grey-100),
2744
+ var(--bms-font-color)
2745
+ );
2745
2746
  cursor: pointer;
2746
2747
  }
2747
- .bms-table__table th.u-text-align-start[data-v-e3356948] {
2748
+ .bms-table__table th.u-text-align-start[data-v-2b029949] {
2748
2749
  --header-content-justify: start;
2749
2750
  }
2750
- .bms-table__table th.u-text-align-center[data-v-e3356948] {
2751
+ .bms-table__table th.u-text-align-center[data-v-2b029949] {
2751
2752
  --header-content-justify: center;
2752
2753
  }
2753
- .bms-table__table th.u-text-align-end[data-v-e3356948] {
2754
+ .bms-table__table th.u-text-align-end[data-v-2b029949] {
2754
2755
  --header-content-justify: end;
2755
2756
  }
2756
- .bms-table__table th.sorted[data-v-e3356948] {
2757
- --header-content-sort-icon-color: var(--bms-grey-100);
2757
+ .bms-table__table th.sorted[data-v-2b029949] {
2758
+ --header-content-sort-icon-color: light-dark(
2759
+ var(--bms-grey-100),
2760
+ var(--bms-font-color)
2761
+ );
2758
2762
  }
2759
- .bms-table__table th .header-content[data-v-e3356948] {
2763
+ .bms-table__table th .header-content[data-v-2b029949] {
2760
2764
  display: flex;
2761
2765
  align-items: center;
2762
2766
  justify-content: var(--header-content-justify);
2763
2767
  gap: 0.5em;
2764
2768
  }
2765
- .bms-table__table th .header-content-sort[data-v-e3356948] {
2769
+ .bms-table__table th .header-content-sort[data-v-2b029949] {
2770
+ flex-shrink: 0;
2766
2771
  color: var(--header-content-sort-icon-color);
2767
2772
  }
2768
- .bms-table__table th .header-content-helper[data-v-e3356948] {
2773
+ .bms-table__table th .header-content-helper[data-v-2b029949] {
2769
2774
  display: flex;
2770
2775
  align-items: center;
2771
2776
  flex-shrink: 0;
2772
- color: var(--bms-grey-100);
2777
+ color: light-dark(var(--bms-grey-100), var(--bms-font-color));
2773
2778
  }
2774
- .bms-table__footer[data-v-e3356948] {
2779
+ .bms-table__footer[data-v-2b029949] {
2775
2780
  padding-top: 16px;
2776
2781
  }
2777
- .bms-table .blob[data-v-e3356948] {
2782
+ .bms-table .blob[data-v-2b029949] {
2778
2783
  visibility: hidden;
2779
2784
  --table-blob-height: 80px;
2780
2785
  }
2781
- .bms-table .blob.small[data-v-e3356948], .bms-table .blob.dense[data-v-e3356948] {
2786
+ .bms-table .blob.small[data-v-2b029949], .bms-table .blob.dense[data-v-2b029949] {
2782
2787
  --table-blob-height: 50px;
2783
2788
  }
2784
- .bms-table .blob[data-v-e3356948] {
2789
+ .bms-table .blob[data-v-2b029949] {
2785
2790
  width: 200px;
2786
2791
  height: var(--table-blob-height);
2787
2792
  background-color: var(--bms-main-50);
@@ -2790,29 +2795,29 @@ nav .additional[data-v-8b4752b4] {
2790
2795
  z-index: -5;
2791
2796
  filter: blur(20px);
2792
2797
  }
2793
- [data-v-e3356948] table {
2798
+ [data-v-2b029949] table {
2794
2799
  padding: 0 var(--dynamic-border-height);
2795
2800
  }
2796
- [data-v-e3356948] table th:first-child {
2801
+ [data-v-2b029949] table th:first-child {
2797
2802
  border-top-left-radius: var(--table-cell-radius);
2798
2803
  }
2799
- [data-v-e3356948] table th:last-child {
2804
+ [data-v-2b029949] table th:last-child {
2800
2805
  border-top-right-radius: var(--table-cell-radius);
2801
2806
  }
2802
- [data-v-e3356948] table tr:last-child td:first-child {
2807
+ [data-v-2b029949] table tr:last-child td:first-child {
2803
2808
  border-bottom-left-radius: var(--table-cell-radius);
2804
2809
  }
2805
- [data-v-e3356948] table tr:last-child td:last-child {
2810
+ [data-v-2b029949] table tr:last-child td:last-child {
2806
2811
  border-bottom-right-radius: var(--table-cell-radius);
2807
2812
  }
2808
- [data-v-e3356948] table th {
2813
+ [data-v-2b029949] table th {
2809
2814
  background-color: var(--bms-white);
2810
2815
  }
2811
- [data-v-e3356948] table tbody {
2816
+ [data-v-2b029949] table tbody {
2812
2817
  overflow: hidden;
2813
2818
  background: var(--bms-white);
2814
2819
  }
2815
- [data-v-e3356948] table tbody tr {
2820
+ [data-v-2b029949] table tbody tr {
2816
2821
  position: relative;
2817
2822
  }.filter-button-container[data-v-36a9eb9a] {
2818
2823
  position: relative;
@@ -3225,6 +3230,11 @@ section {
3225
3230
  --bms-red-10: #f9eaeb;
3226
3231
  --bms-white: light-dark(#fcfcfc, #222831);
3227
3232
  --bms-background-color: light-dark(#f8fafd, #151d28);
3233
+ /* Dark: 50% overlay on --bms-background-color matches --bms-white (e.g. BmsTable cells) */
3234
+ --bms-card-default-glass-background: light-dark(
3235
+ rgba(255, 255, 255, 0.5),
3236
+ rgba(47, 51, 58, 0.5)
3237
+ );
3228
3238
  --bms-border-color: light-dark(var(--bms-grey-10), var(--bms-grey-100));
3229
3239
  --bms-border-radius: 4px;
3230
3240
  --bms-border-radius-large: 8px;
@@ -584,7 +584,7 @@ const _export_sfc = (sfc, props) => {
584
584
  return target;
585
585
  };
586
586
 
587
- const BmsToggleIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1r, [["__scopeId", "data-v-454a2f72"]]);
587
+ const BmsToggleIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1r, [["__scopeId", "data-v-a7ed1829"]]);
588
588
 
589
589
  /**
590
590
  * @license lucide-vue-next v1.0.0 - ISC
@@ -70869,7 +70869,7 @@ const _sfc_main$X = /* @__PURE__ */ defineComponent({
70869
70869
  }
70870
70870
  });
70871
70871
 
70872
- const BmsInputToggle = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-ff0d1a1d"]]);
70872
+ const BmsInputToggle = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-d84b1655"]]);
70873
70873
 
70874
70874
  const _hoisted_1$K = {
70875
70875
  key: 0,
@@ -89034,7 +89034,7 @@ const _sfc_main$Q = /* @__PURE__ */ defineComponent({
89034
89034
  }
89035
89035
  });
89036
89036
 
89037
- const BmsCombobox = /* @__PURE__ */ _export_sfc(_sfc_main$Q, [["__scopeId", "data-v-0e5e744a"]]);
89037
+ const BmsCombobox = /* @__PURE__ */ _export_sfc(_sfc_main$Q, [["__scopeId", "data-v-374cfaec"]]);
89038
89038
 
89039
89039
  const _hoisted_1$F = ["value", "required", "placeholder", "disabled"];
89040
89040
  const _sfc_main$P = /* @__PURE__ */ defineComponent({
@@ -89249,7 +89249,7 @@ const _sfc_main$M = /* @__PURE__ */ defineComponent({
89249
89249
  }
89250
89250
  });
89251
89251
 
89252
- const BmsCard = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["__scopeId", "data-v-4a124ead"]]);
89252
+ const BmsCard = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["__scopeId", "data-v-64676bba"]]);
89253
89253
 
89254
89254
  const _hoisted_1$C = { class: "floating-window__header__title" };
89255
89255
  const _hoisted_2$o = { class: "floating-window__header__buttons" };
@@ -98669,7 +98669,7 @@ const _sfc_main$d = /* @__PURE__ */ defineComponent({
98669
98669
  }
98670
98670
  });
98671
98671
 
98672
- const UiBmsTable = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-e3356948"]]);
98672
+ const UiBmsTable = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-2b029949"]]);
98673
98673
 
98674
98674
  const _hoisted_1$a = { class: "filter-button-container" };
98675
98675
  const _hoisted_2$8 = {
@@ -587,7 +587,7 @@
587
587
  return target;
588
588
  };
589
589
 
590
- const BmsToggleIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1r, [["__scopeId", "data-v-454a2f72"]]);
590
+ const BmsToggleIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1r, [["__scopeId", "data-v-a7ed1829"]]);
591
591
 
592
592
  /**
593
593
  * @license lucide-vue-next v1.0.0 - ISC
@@ -70872,7 +70872,7 @@
70872
70872
  }
70873
70873
  });
70874
70874
 
70875
- const BmsInputToggle = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-ff0d1a1d"]]);
70875
+ const BmsInputToggle = /* @__PURE__ */ _export_sfc(_sfc_main$X, [["__scopeId", "data-v-d84b1655"]]);
70876
70876
 
70877
70877
  const _hoisted_1$K = {
70878
70878
  key: 0,
@@ -89037,7 +89037,7 @@
89037
89037
  }
89038
89038
  });
89039
89039
 
89040
- const BmsCombobox = /* @__PURE__ */ _export_sfc(_sfc_main$Q, [["__scopeId", "data-v-0e5e744a"]]);
89040
+ const BmsCombobox = /* @__PURE__ */ _export_sfc(_sfc_main$Q, [["__scopeId", "data-v-374cfaec"]]);
89041
89041
 
89042
89042
  const _hoisted_1$F = ["value", "required", "placeholder", "disabled"];
89043
89043
  const _sfc_main$P = /* @__PURE__ */ vue.defineComponent({
@@ -89252,7 +89252,7 @@
89252
89252
  }
89253
89253
  });
89254
89254
 
89255
- const BmsCard = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["__scopeId", "data-v-4a124ead"]]);
89255
+ const BmsCard = /* @__PURE__ */ _export_sfc(_sfc_main$M, [["__scopeId", "data-v-64676bba"]]);
89256
89256
 
89257
89257
  const _hoisted_1$C = { class: "floating-window__header__title" };
89258
89258
  const _hoisted_2$o = { class: "floating-window__header__buttons" };
@@ -98672,7 +98672,7 @@
98672
98672
  }
98673
98673
  });
98674
98674
 
98675
- const UiBmsTable = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-e3356948"]]);
98675
+ const UiBmsTable = /* @__PURE__ */ _export_sfc(_sfc_main$d, [["__scopeId", "data-v-2b029949"]]);
98676
98676
 
98677
98677
  const _hoisted_1$a = { class: "filter-button-container" };
98678
98678
  const _hoisted_2$8 = {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ouestfrance/sipa-bms-ui",
3
- "version": "8.37.0",
3
+ "version": "8.38.0",
4
4
  "author": "Ouest-France BMS",
5
5
  "license": "ISC",
6
6
  "scripts": {
@@ -42,6 +42,11 @@
42
42
 
43
43
  --bms-white: light-dark(#fcfcfc, #222831);
44
44
  --bms-background-color: light-dark(#f8fafd, #151d28);
45
+ /* Dark: 50% overlay on --bms-background-color matches --bms-white (e.g. BmsTable cells) */
46
+ --bms-card-default-glass-background: light-dark(
47
+ rgba(255, 255, 255, 0.5),
48
+ rgba(47, 51, 58, 0.5)
49
+ );
45
50
  --bms-border-color: light-dark(var(--bms-grey-10), var(--bms-grey-100));
46
51
  --bms-border-radius: 4px;
47
52
  --bms-border-radius-large: 8px;
@@ -38,7 +38,8 @@ const handleClick = (event: MouseEvent) => {
38
38
 
39
39
  <style lang="scss" scoped>
40
40
  .toggle-icon {
41
- --icon-color: var(--bms-grey-100);
41
+ /* Default icon: align with field labels (--bms-font-color) */
42
+ --icon-color: var(--bms-font-color);
42
43
  --underline-color: transparent;
43
44
 
44
45
  background: none;
@@ -92,13 +93,13 @@ const handleClick = (event: MouseEvent) => {
92
93
  }
93
94
 
94
95
  &.disabled {
95
- --icon-color: var(--bms-grey-50);
96
+ --icon-color: light-dark(var(--bms-grey-50), var(--bms-grey-75));
96
97
  cursor: default;
97
98
  pointer-events: none;
98
99
  }
99
100
 
100
101
  &.disabled.active {
101
- --underline-color: var(--bms-grey-50);
102
+ --underline-color: light-dark(var(--bms-grey-50), var(--bms-grey-75));
102
103
  }
103
104
 
104
105
  &.small {
@@ -629,8 +629,6 @@ defineExpose({
629
629
  &--select-all {
630
630
  font-weight: 600;
631
631
  width: 100%;
632
- border-bottom: 1px solid var(--bms-border-color);
633
- padding-bottom: 0.25em;
634
632
  }
635
633
  }
636
634
  </style>
@@ -48,7 +48,8 @@ defineEmits<{
48
48
 
49
49
  <style lang="scss" scoped>
50
50
  .input-toggle {
51
- --label-color: var(--bms-grey-100);
51
+ /* Align with FieldComponent label (--field-label-color --bms-font-color) */
52
+ --label-color: var(--bms-font-color);
52
53
  --cursor: pointer;
53
54
 
54
55
  font-weight: var(--field-label-font-weight);
@@ -86,7 +87,7 @@ defineEmits<{
86
87
  }
87
88
 
88
89
  &.disabled {
89
- --label-color: var(--bms-grey-50);
90
+ --label-color: light-dark(var(--bms-grey-50), var(--bms-grey-75));
90
91
  --cursor: default;
91
92
  }
92
93
 
@@ -58,10 +58,7 @@ window.addEventListener('mousemove', onMouseMove);
58
58
 
59
59
  <style lang="scss" scoped>
60
60
  .card {
61
- --summary-card-background-color: light-dark(
62
- rgba(255, 255, 255, 0.5),
63
- rgba(0, 0, 0, 0.5)
64
- );
61
+ --summary-card-background-color: var(--bms-card-default-glass-background);
65
62
  --summary-card-color: var(--bms-font-color);
66
63
  --card-margin: 2px;
67
64
  border: 1px solid var(--bms-border-color);
@@ -512,7 +512,10 @@ onMounted(() => {
512
512
  padding: var(--table-cell-padding);
513
513
 
514
514
  &.sortable:hover {
515
- --header-content-sort-icon-color: var(--bms-grey-100);
515
+ --header-content-sort-icon-color: light-dark(
516
+ var(--bms-grey-100),
517
+ var(--bms-font-color)
518
+ );
516
519
  cursor: pointer;
517
520
  }
518
521
 
@@ -529,7 +532,10 @@ onMounted(() => {
529
532
  }
530
533
 
531
534
  &.sorted {
532
- --header-content-sort-icon-color: var(--bms-grey-100);
535
+ --header-content-sort-icon-color: light-dark(
536
+ var(--bms-grey-100),
537
+ var(--bms-font-color)
538
+ );
533
539
  }
534
540
 
535
541
  .header-content {
@@ -539,6 +545,7 @@ onMounted(() => {
539
545
  gap: 0.5em;
540
546
 
541
547
  &-sort {
548
+ flex-shrink: 0;
542
549
  color: var(--header-content-sort-icon-color);
543
550
  }
544
551
 
@@ -546,7 +553,7 @@ onMounted(() => {
546
553
  display: flex;
547
554
  align-items: center;
548
555
  flex-shrink: 0;
549
- color: var(--bms-grey-100);
556
+ color: light-dark(var(--bms-grey-100), var(--bms-font-color));
550
557
  }
551
558
  }
552
559
  }