@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
@@ -36,10 +36,11 @@
36
36
  }
37
37
 
38
38
  .sapMTextArea.sapMInputBaseReadonly .sapMInputBaseReadonlyWrapper {
39
- border: @sapUiFieldBorderWidth dashed @sapUiFieldReadOnlyBorderColor;
39
+ border: var(--sapField_BorderWidth) dashed var(--sapField_ReadOnly_BorderColor);
40
40
  }
41
41
 
42
42
  .sapMFocus.sapMTextArea.sapMInputBase.sapMInputBaseReadonly .sapMInputBaseContentWrapper {
43
+
43
44
  &::before {
44
45
  top: 1px;
45
46
  left: 1px;
@@ -8,7 +8,7 @@
8
8
  }
9
9
 
10
10
  .sapMTC .sapMTCScroller:focus::before {
11
- border: 1px dotted @sapUiContentFocusColor;
11
+ border: 1px dotted var(--sapContent_FocusColor);
12
12
  position: absolute;
13
13
  top: -1px;
14
14
  bottom: -1px;
@@ -23,14 +23,14 @@
23
23
  outline: none;
24
24
 
25
25
  &::before {
26
- content: "";
26
+ content: '';
27
27
  position: absolute;
28
28
  left: -0.1875rem;
29
29
  right: -0.1875rem;
30
30
  top: -0.1875rem;
31
31
  bottom: -0.1875rem;
32
- border: 0.125rem solid @sapUiContentFocusColor;
32
+ border: 0.125rem solid var(--sapContent_FocusColor);
33
33
  border-radius: 0.125rem;
34
34
  }
35
35
  }
36
- }
36
+ }
@@ -3,16 +3,16 @@
3
3
  /* Horizon theme */
4
4
  /* ================================== */
5
5
 
6
- @_sap_m_TileContent_NewsContentBackgroundColor: fade(@sapTile_Background, 96);
6
+ @_sap_m_TileContent_NewsContentBackgroundColor: @sapTile_OverlayBackground;
7
7
  @_sap_m_TileContent_NewsFooterTextColor: @_sap_m_NewsContent_SubHeaderTextColor;
8
8
 
9
9
  .sapMTileCnt.News {
10
- background-color: @sapTile_OverlayBackground;
10
+ background-color: var(--sapTile_OverlayBackground);
11
11
  .sapMTileCntContent{
12
12
  height: 3.625rem;
13
13
  }
14
14
  }
15
15
 
16
16
  .sapMTileCnt.News .sapMTileCntFtrTxt {
17
- color: @sapTile_OverlayForegroundColor;
17
+ color: var(--sapTile_OverlayForegroundColor);
18
18
  }
@@ -6,28 +6,34 @@
6
6
  html.sap-desktop .sapMToggleBtnPressed,
7
7
  .sapMToggleBtnPressed:not(.sapMBtnDisabled) {
8
8
  box-shadow: none;
9
+
9
10
  &.sapMBtnNegative {
10
- background-color: @sapUiButtonRejectSelectedBackground;
11
- border-color: @sapUiButtonRejectSelectedBorderColor;
12
- color: @sapUiButtonRejectSelectedTextColor;
11
+ background-color: var(--sapButton_Reject_Selected_Background);
12
+ border-color: var(--sapButton_Reject_Selected_BorderColor);
13
+ color: var(--sapButton_Reject_Selected_TextColor);
14
+
13
15
  & .sapUiIcon {
14
- color: @sapUiButtonRejectSelectedTextColor;
16
+ color: var(--sapButton_Reject_Selected_TextColor);
15
17
  }
16
18
  }
19
+
17
20
  &.sapMBtnSuccess {
18
- background-color: @sapUiButtonAcceptSelectedBackground;
19
- border-color: @sapUiButtonAcceptSelectedBorderColor;
20
- color: @sapUiButtonAcceptSelectedTextColor;
21
+ background-color: var(--sapButton_Accept_Selected_Background);
22
+ border-color: var(--sapButton_Accept_Selected_BorderColor);
23
+ color: var(--sapButton_Accept_Selected_TextColor);
24
+
21
25
  & .sapUiIcon {
22
- color: @sapUiButtonAcceptSelectedTextColor;
26
+ color: var(--sapButton_Accept_Selected_TextColor);
23
27
  }
24
28
  }
29
+
25
30
  &.sapMBtnCritical {
26
- background-color: @sapUiButtonAttentionSelectedBackground;
27
- border-color: @sapUiButtonAttentionSelectedBorderColor;
28
- color: @sapUiButtonAttentionSelectedTextColor;
31
+ background-color: var(--sapButton_Attention_Selected_Background);
32
+ border-color: var(--sapButton_Attention_Selected_BorderColor);
33
+ color: var(--sapButton_Attention_Selected_TextColor);
34
+
29
35
  & .sapUiIcon {
30
- color: @sapUiButtonAttentionSelectedTextColor;
36
+ color: var(--sapButton_Attention_Selected_TextColor);
31
37
  }
32
38
  }
33
39
  }
@@ -36,40 +42,48 @@ html.sap-desktop .sapMToggleBtnPressed,
36
42
  .sapMBtn:hover > .sapMBtnHoverable.sapMToggleBtnPressed:not(.sapMBtnActive),
37
43
  .sapMBtn .sapMBtnHoverable.sapMToggleBtnPressed:hover {
38
44
  box-shadow: none;
45
+
39
46
  &.sapMBtnReject,
40
47
  &.sapMBtnNegative {
41
- background-color: @sapUiButtonRejectSelectedHoverBackground;
42
- border-color: @sapUiButtonRejectSelectedHoverBorderColor;
43
- color: @sapUiButtonRejectSelectedTextColor;
48
+ background-color: var(--sapButton_Reject_Selected_Hover_Background);
49
+ border-color: var(--sapButton_Reject_Selected_Hover_BorderColor);
50
+ color: var(--sapButton_Reject_Selected_TextColor);
51
+
44
52
  & .sapUiIcon {
45
- color: @sapUiButtonRejectSelectedTextColor;
53
+ color: var(--sapButton_Reject_Selected_TextColor);
46
54
  }
47
55
  }
56
+
48
57
  &.sapMBtnAccept,
49
58
  &.sapMBtnSuccess {
50
- background-color: @sapUiButtonAcceptSelectedHoverBackground;
51
- border-color: @sapUiButtonAcceptSelectedHoverBorderColor;
52
- color: @sapUiButtonAcceptSelectedTextColor;
59
+ background-color: var(--sapButton_Accept_Selected_Hover_Background);
60
+ border-color: var(--sapButton_Accept_Selected_Hover_BorderColor);
61
+ color: var(--sapButton_Accept_Selected_TextColor);
62
+
53
63
  & .sapUiIcon {
54
- color: @sapUiButtonAcceptSelectedTextColor;
64
+ color: var(--sapButton_Accept_Selected_TextColor);
55
65
  }
56
66
  }
67
+
57
68
  &.sapMBtnAttention,
58
69
  &.sapMBtnCritical {
59
- background-color: @sapUiButtonAttentionSelectedHoverBackground;
60
- border-color: @sapUiButtonAttentionSelectedHoverBorderColor;
61
- color: @sapUiButtonAttentionSelectedTextColor;
70
+ background-color: var(--sapButton_Attention_Selected_Hover_Background);
71
+ border-color: var(--sapButton_Attention_Selected_Hover_BorderColor);
72
+ color: var(--sapButton_Attention_Selected_TextColor);
73
+
62
74
  & .sapUiIcon {
63
- color: @sapUiButtonAttentionSelectedTextColor;
75
+ color: var(--sapButton_Attention_Selected_TextColor);
64
76
  }
65
77
  }
66
78
  }
67
79
 
68
80
  .sapMBtn {
81
+
69
82
  .sapMBtnCritical,
70
83
  .sapMBtnNegative,
71
84
  .sapMBtnSuccess,
72
85
  .sapMBtnNeutral {
86
+
73
87
  &.sapMBtnInner.sapMToggleBtnPressed {
74
88
  text-shadow: none;
75
89
  }
@@ -78,28 +92,26 @@ html.sap-desktop .sapMToggleBtnPressed,
78
92
 
79
93
  /* Focus of toggled button */
80
94
  .sapMBtn:focus > .sapMBtnInner.sapMToggleBtnPressed.sapMFocusable {
81
- outline-color: @sapUiContentFocusColor;
95
+ outline-color: var(--sapContent_FocusColor);
82
96
  }
83
97
 
84
98
  .sapMBtn .sapMBtnCritical.sapMToggleBtnPressed,
85
99
  .sapContrast span.sapMBtnInner.sapMBtnCritical.sapMToggleBtnPressed,
86
100
  .sapMBtn:hover .sapMBtnCritical.sapMToggleBtnPressed,
87
101
  .sapContrast:hover span.sapMBtnInner.sapMBtnCritical.sapMToggleBtnPressed,
88
-
89
102
  .sapMBtn .sapMBtnNegative.sapMToggleBtnPressed,
90
103
  .sapContrast span.sapMBtnInner.sapMBtnNegative.sapMToggleBtnPressed,
91
104
  .sapMBtn:hover .sapMBtnNegative.sapMToggleBtnPressed,
92
105
  .sapContrast:hover span.sapMBtnInner.sapMBtnNegative.sapMToggleBtnPressed,
93
-
94
106
  .sapMBtn .sapMBtnSuccess.sapMToggleBtnPressed,
95
107
  .sapContrast span.sapMBtnInner.sapMBtnSuccess.sapMToggleBtnPressed,
96
108
  .sapMBtn:hover .sapMBtnSuccess.sapMToggleBtnPressed,
97
109
  .sapContrast:hover span.sapMBtnInner.sapMBtnSuccess.sapMToggleBtnPressed,
98
-
99
110
  .sapMBtn .sapMBtnNeutral.sapMToggleBtnPressed,
100
111
  .sapContrast span.sapMBtnInner.sapMBtnNeutral.sapMToggleBtnPressed,
101
112
  .sapMBtn:hover .sapMBtnNeutral.sapMToggleBtnPressed,
102
113
  .sapContrast:hover span.sapMBtnInner.sapMBtnNeutral.sapMToggleBtnPressed {
114
+
103
115
  .sapMBtnContent,
104
116
  .sapMBtnIcon {
105
117
  color: inherit;
@@ -107,24 +119,24 @@ html.sap-desktop .sapMToggleBtnPressed,
107
119
  }
108
120
 
109
121
  .sapMBtn .sapMBtnEmphasized.sapMToggleBtnPressed {
110
- background-color: @sapUiButtonSelectedBackground;
111
- color: @sapUiButtonSelectedTextColor;
112
- border-color: @sapUiButtonSelectedBorderColor;
122
+ background-color: var(--sapButton_Selected_Background);
123
+ color: var(--sapButton_Selected_TextColor);
124
+ border-color: var(--sapButton_Selected_BorderColor);
113
125
  }
114
126
 
115
127
  span.sapMBtnInner.sapMToggleBtnPressed .sapMBtnIcon,
116
128
  span.sapMBtnInner.sapMToggleBtnPressed.sapMBtnTransparent > .sapMBtnIcon,
117
129
  html.sap-desktop .sapMToggleBtnPressed.sapMBtnTransparent > .sapMBtnIcon {
118
- color: @sapUiButtonSelectedTextColor;
130
+ color: var(--sapButton_Selected_TextColor);
119
131
  }
120
132
 
121
133
 
122
134
  html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMToggleBtnPressed.sapMFocusable {
123
- border-color: @sapUiContentFocusColor;
135
+ border-color: var(--sapContent_FocusColor);
124
136
  }
125
137
 
126
- html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMToggleBtnPressed.sapMFocusable:not(.sapMBadgeIndicator):after {
127
- border-color: @sapUiContentFocusColor;
138
+ html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMToggleBtnPressed.sapMFocusable:not(.sapMBadgeIndicator)::after {
139
+ border-color: var(--sapContent_FocusColor);
128
140
  left: -0.0625rem;
129
141
  top: -0.0625rem;
130
142
  right: -0.0625rem;
@@ -132,13 +144,13 @@ html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMToggleBtnPressed.sapMFo
132
144
  border-radius: 0.5rem;
133
145
  }
134
146
 
135
- html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnEmphasized.sapMFocusable:not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBadgeIndicator):before,
136
- html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnCritical.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator):before,
137
- html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnNegative.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator):before,
138
- html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnSuccess.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator):before {
139
- border: 0.125rem solid @sapUiContentFocusColor;
147
+ html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnEmphasized.sapMFocusable:not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBadgeIndicator)::before,
148
+ html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnCritical.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
149
+ html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnNegative.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
150
+ html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnSuccess.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before {
151
+ border: 0.125rem solid var(--sapContent_FocusColor);
140
152
  }
141
153
 
142
154
  .sapUiSizeCompact .sapMBar-CTX .sapMBtnDefault.sapMBtnInner.sapMToggleBtnPressed:not(.sapMBtnDisabled) {
143
- border-color: @sapUiButtonSelectedBorderColor;
155
+ border-color: var(--sapButton_Selected_BorderColor);
144
156
  }
@@ -4,35 +4,39 @@
4
4
  /* ========================================= */
5
5
 
6
6
  @_sap_m_ViewSettingsDialog_HeaderBorderColor: darken(@sapUiGroupContentBackground, 8);
7
- .sapMVSD .sapMPageHeader{
7
+
8
+ .sapMVSD .sapMPageHeader {
8
9
  z-index: 2;
10
+
9
11
  .sapMBarTitleStart .sapMBarPH {
10
12
  padding-left: 0rem;
11
13
  }
12
14
  }
13
15
 
14
16
  .sapMTB.sapMVSDFilterHeaderToolbar {
15
- background-color: @sapUiGroupContentBackground;
17
+ background-color: var(--sapGroup_ContentBackground);
16
18
  border-bottom: 1px solid @_sap_m_ViewSettingsDialog_HeaderBorderColor;
17
19
  padding-left: 0;
20
+
18
21
  .sapMBarChild.sapMCb {
22
+
19
23
  .sapMCbLabel {
20
- font-family: @sapUiFontFamily;
21
- color: @sapUiGroupTitleTextColor;
24
+ font-family: var(--sapFontFamily);
25
+ color: var(--sapGroup_TitleTextColor);
22
26
  }
23
27
  }
24
28
  }
25
29
 
26
30
  .sapMVSD.sapMDialog.sapMPopup-CTX .sapMIBar.sapMHeader-CTX,
27
31
  .sapMVSD.sapMDialog.sapMPopup-CTX .sapMIBar.sapMSubHeader-CTX {
28
- background-color: @sapUiGroupContentBackground;
32
+ background-color: var(--sapGroup_ContentBackground);
29
33
  }
30
34
 
31
35
  .sapMVSD .sapMVSDBar {
32
36
  box-shadow: @sapUiShadowHeader;
33
37
  }
34
38
 
35
- .sapMVSDBarWithSearch.sapMBar ,
39
+ .sapMVSDBarWithSearch.sapMBar,
36
40
  .sapMVSD.sapMDialog.sapMPopup-CTX .sapMIBar.sapMHeader-CTX .sapMVSDBarWithSearch,
37
41
  .sapMVSD.sapMDialog.sapMPopup-CTX .sapMIBar.sapMSubHeader-CTX .sapMVSDBarWithSearch {
38
42
  box-shadow: none;
@@ -1,11 +1,11 @@
1
- /* ======================================== */
2
- /* CSS for control sap.m/WheelSlider */
3
- /* Horizon theme */
4
- /* ======================================== */
1
+ /* ================================== */
2
+ /* CSS for control sap.m/WheelSlider */
3
+ /* Horizon theme */
4
+ /* ================================== */
5
5
 
6
6
  @_sap_m_TimePicker_ItemColor: darken(@sapUiListBackground, 3);
7
7
  @_sap_m_TimePicker_ItemHoverColor: darken(@sapUiListBackground, 6);
8
- @_sap_m_TimePicker_ItemBorderColor: @sapUiListBackground;
8
+ @_sap_m_TimePicker_ItemBorderColor: var(--sapList_Background);
9
9
 
10
10
  .sapMWS:not(:last-child),
11
11
  .sapMWS.sapMWSExpanded:not(:last-child) {
@@ -13,51 +13,65 @@
13
13
  }
14
14
 
15
15
  .sapMWS {
16
+
16
17
  .sapMWSLabel,
17
18
  .sapMWSInner {
18
19
  width: 3rem;
19
20
  height: 2.875rem;
21
+
20
22
  .sapMWSItem,
21
23
  .sapMWSSelectionFrame {
22
24
  width: 3rem;
23
25
  height: 2.875rem;
24
26
  }
27
+
25
28
  .sapMWSItem {
26
29
  border-radius: 0.25rem;
27
- background: @sapUiActive;
30
+ background: var(--sapActiveColor);
28
31
  border: 1px solid @_sap_m_TimePicker_ItemBorderColor;
32
+
29
33
  &:hover {
30
34
  background: darken(@sapUiSelected, 10);
31
35
  }
32
36
  }
33
37
  }
38
+
34
39
  &.sapMWSExpanded {
40
+
35
41
  .sapMWSInner {
42
+
36
43
  .sapMWSItem {
37
44
  background: @_sap_m_TimePicker_ItemColor;
38
45
  border: 1px solid @_sap_m_TimePicker_ItemBorderColor;
46
+
39
47
  &:hover {
40
48
  background: @_sap_m_TimePicker_ItemHoverColor;
41
49
  }
50
+
42
51
  &:active {
43
- background: @sapUiActive;
44
- color: @sapUiContentContrastTextColor;
52
+ background: var(--sapActiveColor);
53
+ color: var(--sapContent_ContrastTextColor);
45
54
  }
46
55
 
47
56
  }
57
+
48
58
  .sapMWSSelectionFrame {
49
- border: 0.125rem solid @sapUiSelected;
59
+ border: 0.125rem solid var(--sapSelectedColor);
50
60
  border-radius: 0.25rem;
51
61
  outline:none;
62
+
52
63
  &:hover {
64
+
53
65
  + ul > li.sapMWSItem.sapMWSItemSelected {
54
66
  background: @_sap_m_TimePicker_ItemHoverColor;
55
67
  }
56
68
  }
69
+
57
70
  &:active {
71
+
58
72
  & + ul > li.sapMWSItem.sapMWSItemSelected {
59
- background: @sapUiActive;
60
- color: @sapUiContentContrastTextColor;
73
+ background: var(--sapActiveColor);
74
+ color: var(--sapContent_ContrastTextColor);
61
75
  }
62
76
  }
63
77
  }
@@ -66,42 +80,52 @@
66
80
  }
67
81
 
68
82
  .sapUiSizeCompact .sapMWS {
83
+
69
84
  .sapMWSLabel,
70
85
  .sapMWSInner {
86
+ width: 3rem;
87
+ height: 2rem;
88
+
71
89
  .sapMWSItem,
72
90
  .sapMWSSelectionFrame,
73
91
  .sapMWSExpanded {
74
92
  width: 3rem;
75
93
  }
76
- width: 3rem;
77
- height: 2rem;
78
94
  }
79
95
  }
80
96
 
81
97
  .sap-phone {
98
+
82
99
  .sapMWS {
100
+
83
101
  .sapMWSLabel,
84
102
  .sapMWSInner {
85
103
  width: 3rem;
86
104
  height: 2.875rem;
105
+
87
106
  .sapMWSItem,
88
107
  .sapMWSSelectionFrame {
89
108
  width: 3rem;
90
109
  height: 2.875rem;
91
110
  }
111
+
92
112
  .sapMWSItem {
93
113
  border: 1px solid @_sap_m_TimePicker_ItemBorderColor;
94
114
  }
95
115
  }
116
+
96
117
  &.sapMWSExpanded {
118
+
97
119
  .sapMWSInner {
120
+
98
121
  .sapMWSItem {
99
122
  background: @_sap_m_TimePicker_ItemColor;
100
123
  border: 1px solid @_sap_m_TimePicker_ItemBorderColor;
101
124
  width: 3rem;
102
125
  }
126
+
103
127
  .sapMWSSelectionFrame {
104
- outline: 0.125rem solid @sapUiSelected;
128
+ outline: 0.125rem solid var(--sapSelectedColor);
105
129
  outline-offset: -0.188rem;
106
130
  }
107
131
  }
@@ -40,6 +40,7 @@
40
40
  .sapFAvatarColorTileIcon {
41
41
  background-color: var(--sapTile_Background);
42
42
  color: var(--sapTile_IconColor);
43
+ border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
43
44
 
44
45
  .sapFAvatarInitialsHolder {
45
46
  color: currentColor;
@@ -49,21 +50,33 @@
49
50
  .sapFAvatarColorPlaceholder {
50
51
  background-color: var(--sapContent_ImagePlaceholderBackground);
51
52
  color: var(--sapContent_ImagePlaceholderForegroundColor);
53
+ border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
52
54
 
53
55
  .sapFAvatarInitialsHolder {
54
56
  color: currentColor;
55
57
  }
56
58
  }
57
59
 
60
+ .sapFAvatarColorTransparent {
61
+ background-color: var(--sapAvatar_Lite_Background);
62
+ border: 0.0625rem solid var(--sapAvatar_Lite_BorderColor);
63
+ }
64
+
58
65
  .generateColor (@accentIndex) {
59
66
  @css-selector: ~"sapFAvatarColorAccent@{accentIndex}"; // Create the css selector string
60
67
  @background-param: ~"sapUiAvatar@{accentIndex}Background"; // Build the color param which is a sapUiAccent
61
68
  @color-param: ~"sapUiAvatar@{accentIndex}TextColor";
69
+ @hover-color: ~"sapUiAvatar@{accentIndex}HoverBackground";
62
70
 
63
71
  // Build the real CSS selector.
64
72
  // The output would be something like this: .sapFAvatar.sapFAvatarColorAccent6 {background-color: #0092d1;}
65
73
  .@{css-selector} {
66
74
  background-color: @@background-param;
75
+ &.sapFAvatarImage.sapFAvatarFocusable:not(.sapMAvatarPressed):not(.sapMAvatarDisabled):hover,
76
+ &.sapFAvatarFocusable:not(.sapMAvatarPressed):not(.sapMAvatarDisabled):hover {
77
+ background-color: @@hover-color;
78
+ box-shadow: @_sap_m_Avatar_Hover_Box_Shadow_Offset var(--sapAvatar_Hover_BorderColor);
79
+ }
67
80
  }
68
81
 
69
82
  .@{css-selector}.sapFAvatarIcon,
@@ -137,6 +137,7 @@
137
137
  /* Custom focus border: */
138
138
  /* ---------------------------------------------------------------------*/
139
139
 
140
+ .sapMBtn:focus-visible > .sapMBtnEmphasized.sapMBtnActive.sapMFocusable,
140
141
  html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMBtnActive.sapMFocusable {
141
142
  border-color: var(--sapContent_FocusColor);
142
143
  }
@@ -154,6 +155,7 @@ html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMBtnActive.sapMFocusable
154
155
  border-color: var(--sapButton_Success_BorderColor);
155
156
  }
156
157
 
158
+ .sapMBtn:focus-visible > .sapMFocusable:not(.sapMBadgeIndicator)::before,
157
159
  html.sap-desktop .sapMBtn:focus > .sapMFocusable:not(.sapMBadgeIndicator)::before {
158
160
  content: '';
159
161
  position: absolute;
@@ -167,6 +169,10 @@ html.sap-desktop .sapMBtn:focus > .sapMFocusable:not(.sapMBadgeIndicator)::befor
167
169
  border-radius: 0.375rem;
168
170
  }
169
171
 
172
+ .sapMBtn:focus-visible > .sapMBtnEmphasized.sapMFocusable:not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBadgeIndicator)::before,
173
+ .sapMBtn:focus-visible > .sapMBtnCritical.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
174
+ .sapMBtn:focus-visible > .sapMBtnNegative.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
175
+ .sapMBtn:focus-visible > .sapMBtnSuccess.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
170
176
  html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMFocusable:not(.sapMBtnActive):not(.sapMToggleBtnPressed):not(.sapMBadgeIndicator)::before,
171
177
  html.sap-desktop .sapMBtn:focus > .sapMBtnCritical.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
172
178
  html.sap-desktop .sapMBtn:focus > .sapMBtnNegative.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)::before,
@@ -55,7 +55,6 @@
55
55
  color: var(--sapTile_TextColor);
56
56
  }
57
57
  }
58
-
59
58
  }
60
59
  }
61
60
 
@@ -70,14 +69,13 @@
70
69
  }
71
70
  }
72
71
 
73
- .sapMGT.sapMGTScopeActions:not(.sapMGTStateLoading) {
72
+ .sapMGT.sapMGTScopeActions:not(.sapMGTStateLoading){
74
73
 
75
74
  .sapMTileCntContent {
76
75
 
77
76
  &::after {
78
77
  opacity: 0.4;
79
78
  background-color: var(--sapTile_Background);
80
-
81
79
  }
82
80
  }
83
81
  }
@@ -116,7 +114,7 @@
116
114
  }
117
115
 
118
116
  .sapMGT.sapMGTLineMode:not(.sapMGTDisabled).sapMGTLineModePress {
119
- background: fade(@sapUiShellHoverBackground, 12);
117
+ background: var(--sapTile_Active_Background);
120
118
  }
121
119
 
122
120
  .sapMGT.sapMGTLineMode .sapMGTFocusDiv {
@@ -301,51 +299,39 @@ html.sap-tablet .sapMGTWithImageHoverOverlay {
301
299
  }
302
300
 
303
301
  .sapMGT.sapMGTPressActive {
304
- box-shadow: 0 0 0 1px fade(@sapUiContentShadowColor, 30);
302
+ box-shadow: none;
305
303
 
306
304
  &:not(.sapMGTBackgroundImage) {
307
305
  background: var(--sapTile_Active_Background);
308
306
  }
309
-
310
307
  &.sapMGTScopeActions .sapMTileCntContent::after {
311
- background-color: fade(@sapUiTileActiveBackground, 70);
308
+ background-color: var(--sapTile_Active_Background);
312
309
  }
313
310
  }
314
311
 
315
- .sapMGTWithImageHoverOverlay.sapMGTPressActive {
316
- background: fade(@sapUiTileActiveBackground, 20%);
317
- }
318
-
319
- .sapMGT:hover:not(.sapMGTPressActive) {
320
- box-shadow: 0 0 0 1px fade(@sapUiContentShadowColor, 30);
321
- transition: background 0.2s;
322
-
312
+ .sapMGT:hover:not(.sapMGTPressActive) {
313
+ box-shadow: var(--sapContent_Shadow2);
323
314
  &:not(.sapMGTBackgroundImage) {
324
- background: var(--sapTile_Hover_Background);
325
- }
326
-
327
- .sapMGTWithImageHoverOverlay {
328
- background: fade(@sapUiTileHoverBackground, 10%);
329
- transition: background 0.2s;
315
+ background-color: var(--sapTile_Hover_Background);
330
316
  }
331
317
 
332
318
  &.sapMGTScopeActions .sapMTileCntContent::after {
333
- background-color: fade(@sapUiTileHoverBackground, 70);
334
- transition: background 0.2s;
319
+ background-color: var(--sapTile_Hover_Background);
335
320
  }
336
321
  }
337
322
 
338
- .sapFGridContainer .sapFGridContainerItemWrapperNoVisualFocus:focus .sapMGTFocusDiv, /* focus inside GridContainer */
339
- .sapMGT:focus .sapMGTFocusDiv,
340
- .sapMGT:active .sapMGTFocusDiv,
341
- .sapMGTLineModePress .sapMGTFocusDiv {
342
- border: var(--sapContent_FocusWidth) var(--sapContent_FocusStyle) var(--sapContent_FocusColor);
323
+ .sapMGTActionButtonPress.sapMGT:focus {
324
+
325
+ .sapMGTFocusDiv {
326
+ box-shadow: none;
327
+ }
343
328
  }
344
329
 
345
330
  .sapMGTActionButtonPress.sapMGT:active {
346
331
 
347
332
  .sapMGTFocusDiv {
348
333
  border: none;
334
+ box-shadow: none;
349
335
  }
350
336
  }
351
337
 
@@ -369,7 +355,6 @@ html.sap-tablet .sapMGTWithImageHoverOverlay {
369
355
  }
370
356
  }
371
357
 
372
-
373
358
  large.sapUiSizeCompact .sapMGT.sapMGTLineMode,
374
359
  .sapUiMedia-GenericTileDeviceSet-large .sapUiSizeCompact .sapMGT.sapMGTLineMode {
375
360
  margin-right: 1rem;
@@ -377,7 +362,6 @@ large.sapUiSizeCompact .sapMGT.sapMGTLineMode,
377
362
  }
378
363
 
379
364
  .sapMGT {
380
- border-radius: var(--sapTile_BorderCornerRadius);
381
365
  border-color: var(--sapTile_BorderColor);
382
366
  box-shadow: var(--sapContent_Shadow0);
383
367
 
@@ -388,7 +372,7 @@ large.sapUiSizeCompact .sapMGT.sapMGTLineMode,
388
372
 
389
373
  .sapMGT.tileWithAppInfo {
390
374
 
391
- .sapMGTContent {
375
+ .sapMGTContent{
392
376
  border-radius: 0;
393
377
  }
394
378
  }
@@ -478,7 +462,6 @@ large.sapUiSizeCompact .sapMGT.sapMGTLineMode,
478
462
  margin-right: 1px;
479
463
  }
480
464
 
481
- .sapFGridContainer .sapFGridContainerItemWrapperNoVisualFocus:focus .sapMGTFocusDiv,
482
465
  .sapMGT:focus .sapMGTFocusDiv,
483
466
  .sapMGT:active .sapMGTFocusDiv,
484
467
  .sapMGTLineModePress .sapMGTFocusDiv {
@@ -540,11 +523,6 @@ large.sapUiSizeCompact .sapMGT.sapMGTLineMode,
540
523
  left: 0;
541
524
  }
542
525
 
543
- .sapFGridContainer .sapFGridContainerItemWrapper:not(.sapFGridContainerItemWrapperNoVisualFocus):focus::before {
544
- border: 2px solid var(--sapContent_FocusColor);
545
- border-radius: var(--sapElement_BorderCornerRadius);
546
- }
547
-
548
526
  .miniTileBackground {
549
527
  background: var(--sapTile_Background);
550
528
  box-shadow: var(--sapContent_Shadow0) !important;
@@ -59,7 +59,7 @@
59
59
  height: 3.25rem;
60
60
 
61
61
  .sapMFT {
62
- font-size: 0.75rem;
62
+ font-size: var(--sapFontSmallSize)
63
63
  }
64
64
  }
65
65
  }
@@ -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