@openui5/themelib_sap_horizon 1.100.0 → 1.101.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 (194) hide show
  1. package/THIRDPARTY.txt +5 -5
  2. package/package.json +18 -18
  3. package/src/sap/f/themes/sap_horizon/Card.less +4 -0
  4. package/src/sap/f/themes/sap_horizon/DynamicPage.less +12 -12
  5. package/src/sap/f/themes/sap_horizon/DynamicPageHeader.less +1 -30
  6. package/src/sap/f/themes/sap_horizon/DynamicPageTitle.less +5 -9
  7. package/src/sap/f/themes/sap_horizon/GridList.less +9 -0
  8. package/src/sap/f/themes/sap_horizon/GridListItem.less +5 -2
  9. package/src/sap/f/themes/sap_horizon/library.source.less +1 -0
  10. package/src/sap/f/themes/sap_horizon_dark/Card.less +4 -0
  11. package/src/sap/f/themes/sap_horizon_dark/DynamicPage.less +12 -12
  12. package/src/sap/f/themes/sap_horizon_dark/DynamicPageHeader.less +1 -30
  13. package/src/sap/f/themes/sap_horizon_dark/DynamicPageTitle.less +1 -5
  14. package/src/sap/f/themes/sap_horizon_dark/GridList.less +9 -0
  15. package/src/sap/f/themes/sap_horizon_dark/GridListItem.less +5 -2
  16. package/src/sap/f/themes/sap_horizon_dark/library.source.less +1 -0
  17. package/src/sap/f/themes/sap_horizon_hcb/Card.less +4 -0
  18. package/src/sap/f/themes/sap_horizon_hcb/DynamicPage.less +38 -2
  19. package/src/sap/f/themes/sap_horizon_hcb/DynamicPageHeader.less +10 -5
  20. package/src/sap/f/themes/sap_horizon_hcb/DynamicPageTitle.less +9 -8
  21. package/src/sap/f/themes/sap_horizon_hcb/GridList.less +6 -0
  22. package/src/sap/f/themes/sap_horizon_hcb/GridListItem.less +2 -4
  23. package/src/sap/f/themes/sap_horizon_hcb/library.source.less +1 -0
  24. package/src/sap/f/themes/sap_horizon_hcw/Card.less +4 -0
  25. package/src/sap/f/themes/sap_horizon_hcw/DynamicPage.less +38 -2
  26. package/src/sap/f/themes/sap_horizon_hcw/DynamicPageHeader.less +9 -4
  27. package/src/sap/f/themes/sap_horizon_hcw/DynamicPageTitle.less +9 -8
  28. package/src/sap/f/themes/sap_horizon_hcw/GridList.less +6 -0
  29. package/src/sap/f/themes/sap_horizon_hcw/GridListItem.less +2 -4
  30. package/src/sap/f/themes/sap_horizon_hcw/library.source.less +1 -0
  31. package/src/sap/m/themes/sap_horizon/Avatar.less +34 -105
  32. package/src/sap/m/themes/sap_horizon/Button.less +5 -10
  33. package/src/sap/m/themes/sap_horizon/CheckBox.less +140 -197
  34. package/src/sap/m/themes/sap_horizon/Dialog.less +36 -21
  35. package/src/sap/m/themes/sap_horizon/IconTabBar.less +132 -45
  36. package/src/sap/m/themes/sap_horizon/InputBase.less +59 -137
  37. package/src/sap/m/themes/sap_horizon/Link.less +17 -13
  38. package/src/sap/m/themes/sap_horizon/MessageStrip.less +7 -8
  39. package/src/sap/m/themes/sap_horizon/ObjectAttribute.less +14 -21
  40. package/src/sap/m/themes/sap_horizon/OverflowToolbarAssociativePopover.less +19 -0
  41. package/src/sap/m/themes/sap_horizon/Popover.less +22 -8
  42. package/src/sap/m/themes/sap_horizon/SegmentedButton.less +1 -1
  43. package/src/sap/m/themes/sap_horizon/Select.less +125 -53
  44. package/src/sap/m/themes/sap_horizon/SelectList.less +19 -2
  45. package/src/sap/m/themes/sap_horizon/SuggestionsPopover.less +0 -4
  46. package/src/sap/m/themes/sap_horizon/Switch.less +180 -137
  47. package/src/sap/m/themes/sap_horizon/Token.less +28 -40
  48. package/src/sap/m/themes/sap_horizon/Tokenizer.less +5 -2
  49. package/src/sap/m/themes/sap_horizon/Toolbar.less +24 -20
  50. package/src/sap/m/themes/sap_horizon/ValueStateHeader.less +15 -14
  51. package/src/sap/m/themes/sap_horizon/ValueStateMessage.less +13 -11
  52. package/src/sap/m/themes/sap_horizon_dark/Avatar.less +34 -103
  53. package/src/sap/m/themes/sap_horizon_dark/Button.less +5 -10
  54. package/src/sap/m/themes/sap_horizon_dark/CheckBox.less +140 -197
  55. package/src/sap/m/themes/sap_horizon_dark/Dialog.less +36 -22
  56. package/src/sap/m/themes/sap_horizon_dark/GenericTile.less +0 -4
  57. package/src/sap/m/themes/sap_horizon_dark/IconTabBar.less +195 -107
  58. package/src/sap/m/themes/sap_horizon_dark/InputBase.less +59 -136
  59. package/src/sap/m/themes/sap_horizon_dark/Link.less +17 -13
  60. package/src/sap/m/themes/sap_horizon_dark/MessageStrip.less +7 -9
  61. package/src/sap/m/themes/sap_horizon_dark/ObjectAttribute.less +14 -21
  62. package/src/sap/m/themes/sap_horizon_dark/OverflowToolbarAssociativePopover.less +19 -0
  63. package/src/sap/m/themes/sap_horizon_dark/Popover.less +22 -7
  64. package/src/sap/m/themes/sap_horizon_dark/SegmentedButton.less +1 -1
  65. package/src/sap/m/themes/sap_horizon_dark/Select.less +125 -53
  66. package/src/sap/m/themes/sap_horizon_dark/SelectList.less +19 -2
  67. package/src/sap/m/themes/sap_horizon_dark/SuggestionsPopover.less +0 -4
  68. package/src/sap/m/themes/sap_horizon_dark/Switch.less +180 -137
  69. package/src/sap/m/themes/sap_horizon_dark/Token.less +26 -38
  70. package/src/sap/m/themes/sap_horizon_dark/Tokenizer.less +5 -2
  71. package/src/sap/m/themes/sap_horizon_dark/Toolbar.less +24 -20
  72. package/src/sap/m/themes/sap_horizon_dark/ValueStateHeader.less +15 -14
  73. package/src/sap/m/themes/sap_horizon_dark/ValueStateMessage.less +12 -11
  74. package/src/sap/m/themes/sap_horizon_hcb/Avatar.less +35 -41
  75. package/src/sap/m/themes/sap_horizon_hcb/Carousel.less +0 -1
  76. package/src/sap/m/themes/sap_horizon_hcb/CheckBox.less +153 -125
  77. package/src/sap/m/themes/sap_horizon_hcb/Dialog.less +27 -11
  78. package/src/sap/m/themes/sap_horizon_hcb/IconTabBar.less +5 -0
  79. package/src/sap/m/themes/sap_horizon_hcb/InputBase.less +23 -37
  80. package/src/sap/m/themes/sap_horizon_hcb/Link.less +21 -11
  81. package/src/sap/m/themes/sap_horizon_hcb/MessageStrip.less +5 -10
  82. package/src/sap/m/themes/sap_horizon_hcb/ObjectAttribute.less +8 -9
  83. package/src/sap/m/themes/sap_horizon_hcb/ObjectNumber.less +1 -1
  84. package/src/sap/m/themes/sap_horizon_hcb/OverflowToolbarAssociativePopover.less +19 -0
  85. package/src/sap/m/themes/sap_horizon_hcb/Page.less +1 -1
  86. package/src/sap/m/themes/sap_horizon_hcb/Popover.less +54 -3
  87. package/src/sap/m/themes/sap_horizon_hcb/RadioButton.less +6 -7
  88. package/src/sap/m/themes/sap_horizon_hcb/Select.less +25 -23
  89. package/src/sap/m/themes/sap_horizon_hcb/SelectList.less +5 -0
  90. package/src/sap/m/themes/sap_horizon_hcb/Switch.less +232 -120
  91. package/src/sap/m/themes/sap_horizon_hcb/Table.less +0 -4
  92. package/src/sap/m/themes/sap_horizon_hcb/Token.less +3 -33
  93. package/src/sap/m/themes/sap_horizon_hcb/Tokenizer.less +3 -0
  94. package/src/sap/m/themes/sap_horizon_hcb/Toolbar.less +72 -0
  95. package/src/sap/m/themes/sap_horizon_hcb/ValueStateHeader.less +58 -0
  96. package/src/sap/m/themes/sap_horizon_hcb/ValueStateMessage.less +41 -10
  97. package/src/sap/m/themes/sap_horizon_hcb/library.source.less +0 -1
  98. package/src/sap/m/themes/sap_horizon_hcw/Avatar.less +35 -41
  99. package/src/sap/m/themes/sap_horizon_hcw/Carousel.less +0 -1
  100. package/src/sap/m/themes/sap_horizon_hcw/CheckBox.less +153 -125
  101. package/src/sap/m/themes/sap_horizon_hcw/Dialog.less +27 -11
  102. package/src/sap/m/themes/sap_horizon_hcw/IconTabBar.less +5 -0
  103. package/src/sap/m/themes/sap_horizon_hcw/InputBase.less +23 -37
  104. package/src/sap/m/themes/sap_horizon_hcw/Link.less +21 -11
  105. package/src/sap/m/themes/sap_horizon_hcw/MessageStrip.less +5 -10
  106. package/src/sap/m/themes/sap_horizon_hcw/ObjectAttribute.less +8 -9
  107. package/src/sap/m/themes/sap_horizon_hcw/OverflowToolbarAssociativePopover.less +19 -0
  108. package/src/sap/m/themes/sap_horizon_hcw/Page.less +1 -1
  109. package/src/sap/m/themes/sap_horizon_hcw/Popover.less +54 -3
  110. package/src/sap/m/themes/sap_horizon_hcw/RadioButton.less +6 -7
  111. package/src/sap/m/themes/sap_horizon_hcw/Select.less +25 -22
  112. package/src/sap/m/themes/sap_horizon_hcw/SelectList.less +5 -0
  113. package/src/sap/m/themes/sap_horizon_hcw/Switch.less +232 -120
  114. package/src/sap/m/themes/sap_horizon_hcw/Table.less +0 -4
  115. package/src/sap/m/themes/sap_horizon_hcw/Token.less +3 -32
  116. package/src/sap/m/themes/sap_horizon_hcw/Tokenizer.less +23 -20
  117. package/src/sap/m/themes/sap_horizon_hcw/Toolbar.less +72 -0
  118. package/src/sap/m/themes/sap_horizon_hcw/ValueStateHeader.less +58 -0
  119. package/src/sap/m/themes/sap_horizon_hcw/ValueStateMessage.less +41 -10
  120. package/src/sap/m/themes/sap_horizon_hcw/library.source.less +0 -1
  121. package/src/sap/ui/core/themes/sap_horizon/.theme +1 -1
  122. package/src/sap/ui/core/themes/sap_horizon/base.less +427 -41
  123. package/src/sap/ui/core/themes/sap_horizon/fonts/72-Black.woff2 +0 -0
  124. package/src/sap/ui/core/themes/sap_horizon/fonts/72-Bold-full.woff2 +0 -0
  125. package/src/sap/ui/core/themes/sap_horizon/fonts/72-Bold.woff2 +0 -0
  126. package/src/sap/ui/core/themes/sap_horizon/fonts/72-Light-full.woff2 +0 -0
  127. package/src/sap/ui/core/themes/sap_horizon/fonts/72-Light.woff2 +0 -0
  128. package/src/sap/ui/core/themes/sap_horizon/fonts/72-Regular-full.woff2 +0 -0
  129. package/src/sap/ui/core/themes/sap_horizon/fonts/72-Regular.woff2 +0 -0
  130. package/src/sap/ui/core/themes/sap_horizon/fonts/72Mono-Bold-full.woff2 +0 -0
  131. package/src/sap/ui/core/themes/sap_horizon/fonts/72Mono-Bold.woff2 +0 -0
  132. package/src/sap/ui/core/themes/sap_horizon/fonts/72Mono-Regular-full.woff2 +0 -0
  133. package/src/sap/ui/core/themes/sap_horizon/fonts/72Mono-Regular.woff2 +0 -0
  134. package/src/sap/ui/core/themes/sap_horizon/global.less +8 -6
  135. package/src/sap/ui/core/themes/sap_horizon/shared.less +0 -1
  136. package/src/sap/ui/core/themes/sap_horizon_dark/.theme +1 -1
  137. package/src/sap/ui/core/themes/sap_horizon_dark/base.less +417 -31
  138. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72-Black.woff2 +0 -0
  139. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72-Bold-full.woff2 +0 -0
  140. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72-Bold.woff2 +0 -0
  141. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72-Light-full.woff2 +0 -0
  142. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72-Light.woff2 +0 -0
  143. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72-Regular-full.woff2 +0 -0
  144. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72-Regular.woff2 +0 -0
  145. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72Mono-Bold-full.woff2 +0 -0
  146. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72Mono-Bold.woff2 +0 -0
  147. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72Mono-Regular-full.woff2 +0 -0
  148. package/src/sap/ui/core/themes/sap_horizon_dark/fonts/72Mono-Regular.woff2 +0 -0
  149. package/src/sap/ui/core/themes/sap_horizon_dark/global.less +8 -6
  150. package/src/sap/ui/core/themes/sap_horizon_dark/shared.less +0 -1
  151. package/src/sap/ui/core/themes/sap_horizon_hcb/.theme +1 -1
  152. package/src/sap/ui/core/themes/sap_horizon_hcb/base.less +399 -13
  153. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72-Black.woff2 +0 -0
  154. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72-Bold-full.woff2 +0 -0
  155. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72-Bold.woff2 +0 -0
  156. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72-Light-full.woff2 +0 -0
  157. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72-Light.woff2 +0 -0
  158. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72-Regular-full.woff2 +0 -0
  159. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72-Regular.woff2 +0 -0
  160. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72Mono-Bold-full.woff2 +0 -0
  161. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72Mono-Bold.woff2 +0 -0
  162. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72Mono-Regular-full.woff2 +0 -0
  163. package/src/sap/ui/core/themes/sap_horizon_hcb/fonts/72Mono-Regular.woff2 +0 -0
  164. package/src/sap/ui/core/themes/sap_horizon_hcb/global.less +13 -5
  165. package/src/sap/ui/core/themes/sap_horizon_hcw/.theme +1 -1
  166. package/src/sap/ui/core/themes/sap_horizon_hcw/base.less +397 -11
  167. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72-Black.woff2 +0 -0
  168. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72-Bold-full.woff2 +0 -0
  169. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72-Bold.woff2 +0 -0
  170. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72-Light-full.woff2 +0 -0
  171. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72-Light.woff2 +0 -0
  172. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72-Regular-full.woff2 +0 -0
  173. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72-Regular.woff2 +0 -0
  174. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72Mono-Bold-full.woff2 +0 -0
  175. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72Mono-Bold.woff2 +0 -0
  176. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72Mono-Regular-full.woff2 +0 -0
  177. package/src/sap/ui/core/themes/sap_horizon_hcw/fonts/72Mono-Regular.woff2 +0 -0
  178. package/src/sap/ui/core/themes/sap_horizon_hcw/global.less +13 -5
  179. package/src/sap/ui/integration/themes/sap_horizon_dark/Paginator.less +5 -0
  180. package/src/sap/ui/integration/themes/sap_horizon_dark/library.source.less +3 -1
  181. package/src/sap/ui/integration/themes/sap_horizon_hcb/Paginator.less +11 -0
  182. package/src/sap/ui/integration/themes/sap_horizon_hcb/library.source.less +2 -1
  183. package/src/sap/ui/integration/themes/sap_horizon_hcw/Paginator.less +11 -0
  184. package/src/sap/ui/integration/themes/sap_horizon_hcw/library.source.less +2 -1
  185. package/src/sap/ui/unified/themes/sap_horizon/Calendar.less +172 -61
  186. package/src/sap/ui/unified/themes/sap_horizon/FileUploader.less +7 -0
  187. package/src/sap/ui/unified/themes/sap_horizon_dark/Calendar.less +174 -63
  188. package/src/sap/ui/unified/themes/sap_horizon_dark/FileUploader.less +7 -0
  189. package/src/sap/ui/unified/themes/sap_horizon_hcb/Calendar.less +275 -93
  190. package/src/sap/ui/unified/themes/sap_horizon_hcb/FileUploader.less +7 -0
  191. package/src/sap/ui/unified/themes/sap_horizon_hcw/Calendar.less +310 -127
  192. package/src/sap/ui/unified/themes/sap_horizon_hcw/FileUploader.less +7 -0
  193. package/src/sap/m/themes/sap_horizon_hcb/SuggestionsPopover.less +0 -15
  194. package/src/sap/m/themes/sap_horizon_hcw/SuggestionsPopover.less +0 -15
@@ -4,13 +4,12 @@
4
4
  /* =================================== */
5
5
 
6
6
  .sapMMsgStrip {
7
- //@sapUiElementBorderCornerRadius was used but currently it results in 12px
8
- border-radius: @sapElement_BorderCornerRadius;
7
+ border-radius: @sapUiPopoverBorderCornerRadius;
9
8
  }
10
9
 
11
10
  .sapMMsgStripInformation {
12
11
  background-color: @sapInformationBackground;
13
- border-color: darken(@sapInformationBackground, 20);
12
+ border-color: @sapUiMessageInformationBorderColor;
14
13
  color: @sapUiBaseText;
15
14
 
16
15
  .sapMBtnTransparent,
@@ -26,7 +25,7 @@
26
25
  }
27
26
 
28
27
  .sapMMsgStripError {
29
- border-color: darken(@sapErrorBackground, 18);
28
+ border-color: @sapUiMessageErrorBorderColor;
30
29
 
31
30
  .sapMBtnTransparent,
32
31
  .sapMBtn:hover>.sapMBtnTransparent.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed),
@@ -35,9 +34,9 @@
35
34
  border-color: @sapErrorBackground;
36
35
  }
37
36
  }
38
-
37
+
39
38
  .sapMMsgStripSuccess {
40
- border-color: darken(saturate(@sapSuccessBackground, 20), 20);
39
+ border-color: @sapUiMessageSuccessBorderColor;
41
40
 
42
41
  .sapMBtnTransparent,
43
42
  .sapMBtn:hover>.sapMBtnTransparent.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed),
@@ -48,7 +47,7 @@
48
47
  }
49
48
 
50
49
  .sapMMsgStripWarning {
51
- border-color: darken(@sapWarningBackground, 20);
50
+ border-color: @sapUiMessageWarningBorderColor;
52
51
 
53
52
  .sapMBtnTransparent,
54
53
  .sapMBtn:hover>.sapMBtnTransparent.sapMBtnHoverable:not(.sapMBtnActive):not(.sapMToggleBtnPressed),
@@ -57,7 +56,7 @@
57
56
  border-color: @sapWarningBackground;
58
57
  }
59
58
  }
60
-
59
+
61
60
  .sapMMsgStripMessage>.sapMLnk {
62
61
  padding-right: 0.25rem;
63
62
  padding-left: 0.25rem;
@@ -9,27 +9,17 @@
9
9
  position: relative;
10
10
  }
11
11
 
12
- .sapMObjectAttributeActive .sapMObjectAttributeText:focus::after {
13
- pointer-events: none;
14
- display: block;
15
- content: "";
16
- position: absolute;
17
- top: 0;
18
- left: -0.0625rem;
19
- bottom: 0;
20
- right: -0.0625rem;
21
- border: 0.125rem solid @sapUiContentFocusColor;
22
- border-radius: 0.25rem;
23
- }
24
-
25
- .sapMObjectAttributeActive .sapMObjectAttributeText:focus {
12
+ .sapMObjectAttributeActive .sapMObjectAttributeText:active,
13
+ .sapMObjectAttributeActive .sapMObjectAttributeText:hover {
26
14
  text-decoration: none;
15
+ color: @sapUiLinkHoverColor;
27
16
  }
28
17
 
29
- .sapMObjectAttributeActive .sapMObjectAttributeText:active,
30
- .sapMObjectAttributeActive .sapMObjectAttributeText:hover {
31
- text-decoration: underline;
32
- color: @sapUiLinkHover;
18
+ .sapMObjectAttributeActive .sapMObjectAttributeText:focus {
19
+ border-radius: 0.125rem;
20
+ background-color: @sapUiContentFocusColor;
21
+ color: @sapUiContentContrastTextColor;
22
+ text-shadow: none;
33
23
  }
34
24
 
35
25
  /*=========================================== */
@@ -40,7 +30,6 @@
40
30
  .sapMOHR .sapMObjectAttributeActive .sapMObjectAttributeText:hover,
41
31
  .sapMOHR .sapMObjectAttributeActive .sapMObjectAttributeText:focus {
42
32
  text-decoration: underline;
43
- color: @sapUiLinkHover;
44
33
  }
45
34
 
46
35
  /*=========================================== */
@@ -48,9 +37,13 @@
48
37
  /*=========================================== */
49
38
 
50
39
  .sapMOH .sapMObjectAttributeActive .sapMObjectAttributeText:active,
51
- .sapMOH .sapMObjectAttributeActive .sapMObjectAttributeText:hover {
40
+ .sapMOH .sapMObjectAttributeActive .sapMObjectAttributeText:hover,
41
+ .sapMOH .sapMObjectAttributeActive .sapMObjectAttributeText:focus {
52
42
  text-decoration: underline;
53
- color: @sapUiLinkHover;
43
+ }
44
+
45
+ .sapMOH .sapMObjectAttributeActive .sapMObjectAttributeText:focus:hover {
46
+ text-decoration: none;
54
47
  }
55
48
 
56
49
  .sapMOHR .sapMObjectAttributeActive .sapMObjectAttributeText,
@@ -12,4 +12,23 @@ html.sap-phone {
12
12
  border-radius: 0.25rem 0.25rem 0 0;
13
13
  }
14
14
  }
15
+ }
16
+
17
+ .sapMOTAPopover.sapMPopover .sapMPopoverCont .sapMPopoverScroll {
18
+ max-width: 20rem;
19
+ }
20
+
21
+ .sapUiSizeCompact .sapMTBSeparator.sapMTBSeparatorOverflowToolbar,
22
+ .sapMTBSeparator.sapMTBSeparatorOverflowToolbar {
23
+ margin: 0.375rem 0.1875rem;
24
+ width: 100%;
25
+ background: @sapUiToolbarSeparatorColor;
26
+ }
27
+
28
+ .sapMOTAPopover.sapMPopover .sapMPopoverCont .sapMPopoverScroll {
29
+ padding: 0.25rem 0.5rem;
30
+ }
31
+
32
+ .sapUiSizeCompact .sapMOTAPopover.sapMPopover .sapMPopoverCont .sapMPopoverScroll {
33
+ padding: 0.1875rem 0.375rem;
15
34
  }
@@ -3,13 +3,27 @@
3
3
  /* Horizon theme */
4
4
  /* ============================== */
5
5
 
6
-
7
6
  .sapMPopoverArr:after {
8
7
  background: @sapUiGroupContentBackground;
9
- box-shadow: @sapUiShadowLevel2;
8
+ box-shadow: @sapUiContentShadow2;
9
+ }
10
+
11
+ .sapMPopoverWithBar > .sapMPopoverArr {
12
+ &.sapMPopoverArrUp:after,
13
+ &.sapMPopoverHeaderAlignArr:after {
14
+ background-color: @sapUiPageHeaderBackground;
15
+ }
16
+ }
17
+
18
+ .sapMPopoverWithFooter > .sapMPopoverArr.sapMPopoverFooterAlignArr:after {
19
+ background-color: @sapUiPageFooterBackground;
20
+ }
21
+
22
+ .sapMPopover .sapMIBar.sapMHeader-CTX {
23
+ background-color: @sapUiPageHeaderBackground;
10
24
  }
11
25
 
12
- .sapMPopoverWithBar > .sapMPopoverArr.sapMPopoverArrUp:after {
26
+ .sapMPopover .sapMIBar.sapMSubHeader-CTX {
13
27
  background-color: @sapUiPageHeaderBackground;
14
28
  }
15
29
 
@@ -110,17 +124,17 @@
110
124
  }
111
125
 
112
126
  .sapMPopover {
113
- border-radius: @sapUiElementBorderCornerRadius;
127
+ border-radius: @sapUiPopoverBorderCornerRadius;
114
128
 
115
129
  &.sapMPopoverWithoutBar .sapMPopoverCont,
116
130
  .sapMIBar.sapMHeader-CTX {
117
- border-top-right-radius: 0.75rem;
118
- border-top-left-radius: 0.75rem;
131
+ border-top-right-radius: @sapUiPopoverBorderCornerRadius;
132
+ border-top-left-radius: @sapUiPopoverBorderCornerRadius;
119
133
  }
120
134
 
121
135
  &.sapMPopoverWithoutFooter .sapMPopoverCont,
122
136
  .sapMIBar.sapMFooter-CTX {
123
- border-bottom-right-radius: 0.75rem;
124
- border-bottom-left-radius: 0.75rem;
137
+ border-bottom-right-radius: @sapUiPopoverBorderCornerRadius;
138
+ border-bottom-left-radius: @sapUiPopoverBorderCornerRadius;
125
139
  }
126
140
  }
@@ -76,7 +76,7 @@ html.sap-desktop {
76
76
  border: 0.125rem solid @sapUiContentFocusColor;
77
77
  border-radius: 0.375rem;
78
78
  }
79
- &.sapUiSizeCompact .sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after {
79
+ .sapUiSizeCompact .sapMSegBBtnFocusable:focus .sapMSegBBtnInner:after {
80
80
  top: 0.325rem;
81
81
  bottom: 0.325rem;
82
82
  }
@@ -13,31 +13,40 @@
13
13
 
14
14
  /* IconOnly Hover */
15
15
 
16
- .sapMSltIconOnly.sapMSltHoverable:hover:not(.sapMSltState) {
16
+ .sapMSlt.sapMSltIconOnly.sapMSltHoverable:hover:not(.sapMSltState) {
17
17
  background: @sapUiButtonLiteHoverBackground;
18
+ border: none;
18
19
 
19
20
  &.sapMSltWithIcon {
20
- border: 0.0625rem solid @sapUiButtonLiteHoverBorderColor;
21
+ box-shadow: inset 0px 0px 0px @sapUiContentFocusWidth @sapUiFieldActiveBorderColor;
21
22
  }
22
23
  }
23
24
 
24
- // Prevent jumping of icon only select when hover
25
- .sapMSltIconOnly.sapMSltHoverable:not(.sapMSltState) {
26
- border: 0.0625rem solid transparent;
27
- }
28
-
29
25
  /*IconOnly Pressed */
30
26
  .sapMSltPressed.sapMSltIconOnly:not(.sapMSltDisabled) {
31
27
  background: @sapUiToggleButtonPressedBackground;
32
- border: 0.0625rem solid @sapUiToggleButtonPressedBorderColor;
28
+ .sapMSltIcon {
29
+ color: @sapUiFieldTextColor;;
30
+ }
33
31
  }
34
32
 
35
33
  .sapMSlt:not(.sapMSltIconOnly) {
36
- border-radius: 0.25rem;
34
+ border-radius: @sapUiFieldBorderCornerRadius;
37
35
  }
38
36
 
39
37
  .sapMSlt {
38
+ font-family: @sapFontFamily;
39
+ font-size: @sapFontSize;
40
40
  height: 2.25rem;
41
+ border: none;
42
+ background-image: linear-gradient(0deg, @sapUiFieldBorderColor 0, @sapUiFieldBorderColor 100%);
43
+ background-size: 100% @sapUiFieldBorderWidth;
44
+ background-repeat: repeat-x;
45
+ background-position: bottom;
46
+ }
47
+
48
+ .sapUiSizeCompact .sapMSlt {
49
+ height: 1.625rem;
41
50
  }
42
51
 
43
52
  .sapMSlt > .sapMSltLabel {
@@ -48,8 +57,8 @@
48
57
  line-height: 2rem;
49
58
  }
50
59
 
51
- .sapMSltPressed > .sapMSltArrow::before {
52
- color: @sapUiButtonActiveTextColor;
60
+ .sapMSlt:not(.sapMSltState).sapMSltPressed > .sapMSltArrow::before {
61
+ color: @sapUiButtonSelectedTextColor;
53
62
  }
54
63
 
55
64
  .sapMSlt.sapMSltPressed,
@@ -72,9 +81,11 @@ html.sap-desktop .sapMSltIconOnly.focus:not(.sapMSltExpanded):not(.sapMSltDisabl
72
81
 
73
82
  .sapMSltHoverable:not(.sapMSltState):not(.sapMSltIconOnly):hover {
74
83
  background: @sapUiFieldHoverBackground;
84
+ border-color: @sapUiFieldHoverBorderColor;
85
+ box-shadow: @sapUiContentInteractionShadow;
75
86
 
76
87
  .sapMSltArrow {
77
- border-radius: 0.25rem;
88
+ border-radius: @sapUiFieldBorderCornerRadius;
78
89
  }
79
90
  }
80
91
 
@@ -98,7 +109,12 @@ html.sap-desktop .sapMSltIconOnly.focus:not(.sapMSltExpanded):not(.sapMSltDisabl
98
109
  /* disabled */
99
110
 
100
111
  .sapMSltDisabled {
101
- opacity: 0.5;
112
+ opacity: @sapUiContentDisabledOpacity;
113
+ }
114
+
115
+ .sapMSlt.sapMSltReadonly {
116
+ background: @sapUiFieldReadOnlyBackground;
117
+ border-bottom: dashed @sapUiElementBorderWidth @sapUiFieldReadOnlyBorderColor;
102
118
  }
103
119
 
104
120
  div.sapMSltPicker .sapMSltPickerValueState {
@@ -109,33 +125,34 @@ div.sapMSltPicker .sapMSltPickerValueState {
109
125
  line-height: 1.375rem;
110
126
  }
111
127
 
112
- .sapMSlt {
113
- border: none;
114
- background-image: linear-gradient(0deg, @sapField_BorderColor 0, @sapField_BorderColor 100%);
115
- background-size: 100% @sapField_BorderWidth;
116
- background-repeat: repeat-x;
117
- background-position: bottom;
128
+ .sapMSltMinWidth {
129
+ min-width: 2.75rem;
130
+ }
131
+
132
+ .sapUiSizeCompact .sapMSltMinWidth {
133
+ min-width: 2rem;
118
134
  }
119
135
 
120
136
  .sapMSltHoverable:not(.sapMSltState):not(.sapMSltIconOnly):hover {
121
137
  border:none;
122
- box-shadow: @sapContent_Interaction_Shadow;
138
+ box-shadow: @sapUiContentInteractionShadow;
123
139
  border: none;
124
- background-image: linear-gradient(0deg, @sapField_BorderColor 0, @sapField_BorderColor 100%);
125
- background-size: 100% @sapField_BorderWidth;
140
+ background-image: linear-gradient(0deg, @sapUiFieldBorderColor 0, @sapUiFieldBorderColor 100%);
141
+ background-size: 100% @sapUiFieldBorderWidth;
126
142
  background-repeat: repeat-x;
127
143
  background-position: bottom;
128
144
  }
129
145
 
130
146
  .sapMSltPressed:not(.sapMSltDisabled):not(.sapMSltState),
131
147
  .sapMSlt.sapMSltFocused:not(.sapMSltDisabled):not(.sapMSltState) {
132
- border:none;
133
- box-shadow: inset 0px 0px 0px 2px @sapContent_FocusColor;
148
+ background: @sapUiFieldFocusBackground;
149
+ border: none;
150
+ box-shadow: inset 0px 0px 0px @sapUiContentFocusWidth @sapUiFieldActiveBorderColor;
134
151
  }
135
152
 
136
153
  .sapMSltHoverable:not(.sapMSltState):not(.sapMSltIconOnly):active {
137
154
  border:none;
138
- box-shadow: inset 0px 0px 0px 2px @sapField_Active_BorderColor;
155
+ box-shadow: inset 0px 0px 0px 2px @sapUiFieldActiveBorderColor;
139
156
  }
140
157
 
141
158
  .sapMSltArrow {
@@ -153,9 +170,9 @@ div.sapMSltPicker .sapMSltPickerValueState {
153
170
  }
154
171
 
155
172
  .sapMSltPressed >.sapMSltArrow {
156
- background-color: @sapButton_Active_Background;
157
- color: @sapButton_Active_TextColor;
158
- box-shadow: @sapContent_Interaction_Shadow;
173
+ background-color: @sapUiButtonActiveBackground;
174
+ color: @sapUiButtonActiveTextColor;
175
+ box-shadow: @sapUiContentInteractionShadow;
159
176
  overflow: none;
160
177
  border-radius: 0.125rem;
161
178
  }
@@ -164,7 +181,7 @@ div.sapMSltPicker .sapMSltPickerValueState {
164
181
  /* focus */
165
182
  html.sap-desktop .sapMSlt.sapMSltFocused:not(.sapMSltExpanded):not(.sapMSltDisabled) {
166
183
  &:before {
167
- box-shadow: inset 0px 0px 0px 2px @sapField_Focus_BorderColor;
184
+ box-shadow: inset 0px 0px 0px 2px @sapUiFieldFocusBorderColor;
168
185
  }
169
186
  }
170
187
 
@@ -173,24 +190,38 @@ html.sap-desktop .sapMSlt.sapMSltFocused:not(.sapMSltExpanded):not(.sapMSltDisab
173
190
  // =====================================
174
191
  .sapMSltInformation {
175
192
  border: none;
176
- background-image: linear-gradient(0deg, @sapField_InformationColor 0, @sapField_InformationColor 100%);
177
- background-size: 100% @sapField_InformationBorderWidth;
193
+ background-image: linear-gradient(0deg, @sapUiFieldInformationColor 0, @sapUiFieldInformationColor 100%);
194
+ background-size: 100% @sapUiFieldInformationBorderWidth;
178
195
  background-repeat: repeat-x;
179
196
  background-position: bottom;
197
+ background-color: @sapUiFieldInformationBackground;
180
198
  }
181
199
 
182
200
  .sapMSltInformation.sapMSltHoverable:not(.sapMSltIconOnly):not(.sapMSltDisabled):not(.sapMSltPressed):hover {
183
- background-color: @sapField_Hover_Background;
201
+ border-color: @sapUiFieldInformationColor;
202
+ box-shadow: @sapUiContentInformativeShadow;
203
+ background-color: @sapUiFieldHoverBackground;
184
204
 
185
205
  &:not(.sapMSltFocused) {
186
- box-shadow: @sapContent_Informative_Shadow; // NEW Parameter
206
+ box-shadow: @sapUiContentInformativeShadow; // NEW Parameter
187
207
  }
188
208
  }
189
209
 
190
210
  .sapMSltHoverable.sapMSltInformation:not(.sapMSltIconOnly):active,
191
211
  .sapMSltFocused.sapMSltInformation {
192
- box-shadow: inset 0px 0px 0px 2px @sapField_Active_BorderColor;
193
- background-color: @sapField_Focus_Background;
212
+ border-bottom: none;
213
+ box-shadow: inset 0px 0px 0px 2px @sapUiFieldInformationColor;
214
+ background-color: @sapUiFieldFocusBackground;
215
+ }
216
+
217
+ .sapMSltInformation.sapMSltPressed {
218
+ .sapMSltArrow {
219
+ color: @sapUiButtonSelectedTextColor;
220
+ box-shadow: @sapUiContentInformativeShadow;
221
+ }
222
+ > .sapMSltArrow::before {
223
+ color: inherit;
224
+ }
194
225
  }
195
226
 
196
227
  // =====================================
@@ -199,26 +230,40 @@ html.sap-desktop .sapMSlt.sapMSltFocused:not(.sapMSltExpanded):not(.sapMSltDisab
199
230
 
200
231
  .sapMSltSuccess {
201
232
  border: none;
202
- background-image: linear-gradient(0deg, @sapField_SuccessColor 0, @sapField_SuccessColor 100%);
203
- background-size: 100% @sapField_SuccessBorderWidth;
233
+ background-image: linear-gradient(0deg, @sapUiFieldSuccessColor 0, @sapUiFieldSuccessColor 100%);
234
+ background-size: 100% @sapUiFieldSuccessBorderWidth;
204
235
  background-repeat: repeat-x;
205
236
  background-position: bottom;
237
+ background-color: @sapUiFieldSuccessBackground;
206
238
  }
207
239
 
208
240
  .sapMSltSuccess.sapMSltHoverable:not(.sapMSltIconOnly):not(.sapMSltDisabled):not(.sapMSltPressed):hover {
209
- background-color: @sapField_Hover_Background;
241
+ border-color: @sapUiFieldSuccessColor;
242
+ box-shadow: @sapUiContentPositiveShadow;
243
+ background-color: @sapUiFieldHoverBackground;
210
244
 
211
245
  &:not(.sapMSltFocused) {
212
- box-shadow: @sapContent_Positive_Shadow; // New Parameter
246
+ box-shadow: @sapUiContentPositiveShadow; // New Parameter
213
247
  }
214
248
  }
215
249
 
216
250
  // Field Success Focus - Experimental
217
251
  .sapMSltHoverable.sapMSltSuccess:not(.sapMSltIconOnly):active,
218
252
  .sapMSltFocused.sapMSltSuccess {
219
- box-shadow: inset 0px 0px 0px 2px @sapField_SuccessColor;
220
- border-radius: @sapField_BorderCornerRadius;
221
- background-color: @sapField_Focus_Background;
253
+ border-bottom: none;
254
+ box-shadow: inset 0px 0px 0px 2px @sapUiFieldSuccessColor;
255
+ border-radius: @sapUiFieldBorderCornerRadius;
256
+ background-color: @sapUiFieldFocusBackground;
257
+ }
258
+
259
+ .sapMSltSuccess.sapMSltPressed {
260
+ .sapMSltArrow {
261
+ color: @sapUiButtonAcceptSelectedTextColor;
262
+ box-shadow: @sapUiContentPositiveShadow;
263
+ }
264
+ > .sapMSltArrow::before {
265
+ color: inherit;
266
+ }
222
267
  }
223
268
 
224
269
  // =====================================
@@ -227,27 +272,40 @@ html.sap-desktop .sapMSlt.sapMSltFocused:not(.sapMSltExpanded):not(.sapMSltDisab
227
272
 
228
273
  .sapMSltWarning {
229
274
  border: none;
230
- background-image: linear-gradient(0deg, @sapField_WarningColor 0, @sapField_WarningColor 100%);
231
- background-size: 100% @sapField_WarningBorderWidth;
275
+ background-image: linear-gradient(0deg, @sapUiFieldWarningColor 0, @sapUiFieldWarningColor 100%);
276
+ background-size: 100% @sapUiFieldWarningBorderWidth;
232
277
  background-repeat: repeat-x;
233
278
  background-position: bottom;
279
+ background-color: @sapUiFieldWarningBackground;
234
280
  }
235
281
 
236
282
  .sapMSltWarning.sapMSltHoverable:not(.sapMSltIconOnly):not(.sapMSltDisabled):not(.sapMSltPressed):hover {
237
- background-color: @sapField_Hover_Background;
283
+ border-color: @sapUiFieldWarningColor;
284
+ box-shadow: @sapUiContentCriticalShadow;
285
+ background-color: @sapUiFieldHoverBackground;
238
286
 
239
287
  &:not(.sapMSltFocused) {
240
- box-shadow: @sapContent_Critical_Shadow; // NEW Parameter
288
+ box-shadow: @sapUiContentCriticalShadow; // NEW Parameter
241
289
  }
242
290
  }
243
291
 
244
292
  // Field Warning Focus - Experimental
245
293
  .sapMSltHoverable.sapMSltWarning:not(.sapMSltIconOnly):active,
246
294
  .sapMSltFocused.sapMSltWarning {
247
- box-shadow: inset 0px 0px 0px 2px @sapField_WarningColor; // Experimental
248
- background-color: @sapField_Focus_Background;
295
+ border-bottom: none;
296
+ box-shadow: inset 0px 0px 0px 2px @sapUiFieldWarningColor; // Experimental
297
+ background-color: @sapUiFieldFocusBackground;
249
298
  }
250
299
 
300
+ .sapMSltWarning.sapMSltPressed {
301
+ .sapMSltArrow {
302
+ color: @sapUiButtonAttentionSelectedTextColor;
303
+ box-shadow: @sapUiContentCriticalShadow;
304
+ }
305
+ > .sapMSltArrow::before {
306
+ color: inherit;
307
+ }
308
+ }
251
309
 
252
310
  // =====================================
253
311
  // Input Error state
@@ -255,23 +313,37 @@ html.sap-desktop .sapMSlt.sapMSltFocused:not(.sapMSltExpanded):not(.sapMSltDisab
255
313
 
256
314
  .sapMSltError {
257
315
  border: none;
258
- background-image: linear-gradient(0deg, @sapField_InvalidColor 0, @sapField_InvalidColor 100%);
316
+ background-image: linear-gradient(0deg, @sapUiFieldInvalidColor 0, @sapUiFieldInvalidColor 100%);
259
317
  background-size: 100% @sapField_InvalidBorderWidth;
260
318
  background-repeat: repeat-x;
261
319
  background-position: bottom;
320
+ background-color: @sapUiFieldInvalidBackgroundStyle;
262
321
  }
263
322
 
264
323
  .sapMSltError.sapMSltHoverable:not(.sapMSltIconOnly):not(.sapMSltDisabled):not(.sapMSltPressed):hover {
265
- background-color: @sapField_Hover_Background;
324
+ border-color: @sapUiFieldInvalidColor;
325
+ box-shadow: @sapUiContentNegativeShadow;
326
+ background-color: @sapUiFieldHoverBackground;
266
327
 
267
328
  &:not(.sapMSltFocused) {
268
- box-shadow: @sapContent_Negative_Shadow; // New Parameter
329
+ box-shadow: @sapUiContentNegativeShadow; // NEW Parameter
269
330
  }
270
331
  }
271
332
 
272
333
  // Field Error Focus - Experimental
273
334
  .sapMSltHoverable.sapMSltError:not(.sapMSltIconOnly):active,
274
335
  .sapMSltFocused.sapMSltError {
275
- box-shadow: inset 0px 0px 0px 2px @sapField_InvalidColor;
276
- background-color: @sapField_Focus_Background;
336
+ border-bottom: none;
337
+ box-shadow: inset 0px 0px 0px 2px @sapUiFieldInvalidColor;
338
+ background-color: @sapUiFieldFocusBackground;
339
+ }
340
+
341
+ .sapMSltError.sapMSltPressed {
342
+ .sapMSltArrow {
343
+ color: @sapUiFieldInvalidColor;
344
+ box-shadow: @sapUiContentNegativeShadow;
345
+ }
346
+ > .sapMSltArrow::before {
347
+ color: inherit;
348
+ }
277
349
  }
@@ -8,15 +8,28 @@
8
8
  @_sap_m_SelectListItemBelizeFocus_Height: 0.25rem; // 2 borders * 0.0625rem + 2 offsets (top and bottom) * 0.0625rem
9
9
 
10
10
  /* selected */
11
- .sapMSelectListItemBaseSelected {
11
+ .sapMSelectListItemBase.sapMSelectListItemBaseSelected {
12
12
  background: @sapUiListSelectionBackgroundColor;
13
+ color: @sapUiListTextColor;
14
+ border-color: @sapUiListSelectionBorderColor;
15
+
16
+ &:hover {
17
+ background: @sapUiListHoverSelectionBackground;
18
+ }
13
19
  }
14
20
 
21
+
15
22
  /* pressed */
16
23
  html.sap-desktop .sapMSelectListItemBase.sapMSelectListItemBasePressed:focus {
17
24
  outline: 0.0625rem dotted @sapUiContentContrastFocusColor;
18
25
  }
19
26
 
27
+ .sapMSelectListItemBase.sapMSelectListItemBasePressed,
28
+ .sapMSelectListItemBase.sapMSelectListItemBaseSelected.sapMSelectListItemBasePressed {
29
+ background-color: @sapUiListActiveBackground;
30
+ color: @sapUiListActiveTextColor;
31
+ }
32
+
20
33
  .sapMSelectListItemBase.sapMSelectListItemBasePressed .sapMSelectListItemIcon {
21
34
  color: @sapUiContentContrastIconColor;
22
35
  }
@@ -33,7 +46,7 @@ html.sap-desktop .sapMSelectListItemBase:focus::after,
33
46
  .sapMComboBoxBasePicker-CTX .sapMSelectListItemBaseSelected::after {
34
47
  pointer-events: none;
35
48
  content: "";
36
- border: @sapContent_FocusWidth @sapContent_FocusStyle @sapContent_FocusColor;
49
+ border: @sapUiContentFocusWidth @sapUiContentFocusStyle @sapUiContentFocusColor;
37
50
  position: absolute;
38
51
  top: 0;
39
52
  right: 0;
@@ -48,7 +61,11 @@ html.sap-desktop .sapMSelectListItemBase:focus {
48
61
  }
49
62
 
50
63
  .sapMSelectListItemBase {
64
+ background-color: @sapUiListBackground;
65
+ border-color: @sapUiListBorderColor;
51
66
  position: relative;
67
+ font-size: @sapFontSize;
68
+ color: @sapUiListTextColor;
52
69
 
53
70
  &:last-child:not(:only-child)::after {
54
71
  border-bottom-left-radius: 0.75rem;
@@ -1,7 +1,3 @@
1
- div.sapMSuggestionsPopover {
2
- box-shadow: @sapUiShadowLevel2;
3
- }
4
-
5
1
  .sapMSuggestionsPopover .sapMList .sapMLIB.sapMLIBFocusable.sapMLIBFocused,
6
2
  .sapMSuggestionsPopover .sapMValueStateHeaderRoot.sapMPseudoFocus {
7
3
  outline: @sapContent_FocusWidth @sapContent_FocusStyle @sapContent_FocusColor;