@gipisistemas/ngx-core 1.0.12 → 1.0.13
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.
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
|
|
4
4
|
@mixin date-picker-calendar-theme($theme: ()) {
|
|
5
5
|
$font-family: utils.get-font-family($theme);
|
|
6
|
+
$font-size: utils.get-font-size($theme);
|
|
7
|
+
$font-color: utils.get-font-color($theme);
|
|
6
8
|
|
|
7
9
|
// Paleta de Cores
|
|
8
10
|
$primary-50: utils.get-color($theme, primary, 50);
|
|
@@ -37,6 +39,7 @@
|
|
|
37
39
|
display: flex;
|
|
38
40
|
width: 100%;
|
|
39
41
|
min-width: 28rem;
|
|
42
|
+
min-height: 35rem;
|
|
40
43
|
|
|
41
44
|
// Em telas menores, o painel de presets e o calendário empilham
|
|
42
45
|
@include breakpoints.mobile-view {
|
|
@@ -102,10 +105,41 @@
|
|
|
102
105
|
justify-content: space-between;
|
|
103
106
|
margin-bottom: 1.6rem;
|
|
104
107
|
|
|
105
|
-
.g-
|
|
106
|
-
|
|
108
|
+
.g-month-year-toggle {
|
|
109
|
+
display: flex;
|
|
110
|
+
align-items: center;
|
|
111
|
+
gap: 0.4rem;
|
|
112
|
+
height: 3.2rem;
|
|
113
|
+
color: $secondary-900;
|
|
114
|
+
font-family: $font-family;
|
|
115
|
+
font-size: $font-size;
|
|
107
116
|
font-weight: 500;
|
|
117
|
+
background: none;
|
|
118
|
+
border: none;
|
|
119
|
+
cursor: pointer;
|
|
120
|
+
transition: color 0.2s ease;
|
|
121
|
+
padding: 0.4rem;
|
|
122
|
+
border-radius: 0.4rem;
|
|
123
|
+
|
|
124
|
+
&:hover {
|
|
125
|
+
background-color: $secondary-100;
|
|
126
|
+
color: $secondary-700;
|
|
127
|
+
}
|
|
128
|
+
|
|
129
|
+
.g-toggle-icon {
|
|
130
|
+
font-size: 2rem;
|
|
131
|
+
transition: transform 0.2s ease;
|
|
132
|
+
|
|
133
|
+
&.open {
|
|
134
|
+
transform: rotate(180deg);
|
|
135
|
+
}
|
|
136
|
+
}
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
.g-header-title {
|
|
108
140
|
color: $secondary-900;
|
|
141
|
+
font-size: $font-size;
|
|
142
|
+
font-weight: 500;
|
|
109
143
|
}
|
|
110
144
|
|
|
111
145
|
.g-navigation-buttons {
|
|
@@ -113,26 +147,25 @@
|
|
|
113
147
|
gap: 0.4rem;
|
|
114
148
|
|
|
115
149
|
.g-nav-button {
|
|
116
|
-
width: 3.2rem;
|
|
117
|
-
height: 3.2rem;
|
|
118
150
|
display: flex;
|
|
119
151
|
align-items: center;
|
|
120
152
|
justify-content: center;
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
153
|
+
width: 3.2rem;
|
|
154
|
+
height: 3.2rem;
|
|
155
|
+
background-color: $primary-500;
|
|
156
|
+
color: $white-100;
|
|
157
|
+
border: none;
|
|
158
|
+
border-radius: 0.8rem;
|
|
125
159
|
cursor: pointer;
|
|
126
160
|
transition: all 0.2s ease;
|
|
127
161
|
padding: 0;
|
|
128
162
|
|
|
129
163
|
&:hover {
|
|
130
|
-
background-color: $
|
|
131
|
-
color: $primary-500;
|
|
164
|
+
background-color: $primary-600;
|
|
132
165
|
}
|
|
133
166
|
|
|
134
167
|
.material-symbols-rounded {
|
|
135
|
-
font-size: 2rem;
|
|
168
|
+
font-size: 2.2rem;
|
|
136
169
|
line-height: 1;
|
|
137
170
|
}
|
|
138
171
|
}
|
|
@@ -149,11 +182,11 @@
|
|
|
149
182
|
.g-year-button {
|
|
150
183
|
padding: 1rem 0.8rem;
|
|
151
184
|
font-size: 1.2rem;
|
|
152
|
-
border-radius: 0.
|
|
185
|
+
border-radius: 0.8rem;
|
|
153
186
|
transition: all 0.2s ease;
|
|
154
|
-
border:
|
|
187
|
+
border: 1px solid transparent;
|
|
155
188
|
cursor: pointer;
|
|
156
|
-
background:
|
|
189
|
+
background: $white-100;
|
|
157
190
|
font-family: $font-family;
|
|
158
191
|
color: $secondary-700;
|
|
159
192
|
|
|
@@ -161,10 +194,15 @@
|
|
|
161
194
|
background-color: $primary-500;
|
|
162
195
|
color: $white-100;
|
|
163
196
|
font-weight: 600;
|
|
197
|
+
|
|
198
|
+
&:hover {
|
|
199
|
+
background-color: $primary-600;
|
|
200
|
+
}
|
|
164
201
|
}
|
|
165
202
|
|
|
166
203
|
&.in-range {
|
|
167
204
|
background-color: $pastels-primary;
|
|
205
|
+
|
|
168
206
|
&.selected {
|
|
169
207
|
color: $white-100;
|
|
170
208
|
}
|
|
@@ -172,9 +210,10 @@
|
|
|
172
210
|
|
|
173
211
|
&:not(.selected):not(.disabled):hover {
|
|
174
212
|
background-color: $secondary-100;
|
|
213
|
+
border-color: $secondary-300;
|
|
175
214
|
}
|
|
176
215
|
|
|
177
|
-
|
|
216
|
+
&:not(.selected).current {
|
|
178
217
|
font-weight: 600;
|
|
179
218
|
color: $primary-500;
|
|
180
219
|
}
|
|
@@ -196,11 +235,11 @@
|
|
|
196
235
|
.g-month-button {
|
|
197
236
|
padding: 1rem 0.8rem;
|
|
198
237
|
font-size: 1.2rem;
|
|
199
|
-
border-radius: 0.
|
|
238
|
+
border-radius: 0.8rem;
|
|
200
239
|
transition: all 0.2s ease;
|
|
201
|
-
border:
|
|
240
|
+
border: 1px solid transparent;
|
|
202
241
|
cursor: pointer;
|
|
203
|
-
background:
|
|
242
|
+
background: $white-100;
|
|
204
243
|
font-family: $font-family;
|
|
205
244
|
color: $secondary-700;
|
|
206
245
|
|
|
@@ -208,6 +247,10 @@
|
|
|
208
247
|
background-color: $primary-500;
|
|
209
248
|
color: $white-100;
|
|
210
249
|
font-weight: 600;
|
|
250
|
+
|
|
251
|
+
&:hover {
|
|
252
|
+
background-color: $primary-600;
|
|
253
|
+
}
|
|
211
254
|
}
|
|
212
255
|
|
|
213
256
|
&.in-range {
|
|
@@ -219,9 +262,10 @@
|
|
|
219
262
|
|
|
220
263
|
&:not(.selected):not(.disabled):hover {
|
|
221
264
|
background-color: $secondary-100;
|
|
265
|
+
border-color: $secondary-300;
|
|
222
266
|
}
|
|
223
267
|
|
|
224
|
-
|
|
268
|
+
&:not(.selected).current {
|
|
225
269
|
font-weight: 600;
|
|
226
270
|
color: $primary-500;
|
|
227
271
|
}
|
|
@@ -233,44 +277,6 @@
|
|
|
233
277
|
}
|
|
234
278
|
}
|
|
235
279
|
|
|
236
|
-
/* Seletor de Data */
|
|
237
|
-
.g-date-header {
|
|
238
|
-
display: flex;
|
|
239
|
-
align-items: center;
|
|
240
|
-
justify-content: space-between;
|
|
241
|
-
margin-bottom: 1.2rem;
|
|
242
|
-
|
|
243
|
-
.g-month-year-toggle {
|
|
244
|
-
display: flex;
|
|
245
|
-
align-items: center;
|
|
246
|
-
gap: 0.4rem;
|
|
247
|
-
font-size: 1.4rem;
|
|
248
|
-
font-weight: 500;
|
|
249
|
-
color: $secondary-900;
|
|
250
|
-
background: none;
|
|
251
|
-
border: none;
|
|
252
|
-
cursor: pointer;
|
|
253
|
-
transition: color 0.2s ease;
|
|
254
|
-
font-family: $font-family;
|
|
255
|
-
padding: 0.4rem;
|
|
256
|
-
border-radius: 0.4rem;
|
|
257
|
-
|
|
258
|
-
&:hover {
|
|
259
|
-
background-color: $secondary-100;
|
|
260
|
-
color: $secondary-700;
|
|
261
|
-
}
|
|
262
|
-
|
|
263
|
-
.toggle-icon {
|
|
264
|
-
font-size: 2rem;
|
|
265
|
-
transition: transform 0.2s ease;
|
|
266
|
-
|
|
267
|
-
&.open {
|
|
268
|
-
transform: rotate(180deg);
|
|
269
|
-
}
|
|
270
|
-
}
|
|
271
|
-
}
|
|
272
|
-
}
|
|
273
|
-
|
|
274
280
|
/* Cabeçalho com dias da semana */
|
|
275
281
|
.g-weekdays {
|
|
276
282
|
display: grid;
|
|
@@ -303,7 +309,7 @@
|
|
|
303
309
|
display: flex;
|
|
304
310
|
align-items: center;
|
|
305
311
|
justify-content: center;
|
|
306
|
-
font-size: 1.
|
|
312
|
+
font-size: 1.3rem;
|
|
307
313
|
border: none;
|
|
308
314
|
background: none;
|
|
309
315
|
font-family: $font-family;
|
|
@@ -369,11 +375,13 @@
|
|
|
369
375
|
display: none;
|
|
370
376
|
}
|
|
371
377
|
|
|
372
|
-
&:not(.range-start):not(.range-end):not(.in-range):not(.disabled):
|
|
378
|
+
&:not(.range-start):not(.range-end):not(.in-range):not(.disabled):not(
|
|
379
|
+
.today
|
|
380
|
+
):not(.selected):hover {
|
|
373
381
|
background-color: $secondary-100;
|
|
374
382
|
}
|
|
375
383
|
|
|
376
|
-
&.today:not(.range-start):not(.range-end) {
|
|
384
|
+
&.today:not(.range-start):not(.range-end):not(.selected) {
|
|
377
385
|
font-weight: 600;
|
|
378
386
|
border: 1px solid $primary-500;
|
|
379
387
|
color: $primary-500;
|
|
@@ -388,6 +396,16 @@
|
|
|
388
396
|
outline: 2px solid $primary-50;
|
|
389
397
|
outline-offset: 1px;
|
|
390
398
|
}
|
|
399
|
+
|
|
400
|
+
&.selected {
|
|
401
|
+
background-color: $primary-500;
|
|
402
|
+
color: $white-100;
|
|
403
|
+
font-weight: 600;
|
|
404
|
+
|
|
405
|
+
&:hover {
|
|
406
|
+
background-color: $primary-600;
|
|
407
|
+
}
|
|
408
|
+
}
|
|
391
409
|
}
|
|
392
410
|
}
|
|
393
411
|
|
|
@@ -189,55 +189,30 @@
|
|
|
189
189
|
}
|
|
190
190
|
}
|
|
191
191
|
|
|
192
|
-
.
|
|
193
|
-
|
|
194
|
-
padding: 8px;
|
|
195
|
-
border-top: 1px solid #f3f4f6;
|
|
196
|
-
background-color: #ffffff;
|
|
197
|
-
}
|
|
198
|
-
|
|
199
|
-
.select-load-more-button {
|
|
200
|
-
font-size: 12px;
|
|
201
|
-
color: #2563eb;
|
|
202
|
-
font-weight: 500;
|
|
203
|
-
padding: 8px 16px;
|
|
204
|
-
border-radius: 6px;
|
|
205
|
-
border: 1px solid #bfdbfe;
|
|
206
|
-
transition: all 0.2s;
|
|
207
|
-
display: flex;
|
|
208
|
-
align-items: center;
|
|
209
|
-
justify-content: center;
|
|
210
|
-
gap: 8px;
|
|
211
|
-
width: 100%;
|
|
212
|
-
background: transparent;
|
|
213
|
-
cursor: pointer;
|
|
214
|
-
}
|
|
215
|
-
|
|
216
|
-
.select-load-more-button:hover:not(:disabled) {
|
|
217
|
-
color: #1d4ed8;
|
|
218
|
-
background-color: #eff6ff;
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
.select-load-more-button:disabled {
|
|
222
|
-
opacity: 0.5;
|
|
223
|
-
cursor: not-allowed;
|
|
224
|
-
}
|
|
192
|
+
.select-footer {
|
|
193
|
+
flex-shrink: 0;
|
|
225
194
|
|
|
226
|
-
|
|
227
|
-
|
|
195
|
+
&:empty {
|
|
196
|
+
display: none;
|
|
228
197
|
}
|
|
198
|
+
}
|
|
229
199
|
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
200
|
+
.g-select-server-side-footer-container {
|
|
201
|
+
display: flex;
|
|
202
|
+
align-items: center;
|
|
203
|
+
justify-content: space-between;
|
|
204
|
+
gap: 1rem;
|
|
205
|
+
min-height: 4rem;
|
|
206
|
+
padding: 0.8rem 1.2rem;
|
|
207
|
+
border-top: 1px solid $white-300;
|
|
208
|
+
background-color: $white-100;
|
|
233
209
|
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
}
|
|
210
|
+
.select-pagination-text {
|
|
211
|
+
font-size: 1.2rem;
|
|
212
|
+
line-height: 1.4;
|
|
213
|
+
color: $black-300;
|
|
214
|
+
font-weight: 500;
|
|
215
|
+
margin-left: auto;
|
|
241
216
|
}
|
|
242
217
|
}
|
|
243
218
|
}
|