@openui5/themelib_sap_horizon 1.133.0 → 1.134.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.
Files changed (112) hide show
  1. package/.reuse/dep5 +0 -7
  2. package/THIRDPARTY.txt +1 -22
  3. package/package.json +18 -18
  4. package/src/sap/f/themes/sap_horizon/Card.less +14 -19
  5. package/src/sap/f/themes/sap_horizon/CardHeaders.less +1 -2
  6. package/src/sap/f/themes/sap_horizon/ShellBar.less +5 -0
  7. package/src/sap/f/themes/sap_horizon_dark/Card.less +8 -13
  8. package/src/sap/f/themes/sap_horizon_dark/CardHeaders.less +1 -2
  9. package/src/sap/f/themes/sap_horizon_dark/ShellBar.less +5 -0
  10. package/src/sap/f/themes/sap_horizon_hcb/Card.less +3 -8
  11. package/src/sap/f/themes/sap_horizon_hcb/ShellBar.less +5 -0
  12. package/src/sap/f/themes/sap_horizon_hcb/library.source.less +0 -1
  13. package/src/sap/f/themes/sap_horizon_hcw/Card.less +3 -8
  14. package/src/sap/f/themes/sap_horizon_hcw/ShellBar.less +5 -0
  15. package/src/sap/f/themes/sap_horizon_hcw/library.source.less +0 -1
  16. package/src/sap/m/themes/sap_horizon/Avatar.less +13 -0
  17. package/src/sap/m/themes/sap_horizon/Button.less +6 -0
  18. package/src/sap/m/themes/sap_horizon/GenericTile.less +6 -25
  19. package/src/sap/m/themes/sap_horizon/NewsContent.less +1 -1
  20. package/src/sap/m/themes/sap_horizon/ProgressIndicator.less +1 -1
  21. package/src/sap/m/themes/sap_horizon/SplitButton.less +71 -54
  22. package/src/sap/m/themes/sap_horizon/StandardTile.less +2 -2
  23. package/src/sap/m/themes/sap_horizon/SuggestionsPopover.less +6 -1
  24. package/src/sap/m/themes/sap_horizon/Switch.less +109 -91
  25. package/src/sap/m/themes/sap_horizon/TabContainer.less +2 -0
  26. package/src/sap/m/themes/sap_horizon/TabStrip.less +48 -20
  27. package/src/sap/m/themes/sap_horizon/Table.less +5 -5
  28. package/src/sap/m/themes/sap_horizon/Text.less +3 -2
  29. package/src/sap/m/themes/sap_horizon/TextArea.less +2 -1
  30. package/src/sap/m/themes/sap_horizon/TileContainer.less +4 -4
  31. package/src/sap/m/themes/sap_horizon/TileContent.less +3 -3
  32. package/src/sap/m/themes/sap_horizon/ToggleButton.less +53 -41
  33. package/src/sap/m/themes/sap_horizon/ViewSettingsDialog.less +10 -6
  34. package/src/sap/m/themes/sap_horizon/WheelSlider.less +38 -14
  35. package/src/sap/m/themes/sap_horizon_dark/Avatar.less +13 -0
  36. package/src/sap/m/themes/sap_horizon_dark/Button.less +6 -0
  37. package/src/sap/m/themes/sap_horizon_dark/GenericTile.less +15 -37
  38. package/src/sap/m/themes/sap_horizon_dark/NewsContent.less +1 -1
  39. package/src/sap/m/themes/sap_horizon_dark/ProgressIndicator.less +1 -1
  40. package/src/sap/m/themes/sap_horizon_dark/SplitButton.less +70 -54
  41. package/src/sap/m/themes/sap_horizon_dark/StandardTile.less +2 -2
  42. package/src/sap/m/themes/sap_horizon_dark/SuggestionsPopover.less +1 -1
  43. package/src/sap/m/themes/sap_horizon_dark/Switch.less +108 -89
  44. package/src/sap/m/themes/sap_horizon_dark/TabContainer.less +2 -0
  45. package/src/sap/m/themes/sap_horizon_dark/TabStrip.less +50 -21
  46. package/src/sap/m/themes/sap_horizon_dark/Table.less +4 -4
  47. package/src/sap/m/themes/sap_horizon_dark/Text.less +3 -2
  48. package/src/sap/m/themes/sap_horizon_dark/TextArea.less +2 -1
  49. package/src/sap/m/themes/sap_horizon_dark/TileContainer.less +4 -3
  50. package/src/sap/m/themes/sap_horizon_dark/TileContent.less +3 -3
  51. package/src/sap/m/themes/sap_horizon_dark/ToggleButton.less +52 -41
  52. package/src/sap/m/themes/sap_horizon_dark/ViewSettingsDialog.less +10 -6
  53. package/src/sap/m/themes/sap_horizon_dark/WheelSlider.less +34 -11
  54. package/src/sap/m/themes/sap_horizon_hcb/Avatar.less +14 -0
  55. package/src/sap/m/themes/sap_horizon_hcb/Button.less +8 -0
  56. package/src/sap/m/themes/sap_horizon_hcb/GenericTile.less +0 -9
  57. package/src/sap/m/themes/sap_horizon_hcb/InputBase.less +5 -1
  58. package/src/sap/m/themes/sap_horizon_hcb/ObjectStatus.less +40 -40
  59. package/src/sap/m/themes/sap_horizon_hcb/ProgressIndicator.less +1 -1
  60. package/src/sap/m/themes/sap_horizon_hcb/SplitButton.less +3 -2
  61. package/src/sap/m/themes/sap_horizon_hcb/StepInput.less +2 -0
  62. package/src/sap/m/themes/sap_horizon_hcb/Switch.less +108 -90
  63. package/src/sap/m/themes/sap_horizon_hcb/TabContainer.less +5 -2
  64. package/src/sap/m/themes/sap_horizon_hcb/TabStrip.less +44 -17
  65. package/src/sap/m/themes/sap_horizon_hcb/Table.less +6 -6
  66. package/src/sap/m/themes/sap_horizon_hcb/Text.less +2 -1
  67. package/src/sap/m/themes/sap_horizon_hcb/TextArea.less +11 -8
  68. package/src/sap/m/themes/sap_horizon_hcb/Tile.less +9 -9
  69. package/src/sap/m/themes/sap_horizon_hcb/TileContainer.less +5 -5
  70. package/src/sap/m/themes/sap_horizon_hcb/ToggleButton.less +4 -5
  71. package/src/sap/m/themes/sap_horizon_hcb/ViewSettingsDialog.less +9 -6
  72. package/src/sap/m/themes/sap_horizon_hcb/WheelSlider.less +22 -5
  73. package/src/sap/m/themes/sap_horizon_hcw/Avatar.less +13 -0
  74. package/src/sap/m/themes/sap_horizon_hcw/Button.less +8 -0
  75. package/src/sap/m/themes/sap_horizon_hcw/GenericTile.less +0 -9
  76. package/src/sap/m/themes/sap_horizon_hcw/InputBase.less +5 -1
  77. package/src/sap/m/themes/sap_horizon_hcw/ObjectStatus.less +40 -40
  78. package/src/sap/m/themes/sap_horizon_hcw/ProgressIndicator.less +1 -1
  79. package/src/sap/m/themes/sap_horizon_hcw/SplitButton.less +3 -2
  80. package/src/sap/m/themes/sap_horizon_hcw/StepInput.less +2 -0
  81. package/src/sap/m/themes/sap_horizon_hcw/Switch.less +108 -90
  82. package/src/sap/m/themes/sap_horizon_hcw/TabContainer.less +5 -2
  83. package/src/sap/m/themes/sap_horizon_hcw/TabStrip.less +44 -17
  84. package/src/sap/m/themes/sap_horizon_hcw/Table.less +6 -6
  85. package/src/sap/m/themes/sap_horizon_hcw/Text.less +2 -1
  86. package/src/sap/m/themes/sap_horizon_hcw/TextArea.less +11 -8
  87. package/src/sap/m/themes/sap_horizon_hcw/Tile.less +9 -9
  88. package/src/sap/m/themes/sap_horizon_hcw/TileContainer.less +5 -5
  89. package/src/sap/m/themes/sap_horizon_hcw/ToggleButton.less +5 -5
  90. package/src/sap/m/themes/sap_horizon_hcw/ViewSettingsDialog.less +10 -6
  91. package/src/sap/m/themes/sap_horizon_hcw/WheelSlider.less +22 -5
  92. package/src/sap/tnt/themes/sap_horizon/NavigationList.less +10 -3
  93. package/src/sap/tnt/themes/sap_horizon_dark/NavigationList.less +10 -3
  94. package/src/sap/tnt/themes/sap_horizon_hcb/NavigationList.less +10 -3
  95. package/src/sap/tnt/themes/sap_horizon_hcw/NavigationList.less +10 -3
  96. package/src/sap/ui/core/themes/sap_horizon/.theme +1 -1
  97. package/src/sap/ui/core/themes/sap_horizon_dark/.theme +1 -1
  98. package/src/sap/ui/core/themes/sap_horizon_hcb/.theme +1 -1
  99. package/src/sap/ui/core/themes/sap_horizon_hcw/.theme +1 -1
  100. package/src/sap/ui/integration/themes/sap_horizon/ListContent.less +1 -1
  101. package/src/sap/ui/integration/themes/sap_horizon/TableContent.less +1 -1
  102. package/src/sap/uxap/themes/sap_horizon/ObjectPageSection.less +1 -1
  103. package/src/sap/uxap/themes/sap_horizon/ObjectPageSubSection.less +1 -1
  104. package/src/sap/uxap/themes/sap_horizon_dark/ObjectPageSection.less +1 -1
  105. package/src/sap/uxap/themes/sap_horizon_dark/ObjectPageSubSection.less +1 -1
  106. package/src/sap/uxap/themes/sap_horizon_hcb/ObjectPageSection.less +1 -1
  107. package/src/sap/uxap/themes/sap_horizon_hcb/ObjectPageSubSection.less +1 -1
  108. package/src/sap/uxap/themes/sap_horizon_hcw/ObjectPageSection.less +1 -1
  109. package/src/sap/uxap/themes/sap_horizon_hcw/ObjectPageSubSection.less +1 -1
  110. package/LICENSES/LicenseRef-tzdata-PublicDomain.txt +0 -5
  111. package/src/sap/f/themes/sap_horizon_hcb/CardHeaders.less +0 -28
  112. package/src/sap/f/themes/sap_horizon_hcw/CardHeaders.less +0 -28
@@ -426,154 +426,154 @@
426
426
 
427
427
  /* Second set of inverted indication colors regular state */
428
428
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusWrapper {
429
- background-color: var(--sapIndicationColor_1_Background);
430
- border-color: var(--sapIndicationColor_1_BorderColor);
429
+ background-color: var(--sapIndicationColor_1b_Background);
430
+ border-color: var(--sapIndicationColor_1b_BorderColor);
431
431
  }
432
432
 
433
433
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusText,
434
434
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusIcon {
435
435
  text-shadow: none;
436
- color: var(--sapIndicationColor_1_TextColor);
436
+ color: var(--sapIndicationColor_1b_TextColor);
437
437
  }
438
438
 
439
439
  .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusWrapper {
440
- background-color: var(--sapIndicationColor_2_Background);
441
- border-color: var(--sapIndicationColor_2_BorderColor);
440
+ background-color: var(--sapIndicationColor_2b_Background);
441
+ border-color: var(--sapIndicationColor_2b_BorderColor);
442
442
  }
443
443
 
444
444
  .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusText,
445
445
  .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusIcon {
446
446
  text-shadow: none;
447
- color: var(--sapIndicationColor_2_TextColor);
447
+ color: var(--sapIndicationColor_2b_TextColor);
448
448
  }
449
449
 
450
450
  .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusWrapper {
451
- background-color: var(--sapIndicationColor_3_Background);
452
- border-color: var(--sapIndicationColor_3_BorderColor);
451
+ background-color: var(--sapIndicationColor_3b_Background);
452
+ border-color: var(--sapIndicationColor_3b_BorderColor);
453
453
  }
454
454
 
455
455
  .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusText,
456
456
  .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusIcon {
457
457
  text-shadow: none;
458
- color: var(--sapIndicationColor_3_TextColor);
458
+ color: var(--sapIndicationColor_3b_TextColor);
459
459
  }
460
460
 
461
461
  .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusWrapper {
462
- background-color: var(--sapIndicationColor_4_Background);
463
- border-color: var(--sapIndicationColor_4_BorderColor);
462
+ background-color: var(--sapIndicationColor_4b_Background);
463
+ border-color: var(--sapIndicationColor_4b_BorderColor);
464
464
  }
465
465
 
466
466
  .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusText,
467
467
  .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusIcon {
468
468
  text-shadow: none;
469
- color: var(--sapIndicationColor_4_TextColor);
469
+ color: var(--sapIndicationColor_4b_TextColor);
470
470
  }
471
471
 
472
472
  .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusWrapper {
473
- background-color: var(--sapIndicationColor_5_Background);
474
- border-color: var(--sapIndicationColor_5_BorderColor);
473
+ background-color: var(--sapIndicationColor_5b_Background);
474
+ border-color: var(--sapIndicationColor_5b_BorderColor);
475
475
  }
476
476
 
477
477
  .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusText,
478
478
  .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusIcon {
479
479
  text-shadow: none;
480
- color: var(--sapIndicationColor_5_TextColor);
480
+ color: var(--sapIndicationColor_5b_TextColor);
481
481
  }
482
482
 
483
483
  .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusWrapper {
484
- background-color: var(--sapIndicationColor_6_Background);
485
- border-color: var(--sapIndicationColor_6_BorderColor);
484
+ background-color: var(--sapIndicationColor_6b_Background);
485
+ border-color: var(--sapIndicationColor_6b_BorderColor);
486
486
  }
487
487
 
488
488
  .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusText,
489
489
  .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusIcon {
490
490
  text-shadow: none;
491
- color: var(--sapIndicationColor_6_TextColor);
491
+ color: var(--sapIndicationColor_6b_TextColor);
492
492
  }
493
493
 
494
494
  .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusWrapper {
495
- background-color: var(--sapIndicationColor_7_Background);
496
- border-color: var(--sapIndicationColor_7_BorderColor);
495
+ background-color: var(--sapIndicationColor_7b_Background);
496
+ border-color: var(--sapIndicationColor_7b_BorderColor);
497
497
  }
498
498
 
499
499
  .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusText,
500
500
  .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusIcon {
501
501
  text-shadow: none;
502
- color: var(--sapIndicationColor_7_TextColor);
502
+ color: var(--sapIndicationColor_7b_TextColor);
503
503
  }
504
504
 
505
505
  .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusWrapper {
506
- background-color: var(--sapIndicationColor_8_Background);
507
- border-color: var(--sapIndicationColor_8_BorderColor);
506
+ background-color: var(--sapIndicationColor_8b_Background);
507
+ border-color: var(--sapIndicationColor_8b_BorderColor);
508
508
  }
509
509
 
510
510
  .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusText,
511
511
  .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusIcon {
512
512
  text-shadow: none;
513
- color: var(--sapIndicationColor_8_TextColor);
513
+ color: var(--sapIndicationColor_8b_TextColor);
514
514
  }
515
515
 
516
516
  .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusWrapper {
517
- background-color: var(--sapIndicationColor_9_Background);
518
- border-color: var(--sapIndicationColor_9_BorderColor);
517
+ background-color: var(--sapIndicationColor_9b_Background);
518
+ border-color: var(--sapIndicationColor_9b_BorderColor);
519
519
  }
520
520
 
521
521
  .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusText,
522
522
  .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusIcon {
523
523
  text-shadow: none;
524
- color: var(--sapIndicationColor_9_TextColor);
524
+ color: var(--sapIndicationColor_9b_TextColor);
525
525
  }
526
526
 
527
527
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusWrapper {
528
- background-color: var(--sapIndicationColor_10_Background);
529
- border-color: var(--sapIndicationColor_10_BorderColor);
528
+ background-color: var(--sapIndicationColor_10b_Background);
529
+ border-color: var(--sapIndicationColor_10b_BorderColor);
530
530
  }
531
531
 
532
532
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusText,
533
533
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusIcon {
534
534
  text-shadow: none;
535
- color: var(--sapIndicationColor_10_TextColor);
535
+ color: var(--sapIndicationColor_10b_TextColor);
536
536
  }
537
537
 
538
538
  /* Second set of inverted indication colors hovered state */
539
539
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
540
- background-color: var(--sapIndicationColor_1_Hover_Background);
540
+ background-color: var(--sapIndicationColor_1b_Hover_Background);
541
541
  }
542
542
 
543
543
  .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
544
- background-color: var(--sapIndicationColor_2_Hover_Background);
544
+ background-color: var(--sapIndicationColor_2b_Hover_Background);
545
545
  }
546
546
 
547
547
  .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
548
- background-color: var(--sapIndicationColor_3_Hover_Background);
548
+ background-color: var(--sapIndicationColor_3b_Hover_Background);
549
549
  }
550
550
 
551
551
  .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
552
- background-color: var(--sapIndicationColor_4_Hover_Background);
552
+ background-color: var(--sapIndicationColor_4b_Hover_Background);
553
553
  }
554
554
 
555
555
  .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
556
- background-color: var(--sapIndicationColor_5_Hover_Background);
556
+ background-color: var(--sapIndicationColor_5b_Hover_Background);
557
557
  }
558
558
 
559
559
  .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
560
- background-color: var(--sapIndicationColor_6_Hover_Background);
560
+ background-color: var(--sapIndicationColor_6b_Hover_Background);
561
561
  }
562
562
 
563
563
  .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
564
- background-color: var(--sapIndicationColor_7_Hover_Background);
564
+ background-color: var(--sapIndicationColor_7b_Hover_Background);
565
565
  }
566
566
 
567
567
  .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
568
- background-color: var(--sapIndicationColor_8_Hover_Background);
568
+ background-color: var(--sapIndicationColor_8b_Hover_Background);
569
569
  }
570
570
 
571
571
  .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
572
- background-color: var(--sapIndicationColor_9_Hover_Background);
572
+ background-color: var(--sapIndicationColor_9b_Hover_Background);
573
573
  }
574
574
 
575
575
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
576
- background-color: var(--sapIndicationColor_10_Hover_Background);
576
+ background-color: var(--sapIndicationColor_10b_Hover_Background);
577
577
  }
578
578
 
579
579
  html.sap-desktop .sapMObjStatusActive:focus .sapMObjStatusLink::after {
@@ -235,7 +235,7 @@
235
235
 
236
236
  /* Condensed */
237
237
  .sapUiSizeCondensed .sapUiTableDataCell .sapMPI:not(.sapMPIDisplayOnly) {
238
- padding: 0.4375rem 0;
238
+ padding: 0.375rem 1.25rem 0.375rem 0;
239
239
  margin: 0;
240
240
  }
241
241
 
@@ -8,18 +8,19 @@
8
8
  bottom: 0.375rem;
9
9
  left: 0.125rem;
10
10
  right: 0.125rem;
11
- border: 0.125rem dotted @sapUiContentFocusColor;
11
+ border: 0.125rem dotted var(--sapContent_FocusColor);
12
12
  border-radius: 0.375rem
13
13
  }
14
14
 
15
15
  .sapUiSizeCompact {
16
+
16
17
  .sapMSB:focus .sapMSBInner:not(.sapMSBInnerDisabled)::after {
17
18
  top: 0.3125rem;
18
19
  bottom: 0.3125rem;
19
20
  }
20
21
  }
21
22
 
22
- //ie
23
+ /* ie */
23
24
  .sapMSBTextIE.sapMSBText {
24
25
  padding-right: 2.25rem;
25
26
  }
@@ -4,7 +4,9 @@
4
4
  /* ================================== */
5
5
 
6
6
  .sapMStepInput:focus {
7
+
7
8
  .sapMInputBaseContentWrapper:not(.sapMInputBaseReadonlyWrapper):not(.sapMStepInputReadOnly) {
9
+
8
10
  &::before {
9
11
  border-width: 2px;
10
12
  }
@@ -3,41 +3,37 @@
3
3
  /* Horizon High Contrast Black theme */
4
4
  /* ================================== */
5
5
 
6
- /* ------------------------------ */
7
- /* Switch container */
8
- /* ------------------------------ */
9
-
6
+ /* Switch container */
10
7
  .sapMSwtCont {
11
8
  overflow: hidden;
12
- //in order to have a touchable area of 2.75rem height and 3.5rem width
9
+ /* in order to have a touchable area of 2.75rem height and 3.5rem width */
13
10
  padding: 0.625rem 0.5rem;
14
11
  }
15
12
 
16
13
  /* focus */
17
-
18
14
  html.sap-desktop {
19
- .sapMSwtCont:focus > .sapMSwt:before {
20
- content: " ";
15
+
16
+ .sapMSwtCont:focus > .sapMSwt::before {
17
+ content: ' ';
21
18
  position: absolute;
22
19
  display: block;
23
20
  top: -0.3125rem;
24
21
  left: -0.3125rem;
25
22
  bottom: -0.3125rem;
26
23
  right: -0.3125rem;
27
- border: 0.125rem solid @sapUiContentFocusColor;
24
+ border: 0.125rem solid var(--sapContent_FocusColor);
28
25
  border-radius: 1rem;
29
26
  }
27
+
30
28
  .sapUiSizeCompact {
31
- .sapMSwtCont:focus > .sapMSwt:before {
29
+
30
+ .sapMSwtCont:focus > .sapMSwt::before {
32
31
  border-radius: 0.875rem;
33
32
  }
34
33
  }
35
34
  }
36
35
 
37
- /* ------------------------------ */
38
- /* Switch */
39
- /* ------------------------------ */
40
-
36
+ /* Switch */
41
37
  .sapMSwt {
42
38
  width: 2.875rem;
43
39
  height: 1.5rem;
@@ -45,18 +41,23 @@ html.sap-desktop {
45
41
  border: none;
46
42
  margin: 0;
47
43
  border-radius: 0.75rem;
44
+
48
45
  &.sapMSwtNoLabel,
49
46
  &.sapMSwtAcceptReject {
50
47
  width: 2.5rem;
51
48
  height: 1.5rem;
49
+
52
50
  .sapMSwtText {
51
+
53
52
  &.sapMSwtTextOn {
54
53
  left: 1.8rem;
55
54
  }
55
+
56
56
  &.sapMSwtTextOff {
57
57
  left: 2rem;
58
58
  }
59
59
  }
60
+
60
61
  &.sapMSwtOn .sapMSwtHandle {
61
62
  left: 1.5rem;
62
63
  }
@@ -64,44 +65,41 @@ html.sap-desktop {
64
65
  }
65
66
 
66
67
  /* disabled */
67
-
68
68
  .sapMSwtDisabled {
69
- opacity: @sapUiContentDisabledOpacity;
69
+ opacity: var(--sapContent_DisabledOpacity);
70
70
  }
71
71
 
72
- /* ------------------------------ */
73
- /* Text */
74
- /* ------------------------------ */
72
+ /* Text */
75
73
  .sapMSwtText {
76
74
  line-height: 1.5rem;
77
75
  width: 1.75rem;
76
+
78
77
  &.sapMSwtTextOn {
79
- color: @sapUiButtonHandleSelectedTextColor;
78
+ color: var(--sapButton_Handle_Selected_TextColor);
80
79
  left: 2.125rem;
81
80
  z-index: 1;
82
81
  }
82
+
83
83
  &.sapMSwtTextOff {
84
- color: @sapUiButtonHandleTextColor;
84
+ color: var(--sapButton_Handle_TextColor);
85
85
  left: 2.125rem;
86
86
  z-index: 1;
87
87
  }
88
+
88
89
  .sapMSwtLabel {
89
90
  height: 1.5rem;
90
91
  line-height: 1.375rem;
91
92
  padding: 0;
92
- font-family: "72-Condensed-Bold" , "72" , "72full" , Arial, Helvetica, sans-serif;
93
+ font-family: '72-Condensed-Bold', '72', '72full', Arial, Helvetica, sans-serif;
93
94
  }
94
95
  }
95
96
 
96
- /* ------------------------------ */
97
- /* Switch handler */
98
- /* ------------------------------ */
99
-
97
+ /* Switch handler */
100
98
  .sapMSwt .sapMSwtHandle {
101
99
  height: 1.25rem;
102
100
  width: 1.75rem;
103
101
  border-radius: 1rem;
104
- border: @sapUiButtonBorderWidth solid;
102
+ border: var(--sapButton_BorderWidth) solid;
105
103
  left: 2.0625rem;
106
104
  }
107
105
 
@@ -120,134 +118,140 @@ html.sap-desktop {
120
118
  width: 1.5rem;
121
119
  }
122
120
 
123
- //on
121
+ /* on */
124
122
  .sapMSwt.sapMSwtOn:not(.sapMSwtAcceptReject) {
125
- background: @sapUiButtonTrackSelectedBackground;
126
- border: 0.0625rem solid @sapUiButtonTrackSelectedBorderColor;
123
+ background: var(--sapButton_Track_Selected_Background);
124
+ border: 0.0625rem solid var(--sapButton_Track_Selected_BorderColor);
127
125
  box-sizing: border-box;
126
+
128
127
  .sapMSwtHandle {
129
- background: @sapUiButtonHandleSelectedBackground;
130
- border: 0.125rem solid @sapUiButtonHandleSelectedBorderColor;
128
+ background: var(--sapButton_Handle_Selected_Background);
129
+ border: 0.125rem solid var(--sapButton_Handle_Selected_BorderColor);
131
130
  }
131
+
132
132
  &.sapMSwtHoverable:not(.sapMSwtAcceptReject):hover {
133
- background: @sapUiButtonTrackSelectedHoverBackground;
134
- border: 0.0625rem solid @sapUiButtonTrackSelectedHoverBorderColor;
133
+ background: var(--sapButton_Track_Selected_Hover_Background);
134
+ border: 0.0625rem solid var(--sapButton_Track_Selected_Hover_BorderColor);
135
+
135
136
  .sapMSwtHandle {
136
- background: @sapUiButtonHandleSelectedHoverBackground;
137
- box-shadow: 0 0 0 0.125rem @sapUiButtonHandleSelectedHoverBorderColor;
137
+ background: var(--sapButton_Handle_Selected_Hover_Background);
138
+ box-shadow: 0 0 0 0.125rem var(--sapButton_Handle_Selected_Hover_BorderColor);
138
139
  }
139
140
  }
140
141
  }
141
142
 
142
- //off
143
+ /* off */
143
144
  .sapMSwt.sapMSwtOff:not(.sapMSwtAcceptReject) {
144
- background: @sapUiButtonTrackBackground;
145
- border: 0.0625rem solid @sapUiButtonTrackBorderColor;
145
+ background: var(--sapButton_Track_Background);
146
+ border: 0.0625rem solid var(--sapButton_Track_BorderColor);
146
147
  box-sizing: border-box;
148
+
147
149
  .sapMSwtHandle {
148
- background: @sapUiButtonHandleBackground;
149
- border: 0.125rem solid @sapUiButtonHandleBorderColor;
150
+ background: var(--sapButton_Handle_Background);
151
+ border: 0.125rem solid var(--sapButton_Handle_BorderColor);
150
152
  }
153
+
151
154
  &.sapMSwtHoverable:not(.sapMSwtAcceptReject):hover {
152
- background: @sapUiButtonTrackHoverBackground;
153
- border: 0.0625rem solid @sapUiButtonTrackHoverBorderColor;
155
+ background: var(--sapButton_Track_Hover_Background);
156
+ border: 0.0625rem solid var(--sapButton_Track_Hover_BorderColor);
157
+
154
158
  .sapMSwtHandle {
155
- background: @sapUiButtonHandleHoverBackground;
156
- box-shadow: 0 0 0 0.125rem @sapUiButtonHandleHoverBorderColor;
159
+ background: var(--sapButton_Handle_Hover_Background);
160
+ box-shadow: 0 0 0 0.125rem var(--sapButton_Handle_Hover_BorderColor);
157
161
  }
158
162
  }
159
163
  }
160
164
 
161
- /* ====================================================== */
162
- /* Switch type "AcceptReject" */
163
- /* ====================================================== */
164
-
165
- /* ------------------------------ */
166
- /* Switch */
167
- /* ------------------------------ */
165
+ /* Switch type "AcceptReject" */
168
166
 
167
+ /* Switch */
169
168
  .sapMSwtAcceptReject.sapMSwt {
170
- //on
169
+
170
+ /* on */
171
171
  &.sapMSwtOn {
172
- background: @sapUiButtonTrackPositiveBackground;
173
- border: 0.0625rem solid @sapUiButtonTrackPositiveBorderColor;
172
+ background: var(--sapButton_Track_Positive_Background);
173
+ border: 0.0625rem solid var(--sapButton_Track_Positive_BorderColor);
174
174
  box-sizing: border-box;
175
+
175
176
  .sapMSwtHandle {
176
- background: @sapUiButtonHandlePositiveBackground;
177
- border: 2px solid @sapUiButtonHandlePositiveBorderColor;
177
+ background: var(--sapButton_Handle_Positive_Background);
178
+ border: 2px solid var(--sapButton_Handle_Positive_BorderColor);
178
179
  }
180
+
179
181
  &.sapMSwtHoverable:hover {
180
- background: @sapUiButtonTrackPositiveHoverBackground;
181
- border: 0.0625rem solid @sapUiButtonTrackPositiveHoverBorderColor;
182
+ background: var(--sapButton_Track_Positive_Hover_Background);
183
+ border: 0.0625rem solid var(--sapButton_Track_Positive_Hover_BorderColor);
184
+
182
185
  .sapMSwtHandle {
183
- background: @sapUiButtonHandlePositiveHoverBackground;
184
- box-shadow: 0 0 0 0.125rem @sapUiButtonHandlePositiveHoverBorderColor;
186
+ background: var(--sapButton_Handle_Positive_Hover_Background);
187
+ box-shadow: 0 0 0 0.125rem var(--sapButton_Handle_Positive_Hover_BorderColor);
185
188
  }
186
189
  }
187
190
  }
188
- //off
191
+
192
+ /* off */
189
193
  &.sapMSwtOff {
190
- background: @sapUiButtonTrackNegativeBackground;
191
- border: 0.0625rem solid @sapUiButtonTrackNegativeBorderColor;
194
+ background: var(--sapButton_Track_Negative_Background);
195
+ border: 0.0625rem solid var(--sapButton_Track_Negative_BorderColor);
192
196
  box-sizing: border-box;
197
+
193
198
  .sapMSwtHandle {
194
- background: @sapUiButtonHandleNegativeBackground;
195
- border: 2px solid @sapUiButtonHandleNegativeBorderColor;
199
+ background: var(--sapButton_Handle_Negative_Background);
200
+ border: 2px solid var(--sapButton_Handle_Negative_BorderColor);
196
201
  }
202
+
197
203
  &.sapMSwtHoverable:hover {
198
- background: @sapUiButtonTrackNegativeHoverBackground;
199
- border: 0.0625rem solid @sapUiButtonTrackNegativeHoverBorderColor;
204
+ background: var(--sapButton_Track_Negative_Hover_Background);
205
+ border: 0.0625rem solid var(--sapButton_Track_Negative_Hover_BorderColor);
206
+
200
207
  .sapMSwtHandle {
201
- background: @sapUiButtonHandleNegativeHoverBackground;
202
- box-shadow: 0 0 0 0.125rem @sapUiButtonHandleNegativeHoverBorderColor;
208
+ background: var(--sapButton_Handle_Negative_Hover_Background);
209
+ box-shadow: 0 0 0 0.125rem var(--sapButton_Handle_Negative_Hover_BorderColor);
203
210
  }
204
211
  }
205
212
  }
206
213
  }
207
214
 
208
- /* ------------------------------ */
209
- /* Switch handler */
210
- /* ------------------------------ */
211
-
215
+ /* Switch handler */
212
216
  .sapMSwtAcceptReject .sapMSwtWebKit537-35.sapMSwtHandle {
213
217
  border: none;
214
218
  }
215
219
 
216
220
  .sapMSwt.sapMSwtAcceptReject.sapMSwtOn .sapMSwtLabel {
217
- color: @sapPositiveTextColor;
221
+ color: var(--sapPositiveTextColor);
218
222
  }
219
223
 
220
224
  .sapMSwt.sapMSwtAcceptReject.sapMSwtOff .sapMSwtLabel {
221
- color: @sapNegativeTextColor;
225
+ color: var(--sapNegativeTextColor);
222
226
  }
223
227
 
224
228
  .sapMSwtOn.sapMSwtNoLabel .sapMSwtLabelOn::before {
225
- font-family: @sapUiContentIconFontFamily;
226
- content: "\e05b";
229
+ font-family: var(--sapContent_IconFontFamily);
230
+ content: '\e05b';
227
231
  position: absolute;
228
232
  right: 0.375rem;
229
233
  overflow: hidden;
230
234
  vertical-align: middle;
231
- font-size: @sapMFontLargeSize;
232
- color: @sapUiButtonHandleSelectedTextColor;
235
+ font-size: var(--sapFontLargeSize);
236
+ color: var(--sapButton_Handle_Selected_TextColor);
233
237
  }
234
238
 
235
239
  .sapMSwtOff.sapMSwtNoLabel .sapMSwtLabelOff::before {
236
- font-family: @sapUiContentIconFontFamily;
237
- content: "\e069";
240
+ font-family: var(--sapContent_IconFontFamily);
241
+ content: '\e069';
238
242
  position: absolute;
239
243
  right: 0.5rem;
240
244
  overflow: hidden;
241
245
  vertical-align: middle;
242
- font-size: @sapMFontLargeSize;
243
- color: @sapUiButtonHandleTextColor;
246
+ font-size: var(--sapFontLargeSize);
247
+ color: var(--sapButton_Handle_TextColor);
244
248
  }
245
249
 
246
250
  .sapMSwtOn.sapMSwtAcceptReject .sapMSwtLabelOn::before,
247
251
  .sapMSwtOff.sapMSwtAcceptReject .sapMSwtLabelOff::before {
248
252
  position: absolute;
249
253
  right: 0.375rem;
250
- font-size: @sapMFontLargeSize;
254
+ font-size: var(--sapFontLargeSize);
251
255
  }
252
256
 
253
257
  .sapMSwtOff.sapMSwtAcceptReject .sapMSwtLabelOff::before {
@@ -266,62 +270,75 @@ html.sap-desktop {
266
270
  display: none;
267
271
  }
268
272
 
269
- /* ------------------------------ */
270
- /* Compact mode */
271
- /* ------------------------------ */
272
-
273
+ /* Compact mode */
273
274
  .sapUiSizeCompact {
275
+
274
276
  .sapMSwtCont {
275
- //in order to have a touchable area of 2rem height and 3rem width
277
+ /* in order to have a touchable area of 2rem height and 3rem width */
276
278
  padding-top: 0.375rem;
277
279
  padding-bottom: 0.375rem;
280
+
278
281
  .sapMSwt {
279
282
  width: 2.75rem;
280
283
  height: 1.25rem;
284
+
281
285
  .sapMSwtHandle {
282
286
  height: 1rem;
283
287
  width: 1.75rem;
284
288
  }
289
+
285
290
  .sapMSwtText {
286
291
  line-height: 1.25rem;
292
+
287
293
  &.sapMSwtTextOn {
288
294
  left: 2.0625rem;
289
295
  }
296
+
290
297
  &.sapMSwtTextOff {
291
298
  left: 2.0625rem;
292
299
  }
300
+
293
301
  .sapMSwtLabel {
294
302
  width: 1.75rem;
295
303
  line-height: 1.125rem;
296
304
  }
297
305
  }
306
+
298
307
  .sapMSwtOn .sapMSwtHandle {
299
308
  left: 2.125rem;
300
309
  }
310
+
301
311
  &.sapMSwtNoLabel,
302
312
  &.sapMSwtAcceptReject {
303
313
  width: 2rem;
304
314
  height: 1.25rem;
315
+
305
316
  .sapMSwtHandle {
306
317
  width: 1.25rem;
307
318
  }
319
+
308
320
  &.sapMSwtOn .sapMSwtHandle{
309
321
  left: 1.88rem;
310
322
  }
323
+
311
324
  .sapMSwtText {
325
+
312
326
  &.sapMSwtTextOn {
313
327
  left: 1.325rem;
314
328
  }
329
+
315
330
  &.sapMSwtTextOff {
316
331
  left: 1.625rem;
317
332
  }
318
333
  }
334
+
319
335
  &.sapMSwtOn .sapMSwtHandle {
320
336
  left: 1.8125rem;
321
337
  }
322
338
  }
323
339
  }
324
340
  }
341
+
325
342
  .sapMSwtOn.sapMSwtNoLabel .sapMSwtLabelOn::before,
326
343
  .sapMSwtOn.sapMSwtAcceptReject .sapMSwtLabelOn::before,
327
344
  .sapMSwtOff.sapMSwtNoLabel .sapMSwtLabelOff::before,
@@ -329,6 +346,7 @@ html.sap-desktop {
329
346
  font-size: @sapMFontMediumSize;
330
347
  right: 0.3125rem;
331
348
  }
349
+
332
350
  .sapMSwtOff.sapMSwtAcceptReject .sapMSwtLabelOff::before {
333
351
  right: 0.4375rem;
334
352
  }
@@ -3,12 +3,14 @@
3
3
  /* Horizon High Contrast Black theme */
4
4
  /* =================================== */
5
5
 
6
- .sapMTabStripContainer{
7
- border-bottom: 0.0625rem solid @sapUiObjectHeaderBorderColor;
6
+ .sapMTabStripContainer {
7
+ border-bottom: 0.0625rem solid var(--sapObjectHeader_BorderColor);
8
8
  }
9
+
9
10
  .sapMTabStrip {
10
11
  padding-top: 0.5rem;
11
12
  height: 3.25rem;
13
+
12
14
  .sapMTSLeftOverflowButtons,
13
15
  .sapMTSTabsContainer,
14
16
  .sapMTSRightOverflowButtons,
@@ -18,6 +20,7 @@
18
20
  }
19
21
 
20
22
  .sapUiSizeCompact {
23
+
21
24
  .sapMTabStrip {
22
25
  height: 3.25rem;
23
26
  }