@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.
- package/.reuse/dep5 +0 -7
- package/THIRDPARTY.txt +1 -22
- package/package.json +18 -18
- package/src/sap/f/themes/sap_horizon/Card.less +14 -19
- package/src/sap/f/themes/sap_horizon/CardHeaders.less +1 -2
- package/src/sap/f/themes/sap_horizon/ShellBar.less +5 -0
- package/src/sap/f/themes/sap_horizon_dark/Card.less +8 -13
- package/src/sap/f/themes/sap_horizon_dark/CardHeaders.less +1 -2
- package/src/sap/f/themes/sap_horizon_dark/ShellBar.less +5 -0
- package/src/sap/f/themes/sap_horizon_hcb/Card.less +3 -8
- package/src/sap/f/themes/sap_horizon_hcb/ShellBar.less +5 -0
- package/src/sap/f/themes/sap_horizon_hcb/library.source.less +0 -1
- package/src/sap/f/themes/sap_horizon_hcw/Card.less +3 -8
- package/src/sap/f/themes/sap_horizon_hcw/ShellBar.less +5 -0
- package/src/sap/f/themes/sap_horizon_hcw/library.source.less +0 -1
- package/src/sap/m/themes/sap_horizon/Avatar.less +13 -0
- package/src/sap/m/themes/sap_horizon/Button.less +6 -0
- package/src/sap/m/themes/sap_horizon/GenericTile.less +6 -25
- package/src/sap/m/themes/sap_horizon/NewsContent.less +1 -1
- package/src/sap/m/themes/sap_horizon/ProgressIndicator.less +1 -1
- package/src/sap/m/themes/sap_horizon/SplitButton.less +71 -54
- package/src/sap/m/themes/sap_horizon/StandardTile.less +2 -2
- package/src/sap/m/themes/sap_horizon/SuggestionsPopover.less +6 -1
- package/src/sap/m/themes/sap_horizon/Switch.less +109 -91
- package/src/sap/m/themes/sap_horizon/TabContainer.less +2 -0
- package/src/sap/m/themes/sap_horizon/TabStrip.less +48 -20
- package/src/sap/m/themes/sap_horizon/Table.less +5 -5
- package/src/sap/m/themes/sap_horizon/Text.less +3 -2
- package/src/sap/m/themes/sap_horizon/TextArea.less +2 -1
- package/src/sap/m/themes/sap_horizon/TileContainer.less +4 -4
- package/src/sap/m/themes/sap_horizon/TileContent.less +3 -3
- package/src/sap/m/themes/sap_horizon/ToggleButton.less +53 -41
- package/src/sap/m/themes/sap_horizon/ViewSettingsDialog.less +10 -6
- package/src/sap/m/themes/sap_horizon/WheelSlider.less +38 -14
- package/src/sap/m/themes/sap_horizon_dark/Avatar.less +13 -0
- package/src/sap/m/themes/sap_horizon_dark/Button.less +6 -0
- package/src/sap/m/themes/sap_horizon_dark/GenericTile.less +15 -37
- package/src/sap/m/themes/sap_horizon_dark/NewsContent.less +1 -1
- package/src/sap/m/themes/sap_horizon_dark/ProgressIndicator.less +1 -1
- package/src/sap/m/themes/sap_horizon_dark/SplitButton.less +70 -54
- package/src/sap/m/themes/sap_horizon_dark/StandardTile.less +2 -2
- package/src/sap/m/themes/sap_horizon_dark/SuggestionsPopover.less +1 -1
- package/src/sap/m/themes/sap_horizon_dark/Switch.less +108 -89
- package/src/sap/m/themes/sap_horizon_dark/TabContainer.less +2 -0
- package/src/sap/m/themes/sap_horizon_dark/TabStrip.less +50 -21
- package/src/sap/m/themes/sap_horizon_dark/Table.less +4 -4
- package/src/sap/m/themes/sap_horizon_dark/Text.less +3 -2
- package/src/sap/m/themes/sap_horizon_dark/TextArea.less +2 -1
- package/src/sap/m/themes/sap_horizon_dark/TileContainer.less +4 -3
- package/src/sap/m/themes/sap_horizon_dark/TileContent.less +3 -3
- package/src/sap/m/themes/sap_horizon_dark/ToggleButton.less +52 -41
- package/src/sap/m/themes/sap_horizon_dark/ViewSettingsDialog.less +10 -6
- package/src/sap/m/themes/sap_horizon_dark/WheelSlider.less +34 -11
- package/src/sap/m/themes/sap_horizon_hcb/Avatar.less +14 -0
- package/src/sap/m/themes/sap_horizon_hcb/Button.less +8 -0
- package/src/sap/m/themes/sap_horizon_hcb/GenericTile.less +0 -9
- package/src/sap/m/themes/sap_horizon_hcb/InputBase.less +5 -1
- package/src/sap/m/themes/sap_horizon_hcb/ObjectStatus.less +40 -40
- package/src/sap/m/themes/sap_horizon_hcb/ProgressIndicator.less +1 -1
- package/src/sap/m/themes/sap_horizon_hcb/SplitButton.less +3 -2
- package/src/sap/m/themes/sap_horizon_hcb/StepInput.less +2 -0
- package/src/sap/m/themes/sap_horizon_hcb/Switch.less +108 -90
- package/src/sap/m/themes/sap_horizon_hcb/TabContainer.less +5 -2
- package/src/sap/m/themes/sap_horizon_hcb/TabStrip.less +44 -17
- package/src/sap/m/themes/sap_horizon_hcb/Table.less +6 -6
- package/src/sap/m/themes/sap_horizon_hcb/Text.less +2 -1
- package/src/sap/m/themes/sap_horizon_hcb/TextArea.less +11 -8
- package/src/sap/m/themes/sap_horizon_hcb/Tile.less +9 -9
- package/src/sap/m/themes/sap_horizon_hcb/TileContainer.less +5 -5
- package/src/sap/m/themes/sap_horizon_hcb/ToggleButton.less +4 -5
- package/src/sap/m/themes/sap_horizon_hcb/ViewSettingsDialog.less +9 -6
- package/src/sap/m/themes/sap_horizon_hcb/WheelSlider.less +22 -5
- package/src/sap/m/themes/sap_horizon_hcw/Avatar.less +13 -0
- package/src/sap/m/themes/sap_horizon_hcw/Button.less +8 -0
- package/src/sap/m/themes/sap_horizon_hcw/GenericTile.less +0 -9
- package/src/sap/m/themes/sap_horizon_hcw/InputBase.less +5 -1
- package/src/sap/m/themes/sap_horizon_hcw/ObjectStatus.less +40 -40
- package/src/sap/m/themes/sap_horizon_hcw/ProgressIndicator.less +1 -1
- package/src/sap/m/themes/sap_horizon_hcw/SplitButton.less +3 -2
- package/src/sap/m/themes/sap_horizon_hcw/StepInput.less +2 -0
- package/src/sap/m/themes/sap_horizon_hcw/Switch.less +108 -90
- package/src/sap/m/themes/sap_horizon_hcw/TabContainer.less +5 -2
- package/src/sap/m/themes/sap_horizon_hcw/TabStrip.less +44 -17
- package/src/sap/m/themes/sap_horizon_hcw/Table.less +6 -6
- package/src/sap/m/themes/sap_horizon_hcw/Text.less +2 -1
- package/src/sap/m/themes/sap_horizon_hcw/TextArea.less +11 -8
- package/src/sap/m/themes/sap_horizon_hcw/Tile.less +9 -9
- package/src/sap/m/themes/sap_horizon_hcw/TileContainer.less +5 -5
- package/src/sap/m/themes/sap_horizon_hcw/ToggleButton.less +5 -5
- package/src/sap/m/themes/sap_horizon_hcw/ViewSettingsDialog.less +10 -6
- package/src/sap/m/themes/sap_horizon_hcw/WheelSlider.less +22 -5
- package/src/sap/tnt/themes/sap_horizon/NavigationList.less +10 -3
- package/src/sap/tnt/themes/sap_horizon_dark/NavigationList.less +10 -3
- package/src/sap/tnt/themes/sap_horizon_hcb/NavigationList.less +10 -3
- package/src/sap/tnt/themes/sap_horizon_hcw/NavigationList.less +10 -3
- package/src/sap/ui/core/themes/sap_horizon/.theme +1 -1
- package/src/sap/ui/core/themes/sap_horizon_dark/.theme +1 -1
- package/src/sap/ui/core/themes/sap_horizon_hcb/.theme +1 -1
- package/src/sap/ui/core/themes/sap_horizon_hcw/.theme +1 -1
- package/src/sap/ui/integration/themes/sap_horizon/ListContent.less +1 -1
- package/src/sap/ui/integration/themes/sap_horizon/TableContent.less +1 -1
- package/src/sap/uxap/themes/sap_horizon/ObjectPageSection.less +1 -1
- package/src/sap/uxap/themes/sap_horizon/ObjectPageSubSection.less +1 -1
- package/src/sap/uxap/themes/sap_horizon_dark/ObjectPageSection.less +1 -1
- package/src/sap/uxap/themes/sap_horizon_dark/ObjectPageSubSection.less +1 -1
- package/src/sap/uxap/themes/sap_horizon_hcb/ObjectPageSection.less +1 -1
- package/src/sap/uxap/themes/sap_horizon_hcb/ObjectPageSubSection.less +1 -1
- package/src/sap/uxap/themes/sap_horizon_hcw/ObjectPageSection.less +1 -1
- package/src/sap/uxap/themes/sap_horizon_hcw/ObjectPageSubSection.less +1 -1
- package/LICENSES/LicenseRef-tzdata-PublicDomain.txt +0 -5
- package/src/sap/f/themes/sap_horizon_hcb/CardHeaders.less +0 -28
- 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:
|
|
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
|
|
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
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
11
|
-
border-color:
|
|
12
|
-
color:
|
|
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:
|
|
16
|
+
color: var(--sapButton_Reject_Selected_TextColor);
|
|
15
17
|
}
|
|
16
18
|
}
|
|
19
|
+
|
|
17
20
|
&.sapMBtnSuccess {
|
|
18
|
-
background-color:
|
|
19
|
-
border-color:
|
|
20
|
-
color:
|
|
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:
|
|
26
|
+
color: var(--sapButton_Accept_Selected_TextColor);
|
|
23
27
|
}
|
|
24
28
|
}
|
|
29
|
+
|
|
25
30
|
&.sapMBtnCritical {
|
|
26
|
-
background-color:
|
|
27
|
-
border-color:
|
|
28
|
-
color:
|
|
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:
|
|
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:
|
|
42
|
-
border-color:
|
|
43
|
-
color:
|
|
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:
|
|
53
|
+
color: var(--sapButton_Reject_Selected_TextColor);
|
|
46
54
|
}
|
|
47
55
|
}
|
|
56
|
+
|
|
48
57
|
&.sapMBtnAccept,
|
|
49
58
|
&.sapMBtnSuccess {
|
|
50
|
-
background-color:
|
|
51
|
-
border-color:
|
|
52
|
-
color:
|
|
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:
|
|
64
|
+
color: var(--sapButton_Accept_Selected_TextColor);
|
|
55
65
|
}
|
|
56
66
|
}
|
|
67
|
+
|
|
57
68
|
&.sapMBtnAttention,
|
|
58
69
|
&.sapMBtnCritical {
|
|
59
|
-
background-color:
|
|
60
|
-
border-color:
|
|
61
|
-
color:
|
|
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:
|
|
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:
|
|
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:
|
|
111
|
-
color:
|
|
112
|
-
border-color:
|
|
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:
|
|
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:
|
|
135
|
+
border-color: var(--sapContent_FocusColor);
|
|
124
136
|
}
|
|
125
137
|
|
|
126
|
-
html.sap-desktop .sapMBtn:focus > .sapMBtnEmphasized.sapMToggleBtnPressed.sapMFocusable:not(.sapMBadgeIndicator)
|
|
127
|
-
border-color:
|
|
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)
|
|
136
|
-
html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnCritical.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)
|
|
137
|
-
html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnNegative.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)
|
|
138
|
-
html.sap-desktop .sapMBtn:focus > .sapMToggleBtnPressed.sapMBtnSuccess.sapMFocusable:not(.sapMBtnActive):not(.sapMBadgeIndicator)
|
|
139
|
-
border: 0.125rem solid
|
|
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:
|
|
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
|
-
|
|
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:
|
|
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:
|
|
21
|
-
color:
|
|
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:
|
|
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:
|
|
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:
|
|
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:
|
|
44
|
-
color:
|
|
52
|
+
background: var(--sapActiveColor);
|
|
53
|
+
color: var(--sapContent_ContrastTextColor);
|
|
45
54
|
}
|
|
46
55
|
|
|
47
56
|
}
|
|
57
|
+
|
|
48
58
|
.sapMWSSelectionFrame {
|
|
49
|
-
border: 0.125rem solid
|
|
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:
|
|
60
|
-
color:
|
|
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
|
|
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:
|
|
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:
|
|
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:
|
|
308
|
+
background-color: var(--sapTile_Active_Background);
|
|
312
309
|
}
|
|
313
310
|
}
|
|
314
311
|
|
|
315
|
-
.
|
|
316
|
-
|
|
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:
|
|
334
|
-
transition: background 0.2s;
|
|
319
|
+
background-color: var(--sapTile_Hover_Background);
|
|
335
320
|
}
|
|
336
321
|
}
|
|
337
322
|
|
|
338
|
-
.
|
|
339
|
-
|
|
340
|
-
.
|
|
341
|
-
|
|
342
|
-
|
|
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;
|