@dvrd/dvr-controls 1.1.14 → 1.1.15
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/index.ts +1 -0
- package/package.json +1 -1
- package/src/js/button/style/button.scss +5 -4
- package/src/js/button/style/closeButton.scss +0 -2
- package/src/js/button/style/dvrdButton.scss +2 -2
- package/src/js/button/style/outlinedButton.scss +5 -5
- package/src/js/button/style/simpleButton.scss +3 -5
- package/src/js/carousel/style/DVRCarousel.scss +2 -3
- package/src/js/checkbox/style/checkbox.scss +8 -7
- package/src/js/colorPicker/style/colorPicker.scss +0 -2
- package/src/js/date/style/dvrdDatePicker.scss +21 -19
- package/src/js/dialog/style/dialog.scss +15 -12
- package/src/js/fileUpload/style/fileUpload.scss +2 -2
- package/src/js/header/style/header.scss +16 -14
- package/src/js/image/style/imageUpload.scss +0 -2
- package/src/js/info/style/info.scss +3 -3
- package/src/js/input/date/datePicker/style/datePicker.scss +5 -5
- package/src/js/input/date/style/dateField.scss +5 -4
- package/src/js/input/date/timePicker/style/timePicker.scss +5 -4
- package/src/js/input/password/style/passwordInput.scss +3 -3
- package/src/js/input/password/style/passwordRules.scss +4 -4
- package/src/js/input/simple/style/simpleInput.scss +2 -2
- package/src/js/input/style/input.scss +6 -5
- package/src/js/link/link.tsx +3 -1
- package/src/js/link/style/link.scss +4 -4
- package/src/js/loader/style/loader.scss +6 -5
- package/src/js/navigation/style/mobileNavigation.scss +31 -24
- package/src/js/optionsList/style/dvrdOptionsList.scss +6 -5
- package/src/js/optionsMenu/style/optionsMenu.scss +6 -5
- package/src/js/pdf/element/style/pdfElement.scss +8 -7
- package/src/js/pdf/image/style/pdfImage.scss +3 -3
- package/src/js/pdf/invoiceTable/style/pdfInvoiceTable.scss +2 -2
- package/src/js/pdf/settings/buttons/style/iconButton.scss +5 -5
- package/src/js/pdf/settings/image/pdfImageSettings.tsx +4 -6
- package/src/js/pdf/settings/invoiceTable/style/pdfInvoiceTableSettings.scss +4 -3
- package/src/js/pdf/settings/style/pdfElementSettings.scss +3 -3
- package/src/js/pdf/settings/text/style/pdfTextSettings.scss +5 -4
- package/src/js/pdf/style/pdfTemplateCreator.scss +12 -11
- package/src/js/pdf/text/style/pdfText.scss +0 -2
- package/src/js/popup/style/withBackground.scss +3 -3
- package/src/js/radio/style/dvrdRadio.scss +6 -5
- package/src/js/select/async/style/asyncSelect.scss +0 -2
- package/src/js/select/dvrdMultiSelect.tsx +1 -1
- package/src/js/select/dvrdSelect.tsx +12 -11
- package/src/js/select/dvrdSelectController.tsx +10 -11
- package/src/js/select/style/dvrdGroupedSelect.scss +12 -11
- package/src/js/select/style/dvrdSelect.scss +9 -8
- package/src/js/select/style/select.scss +16 -24
- package/src/js/sidebarMenu/sidebarMenu.tsx +21 -11
- package/src/js/sidebarMenu/style/sidebarMenu.scss +7 -6
- package/src/js/slider/style/DVRSlider.scss +2 -2
- package/src/js/snackbar/style/snackbar.scss +7 -6
- package/src/js/switch/style/dvrdSwitch.scss +2 -2
- package/src/js/switch/style/switch.scss +8 -8
- package/src/js/textField/dvrdPasswordInput.tsx +0 -1
- package/src/js/textField/style/dvrdInput.scss +4 -4
- package/src/js/textField/style/dvrdPassword.scss +3 -3
- package/src/js/topButton/style/topButton.scss +3 -3
- package/src/js/util/interfaces.ts +2 -2
- package/src/style/_colors.scss +44 -0
- package/src/style/{common-variables.scss → _common-variables.scss} +16 -62
- package/src/style/common-icons.scss +141 -142
- package/src/style/{variables.scss → main.scss} +2 -3
- package/src/js/label/style/label.scss +0 -4
- package/src/js/pdf/settings/image/style/pdfImageSettings.scss +0 -9
- /package/src/style/{display-breakpoints.scss → _display-breakpoints.scss} +0 -0
package/index.ts
CHANGED
package/package.json
CHANGED
|
@@ -2,14 +2,15 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/common-variables' as common;
|
|
6
|
+
@use '../../../style/colors';
|
|
6
7
|
|
|
7
8
|
.buttonController {
|
|
8
9
|
overflow: hidden;
|
|
9
10
|
display: inline-block;
|
|
10
11
|
|
|
11
12
|
&:not(.disabled) {
|
|
12
|
-
@include backgroundShadow;
|
|
13
|
+
@include common.backgroundShadow;
|
|
13
14
|
}
|
|
14
15
|
|
|
15
16
|
border-radius: .3rem;
|
|
@@ -80,11 +81,11 @@
|
|
|
80
81
|
}
|
|
81
82
|
|
|
82
83
|
&.disabled {
|
|
83
|
-
background-color:
|
|
84
|
+
background-color: colors.$color-gray-6 !important;
|
|
84
85
|
cursor: not-allowed;
|
|
85
86
|
|
|
86
87
|
.buttonLabel {
|
|
87
|
-
color:
|
|
88
|
+
color: colors.$color-gray-2 !important;
|
|
88
89
|
}
|
|
89
90
|
}
|
|
90
91
|
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/common-variables' as commons;
|
|
6
6
|
|
|
7
7
|
.dvrd-button {
|
|
8
|
-
@include backgroundShadow2;
|
|
8
|
+
@include commons.backgroundShadow2;
|
|
9
9
|
padding: .7rem 1rem;
|
|
10
10
|
cursor: pointer;
|
|
11
11
|
transition: background-color .2s ease-in-out;
|
|
@@ -2,10 +2,10 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/colors';
|
|
6
6
|
|
|
7
7
|
.outlinedButtonContainer {
|
|
8
|
-
|
|
8
|
+
border-radius: .3rem;
|
|
9
9
|
position: relative;
|
|
10
10
|
padding: .37rem 1rem;
|
|
11
11
|
cursor: pointer;
|
|
@@ -46,7 +46,7 @@
|
|
|
46
46
|
}
|
|
47
47
|
|
|
48
48
|
.ripple {
|
|
49
|
-
|
|
49
|
+
border-radius: 50%;
|
|
50
50
|
position: absolute;
|
|
51
51
|
opacity: .7;
|
|
52
52
|
width: 10%;
|
|
@@ -73,11 +73,11 @@
|
|
|
73
73
|
}
|
|
74
74
|
|
|
75
75
|
&.disabled {
|
|
76
|
-
border-color:
|
|
76
|
+
border-color: colors.$color-gray-6 !important;
|
|
77
77
|
cursor: not-allowed;
|
|
78
78
|
|
|
79
79
|
.outlinedButtonLabel {
|
|
80
|
-
color:
|
|
80
|
+
color: colors.$color-gray-2 !important;
|
|
81
81
|
}
|
|
82
82
|
}
|
|
83
83
|
}
|
|
@@ -2,9 +2,7 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
6
|
-
|
|
7
|
-
@import '../../../style/variables';
|
|
5
|
+
@use '../../../style/common-variables' as commons;
|
|
8
6
|
|
|
9
7
|
.dvr-simple-button {
|
|
10
8
|
position: relative;
|
|
@@ -43,7 +41,7 @@
|
|
|
43
41
|
}
|
|
44
42
|
|
|
45
43
|
.ripple {
|
|
46
|
-
|
|
44
|
+
border-radius: 50%;
|
|
47
45
|
position: absolute;
|
|
48
46
|
opacity: .5;
|
|
49
47
|
width: 10%;
|
|
@@ -66,7 +64,7 @@
|
|
|
66
64
|
}
|
|
67
65
|
|
|
68
66
|
&.primary {
|
|
69
|
-
@include backgroundShadow;
|
|
67
|
+
@include commons.backgroundShadow;
|
|
70
68
|
}
|
|
71
69
|
|
|
72
70
|
&.disabled {
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/colors';
|
|
6
6
|
|
|
7
7
|
.dvr-carousel {
|
|
8
8
|
display: grid;
|
|
@@ -11,12 +11,11 @@
|
|
|
11
11
|
justify-items: center;
|
|
12
12
|
|
|
13
13
|
.carousel-control {
|
|
14
|
-
color:
|
|
14
|
+
color: colors.$color-gray-5;
|
|
15
15
|
font-size: 1rem;
|
|
16
16
|
}
|
|
17
17
|
|
|
18
18
|
.carousel-items-container {
|
|
19
|
-
//transition: width .2s ease-in-out;
|
|
20
19
|
overflow: hidden;
|
|
21
20
|
|
|
22
21
|
.items-container {
|
|
@@ -2,7 +2,8 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/colors';
|
|
6
|
+
@use '../../../style/common-variables' as commons;
|
|
6
7
|
|
|
7
8
|
.checkboxContainer {
|
|
8
9
|
display: grid;
|
|
@@ -16,7 +17,7 @@
|
|
|
16
17
|
|
|
17
18
|
.checkboxLabel {
|
|
18
19
|
font-size: .9rem;
|
|
19
|
-
color:
|
|
20
|
+
color: colors.$color-gray-5;
|
|
20
21
|
cursor: inherit;
|
|
21
22
|
user-select: none;
|
|
22
23
|
transition: color .2s ease;
|
|
@@ -28,7 +29,7 @@
|
|
|
28
29
|
}
|
|
29
30
|
|
|
30
31
|
.checkbox {
|
|
31
|
-
|
|
32
|
+
border-radius: .2rem;
|
|
32
33
|
position: relative;
|
|
33
34
|
height: 22px;
|
|
34
35
|
width: 22px;
|
|
@@ -38,7 +39,7 @@
|
|
|
38
39
|
box-sizing: border-box;
|
|
39
40
|
|
|
40
41
|
.checkboxCheck, .checkbox-check {
|
|
41
|
-
@include centerXY;
|
|
42
|
+
@include commons.centerXY;
|
|
42
43
|
top: 55%;
|
|
43
44
|
font-size: .9rem;
|
|
44
45
|
cursor: inherit;
|
|
@@ -61,8 +62,8 @@
|
|
|
61
62
|
}
|
|
62
63
|
|
|
63
64
|
.ripple {
|
|
64
|
-
@include centerXY;
|
|
65
|
-
|
|
65
|
+
@include commons.centerXY;
|
|
66
|
+
border-radius: 50%;
|
|
66
67
|
opacity: 1;
|
|
67
68
|
width: 8px;
|
|
68
69
|
height: 8px;
|
|
@@ -74,7 +75,7 @@
|
|
|
74
75
|
border-radius: 50%;
|
|
75
76
|
|
|
76
77
|
.checkbox-check {
|
|
77
|
-
@include centerXY;
|
|
78
|
+
@include commons.centerXY;
|
|
78
79
|
font-size: 10px;
|
|
79
80
|
}
|
|
80
81
|
}
|
|
@@ -2,12 +2,14 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/colors';
|
|
6
|
+
@use '../../../style/display-breakpoints' as breakpoints;
|
|
7
|
+
@use '../../../style/common-variables' as commons;
|
|
6
8
|
|
|
7
9
|
.dvrd-date-picker {
|
|
8
10
|
display: flex;
|
|
9
11
|
flex-direction: column;
|
|
10
|
-
color:
|
|
12
|
+
color: colors.$color-blue-text;
|
|
11
13
|
position: relative;
|
|
12
14
|
|
|
13
15
|
.field-label {
|
|
@@ -25,13 +27,13 @@
|
|
|
25
27
|
position: relative;
|
|
26
28
|
cursor: pointer;
|
|
27
29
|
background-color: white;
|
|
28
|
-
color:
|
|
30
|
+
color: colors.$color-blue-text;
|
|
29
31
|
|
|
30
32
|
.value {
|
|
31
33
|
transition: color .1s ease-in-out;
|
|
32
34
|
|
|
33
35
|
&.placeholder {
|
|
34
|
-
color:
|
|
36
|
+
color: colors.$color-gray-3;
|
|
35
37
|
}
|
|
36
38
|
}
|
|
37
39
|
|
|
@@ -43,21 +45,21 @@
|
|
|
43
45
|
}
|
|
44
46
|
|
|
45
47
|
&.no-mob {
|
|
46
|
-
@include break-xs {
|
|
48
|
+
@include breakpoints.break-xs {
|
|
47
49
|
display: none;
|
|
48
50
|
}
|
|
49
51
|
}
|
|
50
52
|
}
|
|
51
53
|
|
|
52
54
|
.picker {
|
|
53
|
-
@include backgroundShadow2;
|
|
55
|
+
@include commons.backgroundShadow2;
|
|
54
56
|
--day-size: 26px;
|
|
55
57
|
background-color: white;
|
|
56
58
|
display: grid;
|
|
57
59
|
grid-template-columns: 1fr;
|
|
58
60
|
width: calc(var(--day-size) * 7 + .5rem * 6 + 1rem);
|
|
59
61
|
max-width: 100vw;
|
|
60
|
-
color:
|
|
62
|
+
color: colors.$color-blue-text;
|
|
61
63
|
|
|
62
64
|
.switcher, .current-date-container, .days-container, .today-container, .actions-container {
|
|
63
65
|
padding: .5rem;
|
|
@@ -94,7 +96,7 @@
|
|
|
94
96
|
user-select: none;
|
|
95
97
|
|
|
96
98
|
&:hover {
|
|
97
|
-
color:
|
|
99
|
+
color: colors.$color-gray-7;
|
|
98
100
|
}
|
|
99
101
|
}
|
|
100
102
|
|
|
@@ -127,16 +129,16 @@
|
|
|
127
129
|
|
|
128
130
|
.current-date-label {
|
|
129
131
|
font-size: .9rem;
|
|
130
|
-
color:
|
|
132
|
+
color: colors.$color-gray-3;
|
|
131
133
|
}
|
|
132
134
|
|
|
133
135
|
.tooltip-container {
|
|
134
|
-
@include centerY;
|
|
136
|
+
@include commons.centerY;
|
|
135
137
|
position: absolute;
|
|
136
138
|
right: .5rem;
|
|
137
139
|
|
|
138
140
|
.tooltip-icon {
|
|
139
|
-
color:
|
|
141
|
+
color: colors.$color-gray-3;
|
|
140
142
|
font-size: .8rem;
|
|
141
143
|
cursor: help;
|
|
142
144
|
}
|
|
@@ -156,12 +158,12 @@
|
|
|
156
158
|
display: grid;
|
|
157
159
|
grid-template-columns: auto;
|
|
158
160
|
grid-row-gap: .5rem;
|
|
159
|
-
border: 1px solid
|
|
161
|
+
border: 1px solid colors.$color-gray-4;
|
|
160
162
|
|
|
161
163
|
.tooltip-label {
|
|
162
164
|
justify-self: center;
|
|
163
165
|
font-size: .8rem;
|
|
164
|
-
color:
|
|
166
|
+
color: colors.$color-gray-3;
|
|
165
167
|
}
|
|
166
168
|
|
|
167
169
|
.key {
|
|
@@ -184,14 +186,14 @@
|
|
|
184
186
|
|
|
185
187
|
.shortcut, .directive {
|
|
186
188
|
font-size: .8rem;
|
|
187
|
-
color:
|
|
189
|
+
color: colors.$color-gray-3;
|
|
188
190
|
white-space: nowrap;
|
|
189
191
|
}
|
|
190
192
|
|
|
191
193
|
.shortcut {
|
|
192
194
|
font-size: .7rem;
|
|
193
195
|
padding: .1rem .25rem;
|
|
194
|
-
border: 1px solid
|
|
196
|
+
border: 1px solid colors.$color-gray-3;
|
|
195
197
|
|
|
196
198
|
&.text {
|
|
197
199
|
padding: 0 .25rem;
|
|
@@ -206,7 +208,7 @@
|
|
|
206
208
|
|
|
207
209
|
&:hover {
|
|
208
210
|
.tooltip {
|
|
209
|
-
@include backgroundShadow;
|
|
211
|
+
@include commons.backgroundShadow;
|
|
210
212
|
visibility: visible;
|
|
211
213
|
opacity: 1;
|
|
212
214
|
}
|
|
@@ -243,7 +245,7 @@
|
|
|
243
245
|
}
|
|
244
246
|
|
|
245
247
|
&.pad {
|
|
246
|
-
color:
|
|
248
|
+
color: colors.$color-gray-4;
|
|
247
249
|
}
|
|
248
250
|
|
|
249
251
|
&.selected {
|
|
@@ -256,7 +258,7 @@
|
|
|
256
258
|
}
|
|
257
259
|
|
|
258
260
|
&.disabled {
|
|
259
|
-
color:
|
|
261
|
+
color: colors.$color-gray-4;
|
|
260
262
|
background-color: unset;
|
|
261
263
|
cursor: default;
|
|
262
264
|
}
|
|
@@ -323,7 +325,7 @@
|
|
|
323
325
|
|
|
324
326
|
.vizor {
|
|
325
327
|
position: absolute;
|
|
326
|
-
background-color:
|
|
328
|
+
background-color: colors.$color-gray-4;
|
|
327
329
|
width: 100%;
|
|
328
330
|
height: 1px;
|
|
329
331
|
z-index: 1;
|
|
@@ -2,24 +2,27 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/common-variables' as commons;
|
|
6
|
+
@use '../../../style/colors';
|
|
7
|
+
@use '../../../style/display-breakpoints' as breakpoints;
|
|
6
8
|
|
|
7
9
|
.dialogContainer {
|
|
8
|
-
@include popupContainer;
|
|
9
|
-
z-index:
|
|
10
|
+
@include commons.popupContainer;
|
|
11
|
+
z-index: commons.$z-index-dialog;
|
|
10
12
|
|
|
11
13
|
&.transparent {
|
|
12
14
|
background-color: transparent;
|
|
13
15
|
}
|
|
14
16
|
|
|
15
17
|
.dvr-dialog {
|
|
16
|
-
@include popupDialog;
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
18
|
+
@include commons.popupDialog;
|
|
19
|
+
& {
|
|
20
|
+
display: flex;
|
|
21
|
+
flex-direction: column;
|
|
22
|
+
max-width: 40rem;
|
|
23
|
+
max-height: 100%;
|
|
24
|
+
padding: 1.5rem 2rem;
|
|
25
|
+
}
|
|
23
26
|
|
|
24
27
|
.dialogTitleContainer {
|
|
25
28
|
|
|
@@ -34,7 +37,7 @@
|
|
|
34
37
|
|
|
35
38
|
.dialogMessage {
|
|
36
39
|
margin: 0;
|
|
37
|
-
color:
|
|
40
|
+
color: colors.$color-gray-5;
|
|
38
41
|
}
|
|
39
42
|
}
|
|
40
43
|
|
|
@@ -53,7 +56,7 @@
|
|
|
53
56
|
}
|
|
54
57
|
}
|
|
55
58
|
|
|
56
|
-
@include break-sm-down {
|
|
59
|
+
@include breakpoints.break-sm-down {
|
|
57
60
|
width: 90vw;
|
|
58
61
|
box-sizing: border-box;
|
|
59
62
|
}
|
|
@@ -2,11 +2,11 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/colors';
|
|
6
6
|
|
|
7
7
|
.dvrd-file-upload {
|
|
8
8
|
border-radius: 1rem;
|
|
9
|
-
border: 1px solid
|
|
9
|
+
border: 1px solid colors.$color-gray-4;
|
|
10
10
|
padding: 1rem;
|
|
11
11
|
width: 50rem;
|
|
12
12
|
max-width: 100dvw;
|
|
@@ -2,7 +2,9 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/colors';
|
|
6
|
+
@use '../../../style/common-variables' as commons;
|
|
7
|
+
@use 'sass:color';
|
|
6
8
|
|
|
7
9
|
.dvr-header {
|
|
8
10
|
width: fit-content;
|
|
@@ -28,7 +30,7 @@
|
|
|
28
30
|
$height: 4rem;
|
|
29
31
|
|
|
30
32
|
.dvr-header-container {
|
|
31
|
-
@include backgroundShadow;
|
|
33
|
+
@include commons.backgroundShadow;
|
|
32
34
|
padding: .5rem 2rem;
|
|
33
35
|
display: flex;
|
|
34
36
|
align-items: center;
|
|
@@ -60,7 +62,7 @@
|
|
|
60
62
|
position: relative;
|
|
61
63
|
|
|
62
64
|
.children-container {
|
|
63
|
-
@include centerX;
|
|
65
|
+
@include commons.centerX;
|
|
64
66
|
visibility: hidden;
|
|
65
67
|
opacity: 0;
|
|
66
68
|
transition: visibility .1s ease-in-out, opacity .1s ease-in-out, box-shadow .1s ease-in-out;
|
|
@@ -70,15 +72,15 @@
|
|
|
70
72
|
|
|
71
73
|
.child-item {
|
|
72
74
|
padding: .5rem;
|
|
73
|
-
color:
|
|
74
|
-
border-bottom: 1px solid
|
|
75
|
+
color: colors.$color-gray-header;
|
|
76
|
+
border-bottom: 1px solid colors.$color-gray-4;
|
|
75
77
|
transition: background-color .2s ease-in-out;
|
|
76
78
|
display: flex;
|
|
77
79
|
justify-content: center;
|
|
78
80
|
|
|
79
81
|
label {
|
|
80
82
|
font-size: .9rem;
|
|
81
|
-
color:
|
|
83
|
+
color: colors.$color-gray-header;
|
|
82
84
|
font-weight: normal;
|
|
83
85
|
}
|
|
84
86
|
|
|
@@ -87,7 +89,7 @@
|
|
|
87
89
|
}
|
|
88
90
|
|
|
89
91
|
&:hover {
|
|
90
|
-
background-color:
|
|
92
|
+
background-color: colors.$color-gray-6;
|
|
91
93
|
}
|
|
92
94
|
}
|
|
93
95
|
}
|
|
@@ -96,7 +98,7 @@
|
|
|
96
98
|
border-color: currentColor;
|
|
97
99
|
|
|
98
100
|
.children-container {
|
|
99
|
-
@include backgroundShadow;
|
|
101
|
+
@include commons.backgroundShadow;
|
|
100
102
|
visibility: visible;
|
|
101
103
|
opacity: 1;
|
|
102
104
|
}
|
|
@@ -122,13 +124,13 @@
|
|
|
122
124
|
background-color: transparent;
|
|
123
125
|
|
|
124
126
|
.items-container .header-item-container {
|
|
125
|
-
color:
|
|
127
|
+
color: colors.$color-gray-header;
|
|
126
128
|
}
|
|
127
129
|
}
|
|
128
130
|
}
|
|
129
131
|
|
|
130
132
|
.dvr-menu {
|
|
131
|
-
@include backgroundShadow;
|
|
133
|
+
@include commons.backgroundShadow;
|
|
132
134
|
position: fixed;
|
|
133
135
|
height: 100%;
|
|
134
136
|
top: $height;
|
|
@@ -137,7 +139,7 @@
|
|
|
137
139
|
box-shadow: 0 1px 5px 0 rgba(black, 0.2), 0 2px 2px 0 rgba(black, 0.14), 0 3px 1px -2px rgba(black, 0.12);
|
|
138
140
|
transition: transform .2s ease-in-out;
|
|
139
141
|
padding: 1rem;
|
|
140
|
-
background-color:
|
|
142
|
+
background-color: colors.$color-gray-header;
|
|
141
143
|
max-width: 100vw;
|
|
142
144
|
box-sizing: border-box;
|
|
143
145
|
z-index: 9999;
|
|
@@ -147,7 +149,7 @@
|
|
|
147
149
|
}
|
|
148
150
|
|
|
149
151
|
.menu-item-container {
|
|
150
|
-
color:
|
|
152
|
+
color: colors.$color-gray-header-text;
|
|
151
153
|
padding: .75rem 1rem;
|
|
152
154
|
cursor: pointer;
|
|
153
155
|
transition: background-color .2s ease-in-out;
|
|
@@ -188,7 +190,7 @@
|
|
|
188
190
|
}
|
|
189
191
|
|
|
190
192
|
&:hover {
|
|
191
|
-
background-color:
|
|
193
|
+
background-color: color.scale(colors.$color-gray-header, $lightness: -10%);
|
|
192
194
|
}
|
|
193
195
|
}
|
|
194
196
|
|
|
@@ -201,6 +203,6 @@
|
|
|
201
203
|
position: fixed;
|
|
202
204
|
top: 0;
|
|
203
205
|
left: 0;
|
|
204
|
-
z-index:
|
|
206
|
+
z-index: commons.$z-index-menu + 1;
|
|
205
207
|
}
|
|
206
208
|
}
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../style/common-variables' as commons;
|
|
6
6
|
|
|
7
7
|
.dvr-info-container {
|
|
8
8
|
position: relative;
|
|
@@ -16,12 +16,12 @@
|
|
|
16
16
|
}
|
|
17
17
|
|
|
18
18
|
.dvr-message-container {
|
|
19
|
-
@include backgroundShadow;
|
|
19
|
+
@include commons.backgroundShadow;
|
|
20
20
|
padding: .2rem;
|
|
21
21
|
border-radius: .2rem;
|
|
22
22
|
background-color: white;
|
|
23
23
|
position: absolute;
|
|
24
|
-
z-index:
|
|
24
|
+
z-index: commons.$z-index-high;
|
|
25
25
|
top: 0;
|
|
26
26
|
right: 0;
|
|
27
27
|
width: 15rem;
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../../../style/colors';
|
|
6
6
|
|
|
7
7
|
.datepicker-container {
|
|
8
8
|
height: 21.5rem;
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
}
|
|
29
29
|
|
|
30
30
|
.dvr-month-container {
|
|
31
|
-
color:
|
|
31
|
+
color: colors.$color-gray-header;
|
|
32
32
|
display: flex;
|
|
33
33
|
align-items: center;
|
|
34
34
|
justify-content: center;
|
|
@@ -73,7 +73,7 @@
|
|
|
73
73
|
.weekday-label {
|
|
74
74
|
width: 100%;
|
|
75
75
|
text-align: center;
|
|
76
|
-
border-bottom: 1px solid
|
|
76
|
+
border-bottom: 1px solid colors.$color-gray-7;
|
|
77
77
|
}
|
|
78
78
|
|
|
79
79
|
.day-label {
|
|
@@ -87,12 +87,12 @@
|
|
|
87
87
|
|
|
88
88
|
&.disabled .day-label{
|
|
89
89
|
cursor: not-allowed;
|
|
90
|
-
color:
|
|
90
|
+
color: colors.$color-gray-4;
|
|
91
91
|
}
|
|
92
92
|
|
|
93
93
|
&.other-month {
|
|
94
94
|
.day-label {
|
|
95
|
-
color:
|
|
95
|
+
color: colors.$color-gray-4;
|
|
96
96
|
cursor: default;
|
|
97
97
|
transition: none;
|
|
98
98
|
}
|
|
@@ -2,10 +2,11 @@
|
|
|
2
2
|
* Copyright (c) 2024. Dave van Rijn Development
|
|
3
3
|
*/
|
|
4
4
|
|
|
5
|
-
@
|
|
5
|
+
@use '../../../../style/common-variables' as commons;
|
|
6
|
+
@use '../../../../style/colors';
|
|
6
7
|
|
|
7
8
|
.dvr-datepicker-container {
|
|
8
|
-
@include backgroundShadow;
|
|
9
|
+
@include commons.backgroundShadow;
|
|
9
10
|
background-color: white;
|
|
10
11
|
min-width: 16rem;
|
|
11
12
|
max-width: 100vw;
|
|
@@ -19,10 +20,10 @@
|
|
|
19
20
|
justify-content: center;
|
|
20
21
|
align-items: center;
|
|
21
22
|
padding: .5rem 0;
|
|
22
|
-
border-top: 1px solid
|
|
23
|
+
border-top: 1px solid colors.$color-gray-7;
|
|
23
24
|
|
|
24
25
|
.selector {
|
|
25
|
-
color:
|
|
26
|
+
color: colors.$color-gray-4;
|
|
26
27
|
cursor: pointer;
|
|
27
28
|
transition: color .2s ease-in-out;
|
|
28
29
|
|