@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
@@ -427,154 +427,154 @@
427
427
 
428
428
  /* Second set of inverted indication colors regular state */
429
429
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusWrapper {
430
- background-color: var(--sapIndicationColor_1_Background);
431
- border-color: var(--sapIndicationColor_1_BorderColor);
430
+ background-color: var(--sapIndicationColor_1b_Background);
431
+ border-color: var(--sapIndicationColor_1b_BorderColor);
432
432
  }
433
433
 
434
434
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusText,
435
435
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusIcon {
436
436
  text-shadow: none;
437
- color: var(--sapIndicationColor_1_TextColor);
437
+ color: var(--sapIndicationColor_1b_TextColor);
438
438
  }
439
439
 
440
440
  .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusWrapper {
441
- background-color: var(--sapIndicationColor_2_Background);
442
- border-color: var(--sapIndicationColor_2_BorderColor);
441
+ background-color: var(--sapIndicationColor_2b_Background);
442
+ border-color: var(--sapIndicationColor_2b_BorderColor);
443
443
  }
444
444
 
445
445
  .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusText,
446
446
  .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusIcon {
447
447
  text-shadow: none;
448
- color: var(--sapIndicationColor_2_TextColor);
448
+ color: var(--sapIndicationColor_2b_TextColor);
449
449
  }
450
450
 
451
451
  .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusWrapper {
452
- background-color: var(--sapIndicationColor_3_Background);
453
- border-color: var(--sapIndicationColor_3_BorderColor);
452
+ background-color: var(--sapIndicationColor_3b_Background);
453
+ border-color: var(--sapIndicationColor_3b_BorderColor);
454
454
  }
455
455
 
456
456
  .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusText,
457
457
  .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusIcon {
458
458
  text-shadow: none;
459
- color: var(--sapIndicationColor_3_TextColor);
459
+ color: var(--sapIndicationColor_3b_TextColor);
460
460
  }
461
461
 
462
462
  .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusWrapper {
463
- background-color: var(--sapIndicationColor_4_Background);
464
- border-color: var(--sapIndicationColor_4_BorderColor);
463
+ background-color: var(--sapIndicationColor_4b_Background);
464
+ border-color: var(--sapIndicationColor_4b_BorderColor);
465
465
  }
466
466
 
467
467
  .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusText,
468
468
  .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusIcon {
469
469
  text-shadow: none;
470
- color: var(--sapIndicationColor_4_TextColor);
470
+ color: var(--sapIndicationColor_4b_TextColor);
471
471
  }
472
472
 
473
473
  .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusWrapper {
474
- background-color: var(--sapIndicationColor_5_Background);
475
- border-color: var(--sapIndicationColor_5_BorderColor);
474
+ background-color: var(--sapIndicationColor_5b_Background);
475
+ border-color: var(--sapIndicationColor_5b_BorderColor);
476
476
  }
477
477
 
478
478
  .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusText,
479
479
  .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusIcon {
480
480
  text-shadow: none;
481
- color: var(--sapIndicationColor_5_TextColor);
481
+ color: var(--sapIndicationColor_5b_TextColor);
482
482
  }
483
483
 
484
484
  .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusWrapper {
485
- background-color: var(--sapIndicationColor_6_Background);
486
- border-color: var(--sapIndicationColor_6_BorderColor);
485
+ background-color: var(--sapIndicationColor_6b_Background);
486
+ border-color: var(--sapIndicationColor_6b_BorderColor);
487
487
  }
488
488
 
489
489
  .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusText,
490
490
  .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusIcon {
491
491
  text-shadow: none;
492
- color: var(--sapIndicationColor_6_TextColor);
492
+ color: var(--sapIndicationColor_6b_TextColor);
493
493
  }
494
494
 
495
495
  .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusWrapper {
496
- background-color: var(--sapIndicationColor_7_Background);
497
- border-color: var(--sapIndicationColor_7_BorderColor);
496
+ background-color: var(--sapIndicationColor_7b_Background);
497
+ border-color: var(--sapIndicationColor_7b_BorderColor);
498
498
  }
499
499
 
500
500
  .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusText,
501
501
  .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusIcon {
502
502
  text-shadow: none;
503
- color: var(--sapIndicationColor_7_TextColor);
503
+ color: var(--sapIndicationColor_7b_TextColor);
504
504
  }
505
505
 
506
506
  .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusWrapper {
507
- background-color: var(--sapIndicationColor_8_Background);
508
- border-color: var(--sapIndicationColor_8_BorderColor);
507
+ background-color: var(--sapIndicationColor_8b_Background);
508
+ border-color: var(--sapIndicationColor_8b_BorderColor);
509
509
  }
510
510
 
511
511
  .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusText,
512
512
  .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusIcon {
513
513
  text-shadow: none;
514
- color: var(--sapIndicationColor_8_TextColor);
514
+ color: var(--sapIndicationColor_8b_TextColor);
515
515
  }
516
516
 
517
517
  .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusWrapper {
518
- background-color: var(--sapIndicationColor_9_Background);
519
- border-color: var(--sapIndicationColor_9_BorderColor);
518
+ background-color: var(--sapIndicationColor_9b_Background);
519
+ border-color: var(--sapIndicationColor_9b_BorderColor);
520
520
  }
521
521
 
522
522
  .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusText,
523
523
  .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusIcon {
524
524
  text-shadow: none;
525
- color: var(--sapIndicationColor_9_TextColor);
525
+ color: var(--sapIndicationColor_9b_TextColor);
526
526
  }
527
527
 
528
528
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusWrapper {
529
- background-color: var(--sapIndicationColor_10_Background);
530
- border-color: var(--sapIndicationColor_10_BorderColor);
529
+ background-color: var(--sapIndicationColor_10b_Background);
530
+ border-color: var(--sapIndicationColor_10b_BorderColor);
531
531
  }
532
532
 
533
533
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusText,
534
534
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusIcon {
535
535
  text-shadow: none;
536
- color: var(--sapIndicationColor_10_TextColor);
536
+ color: var(--sapIndicationColor_10b_TextColor);
537
537
  }
538
538
 
539
539
  /* Second set of inverted indication colors hovered state */
540
540
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
541
- background-color: var(--sapIndicationColor_1_Hover_Background);
541
+ background-color: var(--sapIndicationColor_1b_Hover_Background);
542
542
  }
543
543
 
544
544
  .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
545
- background-color: var(--sapIndicationColor_2_Hover_Background);
545
+ background-color: var(--sapIndicationColor_2b_Hover_Background);
546
546
  }
547
547
 
548
548
  .sapMObjStatusInverted.sapMObjStatusIndication13 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
549
- background-color: var(--sapIndicationColor_3_Hover_Background);
549
+ background-color: var(--sapIndicationColor_3b_Hover_Background);
550
550
  }
551
551
 
552
552
  .sapMObjStatusInverted.sapMObjStatusIndication14 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
553
- background-color: var(--sapIndicationColor_4_Hover_Background);
553
+ background-color: var(--sapIndicationColor_4b_Hover_Background);
554
554
  }
555
555
 
556
556
  .sapMObjStatusInverted.sapMObjStatusIndication15 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
557
- background-color: var(--sapIndicationColor_5_Hover_Background);
557
+ background-color: var(--sapIndicationColor_5b_Hover_Background);
558
558
  }
559
559
 
560
560
  .sapMObjStatusInverted.sapMObjStatusIndication16 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
561
- background-color: var(--sapIndicationColor_6_Hover_Background);
561
+ background-color: var(--sapIndicationColor_6b_Hover_Background);
562
562
  }
563
563
 
564
564
  .sapMObjStatusInverted.sapMObjStatusIndication17 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
565
- background-color: var(--sapIndicationColor_7_Hover_Background);
565
+ background-color: var(--sapIndicationColor_7b_Hover_Background);
566
566
  }
567
567
 
568
568
  .sapMObjStatusInverted.sapMObjStatusIndication18 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
569
- background-color: var(--sapIndicationColor_8_Hover_Background);
569
+ background-color: var(--sapIndicationColor_8b_Hover_Background);
570
570
  }
571
571
 
572
572
  .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
573
- background-color: var(--sapIndicationColor_9_Hover_Background);
573
+ background-color: var(--sapIndicationColor_9b_Hover_Background);
574
574
  }
575
575
 
576
576
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
577
- background-color: var(--sapIndicationColor_10_Hover_Background);
577
+ background-color: var(--sapIndicationColor_10b_Hover_Background);
578
578
  }
579
579
 
580
580
  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 White 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 White 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
  }