qms-angular 2.0.1 → 2.0.2

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 (41) hide show
  1. package/esm2022/lib/components/banner/qms-banner-confirm/qms-banner-confirm.component.mjs +3 -3
  2. package/esm2022/lib/components/related/popup/related-popup.component.mjs +3 -3
  3. package/esm2022/lib/components/related/risk/analysis/analysis.component.mjs +2 -2
  4. package/esm2022/lib/components/select-access-dialog/select-access-dialog.component.mjs +3 -3
  5. package/esm2022/lib/components/select-department/select-department.component.mjs +3 -3
  6. package/esm2022/lib/components/select-department-tree/select-department-tree.component.mjs +5 -5
  7. package/esm2022/lib/components/select-one/select-one.component.mjs +10 -12
  8. package/esm2022/lib/components/select-process-data/select-process-data.component.mjs +3 -3
  9. package/esm2022/lib/components/select-process-data-tree/select-process-data-tree.component.mjs +3 -3
  10. package/esm2022/lib/qms-ckeditor-components/common/module/confirm/qms-ckeditor-confirm.component.mjs +2 -2
  11. package/esm2022/lib/qms-ckeditor-components/components/qms-ckeditor-about/qms-ckeditor-about.component.mjs +2 -2
  12. package/esm2022/lib/qms-ckeditor-components/components/qms-ckeditor-imagemap/qms-ckeditor-imagemap.component.mjs +2 -2
  13. package/esm2022/lib/qms-ckeditor-components/components/qms-ckeditor-link/attachments/link-attachment.component.mjs +2 -2
  14. package/esm2022/lib/qms-ckeditor-components/components/qms-ckeditor-link/qms-ckeditor-link.component.mjs +2 -2
  15. package/esm2022/lib/qms-ckeditor-components/components/qms-ckeditor-link-simple/qms-ckeditor-link-simple.component.mjs +2 -2
  16. package/esm2022/lib/qms-ckeditor-components/components/qms-ckeditor-load-template/qms-ckeditor-load-template.component.mjs +2 -2
  17. package/esm2022/lib/qms-ckeditor-components/components/qms-ckeditor-relation/qmsckeditor-related.component.mjs +2 -2
  18. package/esm2022/lib/qms-ckeditor-components/components/qms-ckeditor-template/qms-ckeditor-template.component.mjs +2 -2
  19. package/esm2022/lib/qms-ckeditor-components/components/qms-ckeditor-tooltip/qms-ckeditor-tooltip.component.mjs +2 -2
  20. package/esm2022/lib/qms-ckeditor-components/qms-ckeditor.component.mjs +2 -2
  21. package/fesm2022/qms-angular.mjs +42 -42
  22. package/fesm2022/qms-angular.mjs.map +1 -1
  23. package/package.json +1 -1
  24. package/src/assets/qms-ckeditor-plugin/build/ckeditor.js +1 -1
  25. package/src/lib/components/banner/qms-banner-confirm/qms-banner-confirm.component.scss +44 -44
  26. package/src/lib/components/related/risk/analysis/analysis.component.scss +0 -3
  27. package/src/lib/components/select-access-dialog/select-access-dialog.component.scss +8 -2
  28. package/src/lib/components/select-department/select-department.component.scss +3 -3
  29. package/src/lib/components/select-department-tree/select-department-tree.component.scss +1 -1
  30. package/src/lib/components/select-dialog/select-dialog.scss +1 -1
  31. package/src/lib/components/select-process-data/select-process-data.component.scss +1 -1
  32. package/src/lib/components/select-process-data-tree/select-process-data-tree.component.scss +1 -1
  33. package/src/lib/components/select-process-document/select-process-document.component.scss +5 -6
  34. package/src/lib/qms-ckeditor-components/styles/_modules.scss +149 -146
  35. package/src/themes/core/_checkbox.scss +5 -1
  36. package/src/themes/core/_dialog.scss +42 -53
  37. package/src/themes/core/_form.scss +40 -35
  38. package/src/themes/core/_radio.scss +5 -1
  39. package/src/themes/core/_range-slider.scss +223 -201
  40. package/src/themes/core/_slide-toggle.scss +48 -6
  41. package/src/themes/core/_tab.scss +516 -512
package/src/themes/core/_range-slider.scss CHANGED
@@ -1,232 +1,254 @@
1
1
  @import "../theme/variable";
2
2
  @import "../theme/mixins";
3
3
 
4
- .mat-mdc-slider{
5
- &.qms-range-slider{
4
+ .mat-mdc-slider {
5
+ &.qms-range-slider {
6
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
7
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
8
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
9
+ &:not(.mat-slider-disabled) {
10
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
11
+ .mat-slider-track-background {
12
+ background-color: theme-apply($slider-background);
13
+ }
14
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
15
+ .mat-slider-track-fill {
16
+ background: theme-apply($active);
17
+ }
18
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
19
+ .mat-slider-thumb {
20
+ right: -6px;
21
+ bottom: -6px;
22
+ width: 12px;
23
+ height: 12px;
24
+ background-color: theme-apply($active);
25
+ border-color: theme-apply($active);
26
+ box-sizing: border-box;
27
+ border: 3px solid transparent;
28
+ border-radius: 50%;
29
+ }
30
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
31
+ .mat-slider-thumb:after {
32
+ content: "";
33
+ background-color: theme-apply($slider-hover-border);
34
+ background-size: 0%;
35
+ background-position: center;
36
+ display: block;
37
+ position: absolute;
38
+ border-radius: 50%;
39
+ left: -21px;
40
+ right: -21px;
41
+ top: 0;
42
+ bottom: 0;
43
+ width: 0px;
44
+ height: 0px;
45
+ margin: auto;
46
+ opacity: 1;
47
+ transition: background 1s;
48
+ }
49
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
50
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
51
+ &.mat-slider-min-value:not(.mat-slider-thumb-label-showing) {
6
52
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
53
+ .mat-slider-thumb {
54
+ background-color: theme-apply($active);
55
+ border-color: theme-apply($slider-focus-border);
56
+ }
57
+ }
58
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
59
+ &.mat-slider-has-ticks .mat-slider-wrapper::after {
60
+ border-color: theme-apply($slider-tick-color);
61
+ }
62
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
63
+ &.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover {
64
+ border-color: theme-apply($slider-hover-border);
65
+ }
66
+
67
+ &:focus-visible {
68
+ border-color: theme-apply($slider-focus-border);
69
+ }
70
+
71
+ &.cdk-mouse-focused,
72
+ &.cdk-touch-focused,
73
+ &.cdk-program-focused {
7
74
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
75
+ .mat-slider-thumb {
76
+ border-width: 18px;
77
+ border-color: theme-apply($slider-focus-border);
78
+ transform: scale(0.7);
79
+ }
80
+ }
81
+
82
+ &.qms-range-slider-active {
8
83
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
9
- &:not(.mat-slider-disabled){
10
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
11
- .mat-slider-track-background{
12
- background-color: theme-apply($slider-background);
13
- }
14
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
15
- .mat-slider-track-fill{
16
- background: theme-apply($active);
17
- }
18
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
19
- .mat-slider-thumb{
20
- right: -6px;
21
- bottom: -6px;
22
- width: 12px;
23
- height: 12px;
24
- background-color: theme-apply($active);
25
- border-color: theme-apply($active);
26
- box-sizing: border-box;
27
- border: 3px solid transparent;
28
- border-radius: 50%;
29
- }
30
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
31
- .mat-slider-thumb:after {
32
- content: "";
33
- background-color: theme-apply($slider-hover-border);
34
- background-size: 0%;
35
- background-position: center;
36
- display: block;
37
- position: absolute;
38
- border-radius: 50%;
39
- left: -21px;
40
- right: -21px;
41
- top: 0;
42
- bottom: 0;
43
- width: 0px;
44
- height: 0px;
45
- margin: auto;
46
- opacity: 1;
47
- transition: background 1s;
48
- }
49
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
50
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
51
- &.mat-slider-min-value:not(.mat-slider-thumb-label-showing){
52
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
53
- .mat-slider-thumb {
54
- background-color: theme-apply($active);
55
- border-color: theme-apply($slider-focus-border);
56
- }
57
- }
58
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
59
- &.mat-slider-has-ticks .mat-slider-wrapper::after{
60
- border-color: theme-apply($slider-tick-color);
61
- }
62
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
63
- &.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover{
64
- border-color: theme-apply($slider-hover-border);
65
- }
84
+ .mat-slider-thumb:after {
85
+ width: 48px;
86
+ height: 48px;
87
+ background-size: 100%;
88
+ background-position: center;
89
+ transition: all 500ms;
90
+ }
91
+ }
92
+ }
93
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
94
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
95
+ &.mat-slider-disabled {
96
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
97
+ .mat-slider-thumb {
98
+ background-color: black(0.26);
99
+ border-color: transparent;
100
+ }
101
+ }
102
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
103
+ .mat-slider-ticks {
104
+ background-image: repeating-linear-gradient(
105
+ to right,
106
+ theme-apply($slider-tick-color),
107
+ theme-apply($slider-tick-color) 2px,
108
+ transparent 0,
109
+ transparent
110
+ );
111
+ opacity: 1;
112
+ }
113
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
114
+ .mat-slider-focus-ring {
115
+ background-color: transparent;
116
+ }
117
+
118
+ .mdc-slider__track--inactive {
119
+ background-color: theme-apply($primary-dark-24-opacity);
120
+ }
66
121
 
67
- &:focus-visible{
68
- border-color: theme-apply($slider-focus-border);
69
- }
122
+ .mdc-slider__track--active_fill {
123
+ background-color: theme-apply($primary);
124
+ border-color: theme-apply($primary);
125
+ }
70
126
 
71
- &.cdk-mouse-focused, &.cdk-touch-focused, &.cdk-program-focused{
72
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
73
- .mat-slider-thumb {
74
- border-width: 18px;
75
- border-color: theme-apply($slider-focus-border);
76
- transform: scale(0.7);
77
- }
78
- }
127
+ .mdc-slider__thumb-knob {
128
+ background-color: theme-apply($primary);
129
+ border-color: theme-apply($primary);
130
+ }
131
+ }
132
+ }
79
133
 
80
- &.qms-range-slider-active {
81
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
82
- .mat-slider-thumb:after {
83
- width: 48px;
84
- height: 48px;
85
- background-size: 100%;
86
- background-position: center;
87
- transition: all 500ms;
88
- }
89
- }
134
+ .mat-mdc-slider {
135
+ &.qms-range-slider-lockup {
136
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
137
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
138
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
139
+ &:not(.mat-slider-disabled) {
140
+ &:focus-visible {
141
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
142
+ .mat-slider-thumb {
143
+ border-width: 18px;
144
+ border-color: theme-apply($slider-focus-border);
145
+ transform: scale(0.7);
90
146
  }
147
+ }
148
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
149
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
150
+ &.cdk-focused.mat-slider-thumb-label-showing {
91
151
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
152
+ .mat-slider-thumb-label {
153
+ border-radius: 10%;
154
+ transform: rotate(0deg);
155
+ background: theme-apply($default-color);
156
+ }
92
157
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
93
- &.mat-slider-disabled{
94
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
95
- .mat-slider-thumb{
96
- background-color: black(0.26);
97
- border-color: transparent;
98
- }
158
+ .mat-slider-thumb {
159
+ border-width: 18px;
160
+ border-color: theme-apply($slider-pressed);
161
+ transform: scale(0.7);
99
162
  }
100
163
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
101
- .mat-slider-ticks{
102
- background-image: repeating-linear-gradient(to right, theme-apply($slider-tick-color), theme-apply($slider-tick-color) 2px, transparent 0, transparent);
103
- opacity: 1;
164
+ .mat-slider-thumb-label-text {
165
+ transform: rotate(0deg);
104
166
  }
105
167
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
106
- .mat-slider-focus-ring{
107
- background-color: transparent;
168
+ .mat-slider-thumb-label::after {
169
+ position: absolute;
170
+ left: calc(50% - 8px);
171
+ top: 28px;
172
+ width: 0;
173
+ height: 0;
174
+ content: "";
175
+ margin: 0 auto;
176
+ transform: rotate(0deg);
177
+ border-left: 8px solid transparent;
178
+ border-right: 8px solid transparent;
179
+ border-top: 6px solid theme-apply($default-color);
108
180
  }
181
+ }
109
182
  }
183
+ }
110
184
  }
111
185
 
112
-
113
- .mat-mdc-slider{
114
- &.qms-range-slider-lockup{
115
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
116
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
186
+ .mat-mdc-slider:hover {
187
+ &.qms-range-slider {
188
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
189
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
190
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
191
+ &:not(.mat-slider-disabled) {
192
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
193
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
194
+ &.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover {
117
195
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
118
- &:not(.mat-slider-disabled){
119
- &:focus-visible{
120
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
121
- .mat-slider-thumb {
122
- border-width: 18px;
123
- border-color: theme-apply($slider-focus-border);
124
- transform: scale(0.7);
125
- }
126
- }
127
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
128
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
129
- &.cdk-focused.mat-slider-thumb-label-showing {
130
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
131
- .mat-slider-thumb-label {
132
- border-radius: 10%;
133
- transform: rotate(0deg);
134
- background: theme-apply($default-color);
135
- }
136
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
137
- .mat-slider-thumb {
138
- border-width: 18px;
139
- border-color: theme-apply($slider-pressed);
140
- transform: scale(0.7);
141
- }
142
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
143
- .mat-slider-thumb-label-text {
144
- transform: rotate(0deg);
145
- }
146
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
147
- .mat-slider-thumb-label::after {
148
- position: absolute;
149
- left: calc(50% - 8px);
150
- top: 28px;
151
- width: 0;
152
- height: 0;
153
- content: '';
154
- margin: 0 auto;
155
- transform: rotate(0deg);
156
- border-left: 8px solid transparent;
157
- border-right: 8px solid transparent;
158
- border-top: 6px solid theme-apply($default-color);
159
- }
160
- }
196
+ .mat-slider-thumb {
197
+ border-color: theme-apply($slider-hover-border);
161
198
  }
199
+ }
200
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
201
+ .mat-slider-thumb {
202
+ height: 48px;
203
+ width: 48px;
204
+ border-color: theme-apply($slider-hover-border);
205
+ border: solid 18px theme-apply($slider-hover-border);
206
+ bottom: -24px;
207
+ right: -24px;
208
+ background-clip: padding-box;
209
+ }
162
210
  }
211
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
212
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
213
+ &.mat-slider-disabled {
214
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
215
+ .mat-slider-thumb {
216
+ border-color: transparent;
217
+ }
218
+ }
219
+ }
163
220
  }
164
221
 
165
- .mat-mdc-slider:hover{
166
- &.qms-range-slider{
167
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
222
+ .mat-mdc-slider {
223
+ &.qms-range-slider {
224
+ &.cdk-focused,
225
+ &.cdk-keyboard-focused,
226
+ &.cdk-mouse-focused,
227
+ &.cdk-touch-focused,
228
+ &.cdk-program-focused {
229
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
230
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
231
+ &:not(.mat-slider-disabled) {
168
232
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
169
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
170
- &:not(.mat-slider-disabled){
171
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
172
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
173
- &.mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover{
174
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
175
- .mat-slider-thumb{
176
- border-color: theme-apply($slider-hover-border);
177
- }
178
-
179
- }
180
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
181
- .mat-slider-thumb {
182
- height: 48px;
183
- width: 48px;
184
- border-color: theme-apply($slider-hover-border);
185
- border: solid 18px theme-apply($slider-hover-border);
186
- bottom: -24px;
187
- right: -24px;
188
- background-clip: padding-box;
189
- }
233
+ .mat-slider-thumb {
234
+ transform: scale(0.7);
235
+ height: 48px;
236
+ width: 48px;
237
+ border-color: theme-apply($slider-focus-border);
238
+ border: solid 18px theme-apply($slider-focus-border);
239
+ bottom: -24px;
240
+ right: -24px;
241
+ background-clip: padding-box;
190
242
  }
243
+ }
244
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
245
+ /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
246
+ &.mat-slider-disabled {
191
247
  /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
192
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
193
- &.mat-slider-disabled{
194
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
195
- .mat-slider-thumb{
196
- border-color: transparent;
197
- }
248
+ .mat-slider-thumb {
249
+ border-color: transparent;
198
250
  }
251
+ }
199
252
  }
253
+ }
200
254
  }
201
-
202
- .mat-mdc-slider{
203
- &.qms-range-slider{
204
- &.cdk-focused, &.cdk-keyboard-focused, &.cdk-mouse-focused, &.cdk-touch-focused, &.cdk-program-focused{
205
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
206
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
207
- &:not(.mat-slider-disabled){
208
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
209
- .mat-slider-thumb {
210
- transform: scale(0.7);
211
- height: 48px;
212
- width: 48px;
213
- border-color: theme-apply($slider-focus-border);
214
- border: solid 18px theme-apply($slider-focus-border);
215
- bottom: -24px;
216
- right: -24px;
217
- background-clip: padding-box;
218
- }
219
- }
220
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
221
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
222
- &.mat-slider-disabled{
223
- /* TODO(mdc-migration): The following rule targets internal classes of slider that may no longer apply for the MDC version. */
224
- .mat-slider-thumb{
225
- border-color: transparent;
226
- }
227
- }
228
- }
229
-
230
- }
231
- }
232
-
package/src/themes/core/_slide-toggle.scss CHANGED
@@ -48,7 +48,6 @@
48
48
  font-size: 1rem;
49
49
  line-height: 28px;
50
50
  color: theme-apply($default-color);
51
- white-space: break-spaces;
52
51
  }
53
52
 
54
53
  .text-help {
@@ -110,7 +109,7 @@
110
109
  .mat-ripple-element {
111
110
  background-color: theme-apply($primary-circle-background-hover);
112
111
  }
113
-
112
+
114
113
  &.cdk-keyboard-focused {
115
114
  &:not(.ng-invalid) {
116
115
  background-color: theme-apply($primary-dark-24-opacity);
@@ -130,9 +129,8 @@
130
129
  }
131
130
  }
132
131
 
133
-
134
- //-------------------Start No Label-----------------------------//
135
- &.none-label {
132
+ //-------------------Start No Label-----------------------------//
133
+ &.none-label {
136
134
  /* TODO(mdc-migration): The following rule targets internal classes of slide-toggle that may no longer apply for the MDC version.*/
137
135
  .mat-slide-toggle-bar {
138
136
  margin-right: 0;
@@ -143,9 +141,53 @@
143
141
  &.cdk-keyboard-focused,
144
142
  &.mat-mdc-slide-toggle-checked {
145
143
  background-color: transparent;
146
- }
144
+ }
147
145
  }
148
146
  //-------------------End No Label-----------------------------//
149
147
 
148
+ .mdc-label {
149
+ display: flex;
150
+ flex-direction: column;
151
+ }
152
+
153
+ .mdc-switch:enabled .mdc-switch__track::after {
154
+ background-color: theme-apply($primary-dark-24-opacity);
155
+ }
156
+
157
+ .mdc-switch:enabled:hover:not(:focus):not(:active)
158
+ .mdc-switch__track::after {
159
+ background-color: theme-apply($primary-dark-24-opacity);
160
+ }
161
+
162
+ .mdc-switch:enabled:focus:not(:active) .mdc-switch__track::after {
163
+ background-color: theme-apply($primary-dark-24-opacity);
164
+ }
165
+
166
+ .mdc-switch.mdc-switch--selected:enabled .mdc-switch__handle::after {
167
+ background-color: theme-apply($primary);
168
+ }
169
+
170
+ .mdc-switch.mdc-switch--selected:enabled:hover:not(:focus):not(:active)
171
+ .mdc-switch__handle::after {
172
+ background-color: theme-apply($primary);
173
+ }
174
+
175
+ .mdc-switch.mdc-switch--selected:enabled:focus:not(:active)
176
+ .mdc-switch__handle::after.mdc-switch.mdc-switch--selected:enabled:focus:not(
177
+ :active
178
+ )
179
+ .mdc-switch__handle::after {
180
+ background-color: theme-apply($primary);
181
+ }
182
+
183
+ .mdc-switch.mdc-switch--selected:enabled:focus:not(:active)
184
+ .mdc-switch__handle::after {
185
+ background-color: theme-apply($primary);
186
+ }
187
+
188
+ .mdc-switch.mdc-switch--unselected:enabled:hover:not(:focus):not(:active)
189
+ .mdc-switch__handle::after {
190
+ background-color: var(--mdc-switch-unselected-handle-color);
191
+ }
150
192
  }
151
193
  }