@openui5/themelib_sap_horizon 1.130.1 → 1.131.1

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 (136) hide show
  1. package/THIRDPARTY.txt +1 -1
  2. package/package.json +18 -18
  3. package/src/sap/f/themes/sap_horizon/Card.less +0 -4
  4. package/src/sap/f/themes/sap_horizon/DynamicPageTitle.less +0 -7
  5. package/src/sap/f/themes/sap_horizon_dark/DynamicPageTitle.less +0 -7
  6. package/src/sap/m/themes/sap_horizon/Carousel.less +0 -1
  7. package/src/sap/m/themes/sap_horizon/CheckBox.less +54 -46
  8. package/src/sap/m/themes/sap_horizon/CustomTile.less +1 -1
  9. package/src/sap/m/themes/sap_horizon/FeedInput.less +2 -2
  10. package/src/sap/m/themes/sap_horizon/GenericTag.less +37 -37
  11. package/src/sap/m/themes/sap_horizon/GenericTile.less +201 -130
  12. package/src/sap/m/themes/sap_horizon/HeaderContainer.less +3 -3
  13. package/src/sap/m/themes/sap_horizon/IconTabBar.less +1 -1
  14. package/src/sap/m/themes/sap_horizon/InputBase.less +25 -23
  15. package/src/sap/m/themes/sap_horizon/Label.less +2 -2
  16. package/src/sap/m/themes/sap_horizon/LightBox.less +2 -3
  17. package/src/sap/m/themes/sap_horizon/ListBase.less +7 -7
  18. package/src/sap/m/themes/sap_horizon/ListItemBase.less +1 -1
  19. package/src/sap/m/themes/sap_horizon/MenuButton.less +21 -14
  20. package/src/sap/m/themes/sap_horizon/MessageBox.less +8 -8
  21. package/src/sap/m/themes/sap_horizon/NotificationListGroup.less +1 -1
  22. package/src/sap/m/themes/sap_horizon/ObjectAttribute.less +3 -3
  23. package/src/sap/m/themes/sap_horizon/ObjectListItem.less +3 -3
  24. package/src/sap/m/themes/sap_horizon/ObjectMarker.less +4 -2
  25. package/src/sap/m/themes/sap_horizon/ObjectNumber.less +71 -63
  26. package/src/sap/m/themes/sap_horizon/ObjectStatus.less +141 -116
  27. package/src/sap/m/themes/sap_horizon/OverflowToolbarAssociativePopover.less +12 -9
  28. package/src/sap/m/themes/sap_horizon/ProgressIndicator.less +2 -2
  29. package/src/sap/m/themes/sap_horizon_dark/Carousel.less +0 -1
  30. package/src/sap/m/themes/sap_horizon_dark/CheckBox.less +54 -46
  31. package/src/sap/m/themes/sap_horizon_dark/CustomTile.less +1 -1
  32. package/src/sap/m/themes/sap_horizon_dark/FeedInput.less +2 -2
  33. package/src/sap/m/themes/sap_horizon_dark/GenericTag.less +36 -36
  34. package/src/sap/m/themes/sap_horizon_dark/GenericTile.less +191 -124
  35. package/src/sap/m/themes/sap_horizon_dark/HeaderContainer.less +3 -3
  36. package/src/sap/m/themes/sap_horizon_dark/IconTabBar.less +1 -1
  37. package/src/sap/m/themes/sap_horizon_dark/InputBase.less +26 -24
  38. package/src/sap/m/themes/sap_horizon_dark/Label.less +2 -2
  39. package/src/sap/m/themes/sap_horizon_dark/LightBox.less +2 -3
  40. package/src/sap/m/themes/sap_horizon_dark/ListBase.less +7 -7
  41. package/src/sap/m/themes/sap_horizon_dark/ListItemBase.less +1 -1
  42. package/src/sap/m/themes/sap_horizon_dark/MenuButton.less +16 -10
  43. package/src/sap/m/themes/sap_horizon_dark/MessageBox.less +8 -8
  44. package/src/sap/m/themes/sap_horizon_dark/NotificationListGroup.less +1 -1
  45. package/src/sap/m/themes/sap_horizon_dark/ObjectAttribute.less +3 -3
  46. package/src/sap/m/themes/sap_horizon_dark/ObjectListItem.less +3 -3
  47. package/src/sap/m/themes/sap_horizon_dark/ObjectMarker.less +3 -1
  48. package/src/sap/m/themes/sap_horizon_dark/ObjectNumber.less +71 -63
  49. package/src/sap/m/themes/sap_horizon_dark/ObjectStatus.less +142 -118
  50. package/src/sap/m/themes/sap_horizon_dark/OverflowToolbarAssociativePopover.less +12 -9
  51. package/src/sap/m/themes/sap_horizon_dark/ProgressIndicator.less +2 -2
  52. package/src/sap/m/themes/sap_horizon_dark/Table.less +0 -4
  53. package/src/sap/m/themes/sap_horizon_hcb/Carousel.less +0 -1
  54. package/src/sap/m/themes/sap_horizon_hcb/CheckBox.less +55 -47
  55. package/src/sap/m/themes/sap_horizon_hcb/CustomTile.less +1 -1
  56. package/src/sap/m/themes/sap_horizon_hcb/FeedInput.less +20 -17
  57. package/src/sap/m/themes/sap_horizon_hcb/FeedListItem.less +3 -2
  58. package/src/sap/m/themes/sap_horizon_hcb/GenericTag.less +40 -40
  59. package/src/sap/m/themes/sap_horizon_hcb/GenericTile.less +98 -55
  60. package/src/sap/m/themes/sap_horizon_hcb/HeaderContainer.less +6 -6
  61. package/src/sap/m/themes/sap_horizon_hcb/IconTabBar.less +4 -0
  62. package/src/sap/m/themes/sap_horizon_hcb/InputBase.less +23 -20
  63. package/src/sap/m/themes/sap_horizon_hcb/Label.less +1 -1
  64. package/src/sap/m/themes/sap_horizon_hcb/LightBox.less +3 -2
  65. package/src/sap/m/themes/sap_horizon_hcb/ListBase.less +12 -12
  66. package/src/sap/m/themes/sap_horizon_hcb/ListItemBase.less +3 -3
  67. package/src/sap/m/themes/sap_horizon_hcb/MenuButton.less +9 -5
  68. package/src/sap/m/themes/sap_horizon_hcb/MenuListItem.less +1 -1
  69. package/src/sap/m/themes/sap_horizon_hcb/MessageBox.less +1 -1
  70. package/src/sap/m/themes/sap_horizon_hcb/NotificationListGroup.less +1 -1
  71. package/src/sap/m/themes/sap_horizon_hcb/ObjectAttribute.less +3 -3
  72. package/src/sap/m/themes/sap_horizon_hcb/ObjectListItem.less +4 -4
  73. package/src/sap/m/themes/sap_horizon_hcb/ObjectNumber.less +8 -8
  74. package/src/sap/m/themes/sap_horizon_hcb/ObjectStatus.less +140 -129
  75. package/src/sap/m/themes/sap_horizon_hcb/OverflowToolbarAssociativePopover.less +5 -2
  76. package/src/sap/m/themes/sap_horizon_hcb/ProgressIndicator.less +2 -2
  77. package/src/sap/m/themes/sap_horizon_hcw/Carousel.less +0 -1
  78. package/src/sap/m/themes/sap_horizon_hcw/CheckBox.less +55 -47
  79. package/src/sap/m/themes/sap_horizon_hcw/CustomTile.less +1 -1
  80. package/src/sap/m/themes/sap_horizon_hcw/FeedInput.less +17 -15
  81. package/src/sap/m/themes/sap_horizon_hcw/FeedListItem.less +3 -2
  82. package/src/sap/m/themes/sap_horizon_hcw/GenericTag.less +41 -41
  83. package/src/sap/m/themes/sap_horizon_hcw/GenericTile.less +100 -57
  84. package/src/sap/m/themes/sap_horizon_hcw/HeaderContainer.less +6 -6
  85. package/src/sap/m/themes/sap_horizon_hcw/IconTabBar.less +4 -0
  86. package/src/sap/m/themes/sap_horizon_hcw/InputBase.less +22 -20
  87. package/src/sap/m/themes/sap_horizon_hcw/Label.less +1 -1
  88. package/src/sap/m/themes/sap_horizon_hcw/LightBox.less +3 -4
  89. package/src/sap/m/themes/sap_horizon_hcw/ListBase.less +12 -12
  90. package/src/sap/m/themes/sap_horizon_hcw/ListItemBase.less +3 -3
  91. package/src/sap/m/themes/sap_horizon_hcw/MenuButton.less +9 -5
  92. package/src/sap/m/themes/sap_horizon_hcw/MenuListItem.less +1 -1
  93. package/src/sap/m/themes/sap_horizon_hcw/MessageBox.less +1 -1
  94. package/src/sap/m/themes/sap_horizon_hcw/NotificationListGroup.less +1 -1
  95. package/src/sap/m/themes/sap_horizon_hcw/ObjectAttribute.less +3 -3
  96. package/src/sap/m/themes/sap_horizon_hcw/ObjectListItem.less +4 -4
  97. package/src/sap/m/themes/sap_horizon_hcw/ObjectNumber.less +9 -8
  98. package/src/sap/m/themes/sap_horizon_hcw/ObjectStatus.less +141 -131
  99. package/src/sap/m/themes/sap_horizon_hcw/OverflowToolbarAssociativePopover.less +5 -2
  100. package/src/sap/m/themes/sap_horizon_hcw/ProgressIndicator.less +2 -2
  101. package/src/sap/tnt/themes/sap_horizon/SideNavigation.less +1 -3
  102. package/src/sap/tnt/themes/sap_horizon/ToolHeader.less +0 -21
  103. package/src/sap/tnt/themes/sap_horizon/ToolPage.less +2 -11
  104. package/src/sap/tnt/themes/sap_horizon_dark/SideNavigation.less +1 -3
  105. package/src/sap/tnt/themes/sap_horizon_dark/ToolHeader.less +0 -21
  106. package/src/sap/tnt/themes/sap_horizon_dark/ToolPage.less +2 -11
  107. package/src/sap/tnt/themes/sap_horizon_hcb/SideNavigation.less +1 -3
  108. package/src/sap/tnt/themes/sap_horizon_hcb/ToolHeader.less +0 -18
  109. package/src/sap/tnt/themes/sap_horizon_hcb/ToolPage.less +0 -10
  110. package/src/sap/tnt/themes/sap_horizon_hcw/SideNavigation.less +1 -3
  111. package/src/sap/tnt/themes/sap_horizon_hcw/ToolHeader.less +0 -18
  112. package/src/sap/tnt/themes/sap_horizon_hcw/ToolPage.less +0 -10
  113. package/src/sap/ui/core/themes/sap_horizon/.theme +1 -1
  114. package/src/sap/ui/core/themes/sap_horizon/base.less +414 -18
  115. package/src/sap/ui/core/themes/sap_horizon/fonts/SAP-icons.ttf +0 -0
  116. package/src/sap/ui/core/themes/sap_horizon/fonts/SAP-icons.woff2 +0 -0
  117. package/src/sap/ui/core/themes/sap_horizon/global.less +32 -0
  118. package/src/sap/ui/core/themes/sap_horizon_dark/.theme +1 -1
  119. package/src/sap/ui/core/themes/sap_horizon_dark/base.less +412 -16
  120. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/SAP-icons.ttf +0 -0
  121. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/SAP-icons.woff2 +0 -0
  122. package/src/sap/ui/core/themes/sap_horizon_dark/global.less +32 -0
  123. package/src/sap/ui/core/themes/sap_horizon_hcb/.theme +1 -1
  124. package/src/sap/ui/core/themes/sap_horizon_hcb/base.less +421 -25
  125. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/SAP-icons.ttf +0 -0
  126. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/SAP-icons.woff2 +0 -0
  127. package/src/sap/ui/core/themes/sap_horizon_hcb/global.less +32 -0
  128. package/src/sap/ui/core/themes/sap_horizon_hcw/.theme +1 -1
  129. package/src/sap/ui/core/themes/sap_horizon_hcw/base.less +420 -24
  130. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/SAP-icons.ttf +0 -0
  131. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/SAP-icons.woff2 +0 -0
  132. package/src/sap/ui/core/themes/sap_horizon_hcw/global.less +32 -0
  133. package/src/sap/ui/unified/themes/sap_horizon/Menu.less +1 -1
  134. package/src/sap/ui/unified/themes/sap_horizon_dark/Menu.less +1 -1
  135. package/src/sap/uxap/themes/sap_horizon/ObjectPageSubSection.less +0 -5
  136. package/src/sap/uxap/themes/sap_horizon_dark/ObjectPageSubSection.less +0 -5
@@ -8,16 +8,19 @@
8
8
  }
9
9
 
10
10
  .sapMObjStatusInverted:not(.sapMObjectStatusLarge) {
11
+
11
12
  .sapMObjStatusText {
12
13
  min-height: 1rem;
13
14
  height: 100%;
14
15
  }
16
+
15
17
  .sapMObjStatusIcon {
16
18
  min-height: 1rem;
17
19
  }
18
20
  }
19
21
 
20
22
  .sapMObjectStatusLarge:not(.sapMObjStatusInverted) {
23
+
21
24
  .sapMObjStatusTitle,
22
25
  .sapMObjStatusText,
23
26
  .sapMObjStatusIcon {
@@ -25,6 +28,7 @@
25
28
  line-height: 2rem;
26
29
  min-height: 2rem;
27
30
  }
31
+
28
32
  .sapMObjStatusIcon > .sapUiIcon {
29
33
  font-size: 1.5rem;
30
34
  }
@@ -41,29 +45,34 @@
41
45
  .sapMObjStatusTitle,
42
46
  .sapMObjStatusText,
43
47
  .sapMObjStatusIcon {
44
- font-family: @sapUiFontSemiboldDuplexFamily;
48
+ font-family: var(--sapFontSemiboldDuplexFamily);
45
49
  font-size: 1.25rem;
46
50
  }
51
+
47
52
  .sapMObjStatusTitle {
48
53
  line-height: 1.625rem;
49
54
  height: 1.625rem;
50
55
  }
56
+
51
57
  .sapMObjStatusIcon,
52
58
  .sapMObjStatusText {
53
59
  padding: 0.125rem 0.25rem;
54
60
  line-height: 1.25rem;
55
61
  height: 1.25rem;
56
62
  }
63
+
57
64
  .sapMObjStatusIcon:not(.sapMObjStatusIconOnly) {
58
65
  padding-left: 0;
59
66
  padding-right: 0;
60
67
  }
68
+
61
69
  .sapMObjStatusIcon > .sapUiIcon {
62
70
  font-size: 1.25rem;
63
71
  line-height: 1.25rem;
64
72
  padding-left: 0;
65
73
  padding-right: 0;
66
74
  }
75
+
67
76
  .sapMObjStatusIconOnly {
68
77
  width: 1.75rem;
69
78
  }
@@ -75,13 +84,13 @@
75
84
  }
76
85
 
77
86
  .sapMObjStatusInverted .sapMObjStatusWrapper {
78
- border-radius: @sapUiButtonBorderCornerRadius;
87
+ border-radius: var(--sapButton_BorderCornerRadius);
79
88
  border: 0.0625rem solid;
80
89
  }
81
90
 
82
91
  .sapMObjStatusInverted .sapMObjStatusText,
83
92
  .sapMObjStatusInverted .sapMObjStatusIcon {
84
- color: @sapUiContentContrastTextColor;
93
+ color: var(--sapContent_ContrastTextColor);
85
94
  }
86
95
 
87
96
  .sapMObjStatusInverted:not(.sapMObjectStatusLarge) .sapMObjStatusIcon.sapMObjStatusIconOnly,
@@ -99,49 +108,61 @@
99
108
  }
100
109
 
101
110
  html.sap-desktop .sapMObjStatusActive:not(.sapMObjStatusInverted) {
111
+
102
112
  .sapMObjStatusText {
103
113
  text-decoration: underline;
104
114
  }
115
+
105
116
  &:focus {
117
+
106
118
  .sapMObjStatusLink::after {
107
119
  outline: none;
108
- border-radius: @sapUiButtonBorderCornerRadius;
109
- content: "";
120
+ border-radius: 0.125rem;
121
+ content: '';
110
122
  position: absolute;
111
123
  box-sizing: border-box;
112
124
  left: 0;
113
125
  top: -0.0625rem;
114
126
  right: 0;
115
- bottom: -0.0625rem;
127
+ bottom: 0.0625rem;
116
128
  pointer-events: none;
117
- border: 0.125rem solid @sapUiContentFocusColor;
129
+ border: 0.125rem solid var(--sapContent_FocusColor);
118
130
  z-index: -1;
119
131
  }
132
+
120
133
  .sapMObjStatusLink {
121
- background: @sapUiContentFocusColor;
122
- border-radius: @sapUiButtonBorderCornerRadius;
134
+ background: var(--sapContent_FocusColor);
135
+ border-radius: 0.125rem;
136
+ line-height: 0.875rem;
137
+
123
138
  .sapMObjStatusIcon > .sapUiIcon,
124
139
  .sapMObjStatusText {
125
- color: @sapUiContentContrastTextColor;
140
+ color: var(--sapContent_ContrastTextColor);
126
141
  }
142
+
127
143
  .sapMObjStatusText {
128
144
  text-decoration: underline;
129
145
  }
146
+
130
147
  .sapMObjStatusIcon > .sapUiIcon {
131
148
  text-decoration: none;
132
149
  }
133
150
  }
134
151
  }
152
+
135
153
  &:hover,
136
154
  &:active,
137
155
  &:focus:hover,
138
156
  &:focus:active {
157
+
139
158
  .sapMObjStatusIcon > .sapUiIcon,
140
159
  .sapMObjStatusText {
141
160
  text-decoration: none;
142
161
  }
143
162
  }
163
+
144
164
  &.sapMObjectStatusLarge:focus {
165
+
145
166
  .sapMObjStatusLink::after {
146
167
  top: 0;
147
168
  bottom: 0;
@@ -150,14 +171,17 @@ html.sap-desktop .sapMObjStatusActive:not(.sapMObjStatusInverted) {
150
171
  }
151
172
 
152
173
  html.sap-desktop .sapMObjStatusActive.sapMObjStatusInverted {
174
+
153
175
  .sapMObjStatusLink {
154
176
  height: auto;
155
177
  }
178
+
156
179
  &:focus,
157
180
  &.sapMObjectStatusLarge:focus {
181
+
158
182
  .sapMObjStatusLink::after {
159
183
  outline: none;
160
- content: "";
184
+ content: '';
161
185
  position: absolute;
162
186
  box-sizing: border-box;
163
187
  left: 0;
@@ -166,349 +190,350 @@ html.sap-desktop .sapMObjStatusActive.sapMObjStatusInverted {
166
190
  bottom: 0;
167
191
  pointer-events: none;
168
192
  z-index: 1;
169
- box-shadow: inset 0 0 0 0.125em @sapUiContentFocusColor, inset 0 0 0 0.1875em @sapUiContentContrastFocusColor;
170
- border-radius: @sapUiButtonBorderCornerRadius;
193
+ box-shadow: inset 0 0 0 0.125em var(--sapContent_FocusColor), inset 0 0 0 0.1875em var(--sapContent_ContrastFocusColor);
194
+ border-radius: var(--sapButton_BorderCornerRadius);
171
195
  height: 100%;
172
196
  }
173
197
  }
198
+
174
199
  &.sapMObjectStatusLarge:focus {
175
200
  min-height: 1.75rem;
176
201
  }
177
202
  }
178
203
 
179
204
  .sapMObjStatusInverted.sapMObjStatusError .sapMObjStatusWrapper {
180
- background-color: @sapUiButtonNegativeBackground;
181
- border-color: @sapUiButtonNegativeBorderColor;
205
+ background-color: var(--sapButton_Negative_Background);
206
+ border-color: var(--sapButton_Negative_BorderColor);
182
207
  }
183
208
 
184
209
  .sapMObjStatusInverted.sapMObjStatusError .sapMObjStatusText,
185
210
  .sapMObjStatusInverted.sapMObjStatusError .sapMObjStatusIcon {
186
- color: @sapUiButtonNegativeTextColor;
211
+ color: var(--sapButton_Negative_TextColor);
187
212
  }
188
213
 
189
214
  .sapMObjStatusInverted.sapMObjStatusWarning .sapMObjStatusWrapper {
190
- background-color: @sapUiButtonCriticalBackground;
191
- border-color: @sapUiButtonCriticalBorderColor;
215
+ background-color: var(--sapButton_Critical_Background);
216
+ border-color: var(--sapButton_Critical_BorderColor);
192
217
  }
193
218
 
194
219
  .sapMObjStatusInverted.sapMObjStatusWarning .sapMObjStatusText,
195
220
  .sapMObjStatusInverted.sapMObjStatusWarning .sapMObjStatusIcon {
196
- color: @sapUiButtonCriticalTextColor;
221
+ color: var(--sapButton_Critical_TextColor);
197
222
  }
198
223
 
199
224
  .sapMObjStatusInverted.sapMObjStatusSuccess .sapMObjStatusWrapper {
200
- background-color: @sapUiButtonSuccessBackground;
201
- border-color: @sapUiButtonSuccessBorderColor;
225
+ background-color: var(--sapButton_Success_Background);
226
+ border-color: var(--sapButton_Success_BorderColor);
202
227
  }
203
228
 
204
229
  .sapMObjStatusInverted.sapMObjStatusSuccess .sapMObjStatusText,
205
230
  .sapMObjStatusInverted.sapMObjStatusSuccess .sapMObjStatusIcon {
206
- color: @sapUiButtonSuccessTextColor;
231
+ color: var(--sapButton_Success_TextColor);
207
232
  }
208
233
 
209
234
  .sapMObjStatusInverted.sapMObjStatusInformation .sapMObjStatusWrapper {
210
- background-color: @sapUiButtonInformationBackground;
211
- border-color: @sapUiButtonInformationBorderColor;
235
+ background-color: var(--sapButton_Information_Background);
236
+ border-color: var(--sapButton_Information_BorderColor);
212
237
  }
213
238
 
214
239
  .sapMObjStatusInverted.sapMObjStatusInformation .sapMObjStatusText,
215
240
  .sapMObjStatusInverted.sapMObjStatusInformation .sapMObjStatusIcon {
216
- text-shadow: @sapUiContentTextShadow;
217
- color: @sapUiButtonInformationTextColor;
241
+ text-shadow: var(--sapContent_TextShadow);
242
+ color: var(--sapButton_Information_TextColor);
218
243
  }
219
244
 
220
245
  .sapMObjStatusInverted.sapMObjStatusNone .sapMObjStatusWrapper {
221
- background-color: @sapNeutralBackground;
222
- border-color: @sapNeutralBorderColor;
246
+ background-color: var(--sapNeutralBackground);
247
+ border-color: var(--sapNeutralBorderColor);
223
248
  }
224
249
 
225
250
  .sapMObjStatusInverted.sapMObjStatusNone .sapMObjStatusText,
226
251
  .sapMObjStatusInverted.sapMObjStatusNone .sapMObjStatusIcon {
227
- text-shadow: @sapUiContentTextShadow;
228
- color: @sapTextColor;
252
+ text-shadow: var(--sapContent_TextShadow);
253
+ color: var(--sapTextColor);
229
254
  }
230
255
 
231
256
  .sapMObjStatusInverted.sapMObjStatusError .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
232
- background-color: @sapUiButtonNegativeHoverBackground;
233
- border-color: @sapUiButtonNegativeHoverBorderColor;
257
+ background-color: var(--sapButton_Negative_Hover_Background);
258
+ border-color: var(--sapButton_Negative_Hover_BorderColor);
234
259
  }
235
260
 
236
261
  .sapMObjStatusInverted.sapMObjStatusError .sapMObjStatusLink:hover .sapMObjStatusText,
237
262
  .sapMObjStatusInverted.sapMObjStatusError .sapMObjStatusLink:hover .sapMObjStatusIcon {
238
- color: @sapUiButtonNegativeHoverTextColor;
263
+ color: var(--sapButton_Negative_Hover_TextColor);
239
264
  }
240
265
 
241
266
  .sapMObjStatusInverted.sapMObjStatusWarning .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
242
- background-color: @sapUiButtonCriticalHoverBackground;
243
- border-color: @sapUiButtonCriticalHoverBorderColor;
267
+ background-color: var(--sapButton_Critical_Hover_Background);
268
+ border-color: var(--sapButton_Critical_Hover_BorderColor);
244
269
  }
245
270
 
246
271
  .sapMObjStatusInverted.sapMObjStatusWarning .sapMObjStatusLink:hover .sapMObjStatusText,
247
272
  .sapMObjStatusInverted.sapMObjStatusWarning .sapMObjStatusLink:hover .sapMObjStatusIcon {
248
- color: @sapUiButtonCriticalHoverTextColor;
273
+ color: var(--sapButton_Critical_Hover_TextColor);
249
274
  }
250
275
 
251
276
  .sapMObjStatusInverted.sapMObjStatusSuccess .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
252
- background-color: @sapUiButtonSuccessHoverBackground;
253
- border-color: @sapUiButtonSuccessHoverBorderColor;
277
+ background-color: var(--sapButton_Success_Hover_Background);
278
+ border-color: var(--sapButton_Success_Hover_BorderColor);
254
279
  }
255
280
 
256
281
  .sapMObjStatusInverted.sapMObjStatusSuccess .sapMObjStatusLink:hover .sapMObjStatusText,
257
282
  .sapMObjStatusInverted.sapMObjStatusSuccess .sapMObjStatusLink:hover .sapMObjStatusIcon {
258
- color: @sapUiButtonSuccessHoverTextColor;
283
+ color: var(--sapButton_Success_Hover_TextColor);
259
284
  }
260
285
 
261
286
  .sapMObjStatusInverted.sapMObjStatusInformation .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
262
- background-color: @sapUiButtonInformationHoverBackground;
263
- border-color: @sapUiButtonInformationHoverBorderColor;
287
+ background-color: var(--sapButton_Information_Hover_Background);
288
+ border-color: var(--sapButton_Information_Hover_BorderColor);
264
289
  }
265
290
 
266
291
  .sapMObjStatusInverted.sapMObjStatusInformation .sapMObjStatusLink:hover .sapMObjStatusText,
267
292
  .sapMObjStatusInverted.sapMObjStatusInformation .sapMObjStatusLink:hover .sapMObjStatusIcon {
268
- color: @sapUiButtonInformationHoverTextColor;
293
+ color: var(--sapButton_Information_Hover_TextColor);
269
294
  }
270
295
 
271
296
  .sapMObjStatusInverted.sapMObjStatusNone .sapMObjStatusLink:hover > .sapMObjStatusWrapper {
272
- background-color: @sapUiButtonNeutralHoverBackground;
273
- border-color: @sapUiButtonNeutralHoverBorderColor;
297
+ background-color: var(--sapButton_Neutral_Hover_Background);
298
+ border-color: var(--sapButton_Neutral_Hover_BorderColor);
274
299
  }
275
300
 
276
301
  .sapMObjStatusInverted.sapMObjStatusNone .sapMObjStatusLink:hover .sapMObjStatusText,
277
302
  .sapMObjStatusInverted.sapMObjStatusNone .sapMObjStatusLink:hover .sapMObjStatusIcon {
278
- color: @sapUiButtonNeutralHoverTextColor;
303
+ color: var(--sapButton_Neutral_Hover_TextColor);
279
304
  }
280
305
 
281
306
  .sapMObjStatusInverted.sapMObjStatusError .sapMObjStatusLink:active > .sapMObjStatusWrapper {
282
- background-color: @sapUiButtonNegativeActiveBackground;
283
- border-color: @sapUiButtonNegativeActiveBorderColor;
307
+ background-color: var(--sapButton_Negative_Active_Background);
308
+ border-color: var(--sapButton_Negative_Active_BorderColor);
284
309
  }
285
310
 
286
311
  .sapMObjStatusInverted.sapMObjStatusError .sapMObjStatusLink:active .sapMObjStatusText,
287
312
  .sapMObjStatusInverted.sapMObjStatusError .sapMObjStatusLink:active .sapMObjStatusIcon {
288
- color: @sapUiButtonRejectSelectedTextColor;
313
+ color: var(--sapButton_Reject_Selected_TextColor);
289
314
  }
290
315
 
291
316
  .sapMObjStatusInverted.sapMObjStatusWarning .sapMObjStatusLink:active > .sapMObjStatusWrapper {
292
- background-color: @sapUiButtonCriticalActiveBackground;
293
- border-color: @sapUiButtonCriticalActiveBorderColor;
317
+ background-color: var(--sapButton_Critical_Active_Background);
318
+ border-color: var(--sapButton_Critical_Active_BorderColor);
294
319
  }
295
320
 
296
321
  .sapMObjStatusInverted.sapMObjStatusWarning .sapMObjStatusLink:active .sapMObjStatusText,
297
322
  .sapMObjStatusInverted.sapMObjStatusWarning .sapMObjStatusLink:active .sapMObjStatusIcon {
298
- color: @sapUiButtonAttentionSelectedTextColor;
323
+ color: var(--sapButton_Attention_Selected_TextColor);
299
324
  }
300
325
 
301
326
  .sapMObjStatusInverted.sapMObjStatusSuccess .sapMObjStatusLink:active > .sapMObjStatusWrapper {
302
- background-color: @sapUiButtonSuccessActiveBackground;
303
- border-color: @sapUiButtonSuccessActiveBorderColor;
327
+ background-color: var(--sapButton_Success_Active_Background);
328
+ border-color: var(--sapButton_Success_Active_BorderColor);
304
329
  }
305
330
 
306
331
  .sapMObjStatusInverted.sapMObjStatusSuccess .sapMObjStatusLink:active .sapMObjStatusText,
307
332
  .sapMObjStatusInverted.sapMObjStatusSuccess .sapMObjStatusLink:active .sapMObjStatusIcon {
308
- color: @sapUiButtonAcceptSelectedTextColor;
333
+ color: var(--sapButton_Accept_Selected_TextColor);
309
334
  }
310
335
 
311
336
  .sapMObjStatusInverted.sapMObjStatusInformation .sapMObjStatusLink:active > .sapMObjStatusWrapper {
312
- background-color: @sapUiButtonInformationActiveBackground;
313
- border-color: @sapUiButtonInformationActiveBorderColor;
337
+ background-color: var(--sapButton_Information_Active_Background);
338
+ border-color: var(--sapButton_Information_Active_BorderColor);
314
339
  }
315
340
 
316
341
  .sapMObjStatusInverted.sapMObjStatusInformation .sapMObjStatusLink:active .sapMObjStatusText,
317
342
  .sapMObjStatusInverted.sapMObjStatusInformation .sapMObjStatusLink:active .sapMObjStatusIcon {
318
- color: @sapUiButtonSelectedTextColor;
343
+ color: var(--sapButton_Selected_TextColor);
319
344
  }
320
345
 
321
346
  .sapMObjStatusInverted.sapMObjStatusNone .sapMObjStatusLink:active > .sapMObjStatusWrapper {
322
- background-color: @sapUiButtonNeutralActiveBackground;
323
- border-color: @sapUiButtonNeutralActiveBorderColor;
347
+ background-color: var(--sapButton_Neutral_Active_Background);
348
+ border-color: var(--sapButton_Neutral_Active_BorderColor);
324
349
  }
325
350
 
326
351
  .sapMObjStatusInverted.sapMObjStatusNone .sapMObjStatusLink:active .sapMObjStatusText,
327
352
  .sapMObjStatusInverted.sapMObjStatusNone .sapMObjStatusLink:active .sapMObjStatusIcon {
328
- color: @sapUiButtonActiveTextColor;
353
+ color: var(--sapButton_Active_TextColor);
329
354
  }
330
355
 
331
356
  .sapMObjStatusInverted.sapMObjStatusIndication01 .sapMObjStatusWrapper {
332
- background-color: @sapUiIndication1Background;
333
- border-color: @sapUiIndication1BorderColor;
357
+ background-color: var(--sapIndicationColor_1_Background);
358
+ border-color: var(--sapIndicationColor_1_BorderColor);
334
359
  }
335
360
 
336
361
  .sapMObjStatusInverted.sapMObjStatusIndication01 .sapMObjStatusText,
337
362
  .sapMObjStatusInverted.sapMObjStatusIndication01 .sapMObjStatusIcon {
338
- color: @sapUiIndication1TextColor;
363
+ color: var(--sapIndicationColor_1_TextColor);
339
364
  }
340
365
 
341
366
  .sapMObjStatusInverted.sapMObjStatusIndication02 .sapMObjStatusWrapper {
342
- background-color: @sapUiIndication2Background;
343
- border-color: @sapUiIndication2BorderColor;
367
+ background-color: var(--sapIndicationColor_2_Background);
368
+ border-color: var(--sapIndicationColor_2_BorderColor);
344
369
  }
345
370
 
346
371
  .sapMObjStatusInverted.sapMObjStatusIndication02 .sapMObjStatusText,
347
372
  .sapMObjStatusInverted.sapMObjStatusIndication02 .sapMObjStatusIcon {
348
- color: @sapUiIndication2TextColor;
373
+ color: var(--sapIndicationColor_2_TextColor);
349
374
  }
350
375
 
351
376
  .sapMObjStatusInverted.sapMObjStatusIndication03 .sapMObjStatusWrapper {
352
- background-color: @sapUiIndication3Background;
353
- border-color: @sapUiIndication3BorderColor;
377
+ background-color: var(--sapIndicationColor_3_Background);
378
+ border-color: var(--sapIndicationColor_3_BorderColor);
354
379
  }
355
380
 
356
381
  .sapMObjStatusInverted.sapMObjStatusIndication03 .sapMObjStatusText,
357
382
  .sapMObjStatusInverted.sapMObjStatusIndication03 .sapMObjStatusIcon {
358
- color: @sapUiIndication3TextColor;
383
+ color: var(--sapIndicationColor_3_TextColor);
359
384
  }
360
385
 
361
386
  .sapMObjStatusInverted.sapMObjStatusIndication04 .sapMObjStatusWrapper {
362
- background-color: @sapUiIndication4Background;
363
- border-color: @sapUiIndication4BorderColor;
387
+ background-color: var(--sapIndicationColor_4_Background);
388
+ border-color: var(--sapIndicationColor_4_BorderColor);
364
389
  }
365
390
 
366
391
  .sapMObjStatusInverted.sapMObjStatusIndication04 .sapMObjStatusText,
367
392
  .sapMObjStatusInverted.sapMObjStatusIndication04 .sapMObjStatusIcon {
368
- color: @sapUiIndication4TextColor;
393
+ color: var(--sapIndicationColor_4_TextColor);
369
394
  }
370
395
 
371
396
  .sapMObjStatusInverted.sapMObjStatusIndication05 .sapMObjStatusWrapper {
372
- background-color: @sapUiIndication5Background;
373
- border-color: @sapUiIndication5BorderColor;
397
+ background-color: var(--sapIndicationColor_5_Background);
398
+ border-color: var(--sapIndicationColor_5_BorderColor);
374
399
  }
375
400
 
376
401
  .sapMObjStatusInverted.sapMObjStatusIndication05 .sapMObjStatusText,
377
402
  .sapMObjStatusInverted.sapMObjStatusIndication05 .sapMObjStatusIcon {
378
- color: @sapUiIndication5TextColor;
403
+ color: var(--sapIndicationColor_5_TextColor);
379
404
  }
380
405
 
381
406
  .sapMObjStatusInverted.sapMObjStatusIndication06 .sapMObjStatusWrapper {
382
- background-color: @sapUiIndication6Background;
383
- border-color: @sapUiIndication6BorderColor;
407
+ background-color: var(--sapIndicationColor_6_Background);
408
+ border-color: var(--sapIndicationColor_6_BorderColor);
384
409
  }
385
410
 
386
411
  .sapMObjStatusInverted.sapMObjStatusIndication06 .sapMObjStatusText,
387
412
  .sapMObjStatusInverted.sapMObjStatusIndication06 .sapMObjStatusIcon {
388
- color: @sapUiIndication6TextColor;
413
+ color: var(--sapIndicationColor_6_TextColor);
389
414
  }
390
415
 
391
416
  .sapMObjStatusInverted.sapMObjStatusIndication07 .sapMObjStatusWrapper {
392
- background-color: @sapUiIndication7Background;
393
- border-color: @sapUiIndication7BorderColor;
417
+ background-color: var(--sapIndicationColor_7_Background);
418
+ border-color: var(--sapIndicationColor_7_BorderColor);
394
419
  }
395
420
 
396
421
  .sapMObjStatusInverted.sapMObjStatusIndication07 .sapMObjStatusText,
397
422
  .sapMObjStatusInverted.sapMObjStatusIndication07 .sapMObjStatusIcon {
398
- color: @sapUiIndication7TextColor;
423
+ color: var(--sapIndicationColor_7_TextColor);
399
424
  }
400
425
 
401
426
  .sapMObjStatusInverted.sapMObjStatusIndication08 .sapMObjStatusWrapper {
402
- background-color: @sapUiIndication8Background;
403
- border-color: @sapUiIndication8BorderColor;
427
+ background-color: var(--sapIndicationColor_8_Background);
428
+ border-color: var(--sapIndicationColor_8_BorderColor);
404
429
  }
405
430
 
406
431
  .sapMObjStatusInverted.sapMObjStatusIndication08 .sapMObjStatusText,
407
432
  .sapMObjStatusInverted.sapMObjStatusIndication08 .sapMObjStatusIcon {
408
- color: @sapUiIndication8TextColor;
433
+ color: var(--sapIndicationColor_8_TextColor);
409
434
  }
410
435
 
411
436
  .sapMObjStatusInverted.sapMObjStatusIndication01 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
412
- background-color: @sapUiIndication1ActiveBackground;
413
- border-color: @sapUiIndication1ActiveBorderColor;
437
+ background-color: var(--sapIndicationColor_1_Active_Background);
438
+ border-color: var(--sapIndicationColor_1_Active_BorderColor);
414
439
  }
415
440
 
416
441
  .sapMObjStatusInverted.sapMObjStatusIndication01 .sapMObjStatusLink:active .sapMObjStatusText,
417
442
  .sapMObjStatusInverted.sapMObjStatusIndication01 .sapMObjStatusLink:active .sapMObjStatusIcon {
418
- color: @sapUiIndication1ActiveTextColor;
443
+ color: var(--sapIndicationColor_1_Active_TextColor);
419
444
  }
420
445
 
421
446
  .sapMObjStatusInverted.sapMObjStatusIndication02 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
422
- background-color: @sapUiIndication2ActiveBackground;
423
- border-color: @sapUiIndication2ActiveBorderColor;
447
+ background-color: var(--sapIndicationColor_2_Active_Background);
448
+ border-color: var(--sapIndicationColor_2_Active_BorderColor);
424
449
  }
425
450
 
426
451
  .sapMObjStatusInverted.sapMObjStatusIndication02 .sapMObjStatusLink:active .sapMObjStatusText,
427
452
  .sapMObjStatusInverted.sapMObjStatusIndication02 .sapMObjStatusLink:active .sapMObjStatusIcon {
428
- color: @sapUiIndication2ActiveTextColor;
453
+ color: var(--sapIndicationColor_2_Active_TextColor);
429
454
  }
430
455
 
431
456
  .sapMObjStatusInverted.sapMObjStatusIndication03 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
432
- background-color: @sapUiIndication3ActiveBackground;
433
- border-color: @sapUiIndication3ActiveBorderColor;
457
+ background-color: var(--sapIndicationColor_3_Active_Background);
458
+ border-color: var(--sapIndicationColor_3_Active_BorderColor);
434
459
  }
435
460
 
436
461
  .sapMObjStatusInverted.sapMObjStatusIndication03 .sapMObjStatusLink:active .sapMObjStatusText,
437
462
  .sapMObjStatusInverted.sapMObjStatusIndication03 .sapMObjStatusLink:active .sapMObjStatusIcon {
438
- color: @sapUiIndication3ActiveTextColor;
463
+ color: var(--sapIndicationColor_3_Active_TextColor);
439
464
  }
440
465
 
441
466
  .sapMObjStatusInverted.sapMObjStatusIndication04 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
442
- background-color: @sapUiIndication4ActiveBackground;
443
- border-color: @sapUiIndication4ActiveBorderColor;
467
+ background-color: var(--sapIndicationColor_4_Active_Background);
468
+ border-color: var(--sapIndicationColor_4_Active_BorderColor);
444
469
  }
445
470
 
446
471
  .sapMObjStatusInverted.sapMObjStatusIndication04 .sapMObjStatusLink:active .sapMObjStatusText,
447
472
  .sapMObjStatusInverted.sapMObjStatusIndication04 .sapMObjStatusLink:active .sapMObjStatusIcon {
448
- color: @sapUiIndication4ActiveTextColor;
473
+ color: var(--sapIndicationColor_4_Active_TextColor);
449
474
  }
450
475
 
451
476
  .sapMObjStatusInverted.sapMObjStatusIndication05 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
452
- background-color: @sapUiIndication5ActiveBackground;
453
- border-color: @sapUiIndication5ActiveBorderColor;
477
+ background-color: var(--sapIndicationColor_5_Active_Background);
478
+ border-color: var(--sapIndicationColor_5_Active_BorderColor);
454
479
  }
455
480
 
456
481
  .sapMObjStatusInverted.sapMObjStatusIndication05 .sapMObjStatusLink:active .sapMObjStatusText,
457
482
  .sapMObjStatusInverted.sapMObjStatusIndication05 .sapMObjStatusLink:active .sapMObjStatusIcon {
458
- color: @sapUiIndication5ActiveTextColor;
483
+ color: var(--sapIndicationColor_5_Active_TextColor);
459
484
  }
460
485
 
461
486
  .sapMObjStatusInverted.sapMObjStatusIndication06 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
462
- background-color: @sapUiIndication6ActiveBackground;
463
- border-color: @sapUiIndication6ActiveBorderColor;
487
+ background-color: var(--sapIndicationColor_6_Active_Background);
488
+ border-color: var(--sapIndicationColor_6_Active_BorderColor);
464
489
  }
465
490
 
466
491
  .sapMObjStatusInverted.sapMObjStatusIndication06 .sapMObjStatusLink:active .sapMObjStatusText,
467
492
  .sapMObjStatusInverted.sapMObjStatusIndication06 .sapMObjStatusLink:active .sapMObjStatusIcon {
468
- color: @sapUiIndication6ActiveTextColor;
493
+ color: var(--sapIndicationColor_6_Active_TextColor);
469
494
  }
470
495
 
471
496
  .sapMObjStatusInverted.sapMObjStatusIndication07 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
472
- background-color: @sapUiIndication7ActiveBackground;
473
- border-color: @sapUiIndication7ActiveBorderColor;
497
+ background-color: var(--sapIndicationColor_7_Active_Background);
498
+ border-color: var(--sapIndicationColor_7_Active_BorderColor);
474
499
  }
475
500
 
476
501
  .sapMObjStatusInverted.sapMObjStatusIndication07 .sapMObjStatusLink:active .sapMObjStatusText,
477
502
  .sapMObjStatusInverted.sapMObjStatusIndication07 .sapMObjStatusLink:active .sapMObjStatusIcon {
478
- color: @sapUiIndication7ActiveTextColor;
503
+ color: var(--sapIndicationColor_7_Active_TextColor);
479
504
  }
480
505
 
481
506
  .sapMObjStatusInverted.sapMObjStatusIndication08 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
482
- background-color: @sapUiIndication8ActiveBackground;
483
- border-color: @sapUiIndication8ActiveBorderColor;
507
+ background-color: var(--sapIndicationColor_8_Active_Background);
508
+ border-color: var(--sapIndicationColor_8_Active_BorderColor);
484
509
  }
485
510
 
486
511
  .sapMObjStatusInverted.sapMObjStatusIndication08 .sapMObjStatusLink:active .sapMObjStatusText,
487
512
  .sapMObjStatusInverted.sapMObjStatusIndication08 .sapMObjStatusLink:active .sapMObjStatusIcon {
488
- color: @sapUiIndication8ActiveTextColor;
513
+ color: var(--sapIndicationColor_8_Active_TextColor);
489
514
  }
490
515
 
491
516
  .sapMObjStatusInverted.sapMObjStatusIndication09 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
492
- background-color: @sapUiIndication9ActiveBackground;
493
- border-color: @sapUiIndication9ActiveBorderColor;
517
+ background-color: var(--sapIndicationColor_9_Active_Background);
518
+ border-color: var(--sapIndicationColor_9_Active_BorderColor);
494
519
  }
495
520
 
496
521
  .sapMObjStatusInverted.sapMObjStatusIndication09 .sapMObjStatusLink:active .sapMObjStatusText,
497
522
  .sapMObjStatusInverted.sapMObjStatusIndication09 .sapMObjStatusLink:active .sapMObjStatusIcon {
498
- color: @sapUiIndication9ActiveTextColor;
523
+ color: var(--sapIndicationColor_9_Active_TextColor);
499
524
  }
500
525
 
501
526
  .sapMObjStatusInverted.sapMObjStatusIndication10 .sapMObjStatusLink:active > .sapMObjStatusWrapper {
502
- background-color: @sapUiIndication10ActiveBackground;
503
- border-color: @sapUiIndication10ActiveBorderColor;
527
+ background-color: var(--sapIndicationColor_10_Active_Background);
528
+ border-color: var(--sapIndicationColor_10_Active_BorderColor);
504
529
  }
505
530
 
506
531
  .sapMObjStatusInverted.sapMObjStatusIndication10 .sapMObjStatusLink:active .sapMObjStatusText,
507
532
  .sapMObjStatusInverted.sapMObjStatusIndication10 .sapMObjStatusLink:active .sapMObjStatusIcon {
508
- color: @sapUiIndication10ActiveTextColor;
533
+ color: var(--sapIndicationColor_10_Active_TextColor);
509
534
  }
510
535
 
511
- /* Second set of inverted indication colors regular state */
536
+ /* Second set of inverted indication colors regular state */
512
537
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusText,
513
538
  .sapMObjStatusInverted.sapMObjStatusIndication11 .sapMObjStatusIcon,
514
539
  .sapMObjStatusInverted.sapMObjStatusIndication12 .sapMObjStatusText,
@@ -529,7 +554,7 @@ html.sap-desktop .sapMObjStatusActive.sapMObjStatusInverted {
529
554
  .sapMObjStatusInverted.sapMObjStatusIndication19 .sapMObjStatusIcon,
530
555
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusText,
531
556
  .sapMObjStatusInverted.sapMObjStatusIndication20 .sapMObjStatusIcon {
532
- text-shadow: @sapUiContentTextShadow;
557
+ text-shadow: var(--sapContent_TextShadow);
533
558
  }
534
559
 
535
560
  .sapUiForm.sapUiFormEdit .sapMObjStatusInverted {
@@ -4,25 +4,28 @@
4
4
  /* ======================================================== */
5
5
 
6
6
  html.sap-phone {
7
- .sapMOTAPopover {
8
- &.sapMOTAPopoverNoShadowTop {
9
- border-radius: 0 0 0.25rem 0.25rem;
10
- }
11
- &.sapMOTAPopoverNoShadowBottom {
12
- border-radius: 0.25rem 0.25rem 0 0;
7
+
8
+ .sapMOTAPopover {
9
+
10
+ &.sapMOTAPopoverNoShadowTop {
11
+ border-radius: 0 0 0.25rem 0.25rem;
12
+ }
13
+
14
+ &.sapMOTAPopoverNoShadowBottom {
15
+ border-radius: 0.25rem 0.25rem 0 0;
16
+ }
13
17
  }
14
- }
15
18
  }
16
19
 
17
20
  .sapMOTAPopover.sapMPopover .sapMPopoverCont .sapMPopoverScroll {
18
21
  max-width: 20rem;
19
- }
22
+ }
20
23
 
21
24
  .sapUiSizeCompact .sapMTBSeparator.sapMTBSeparatorOverflowToolbar,
22
25
  .sapMTBSeparator.sapMTBSeparatorOverflowToolbar {
23
26
  margin: 0.375rem 0.1875rem;
24
27
  width: 100%;
25
- background: @sapUiToolbarSeparatorColor;
28
+ background: var(--sapToolbar_SeparatorColor);
26
29
  }
27
30
 
28
31
  .sapMOTAPopover.sapMPopover .sapMPopoverCont .sapMPopoverScroll {