@vixcom/ui 1.5.0 → 1.6.1
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/dist/css/colors.css +30 -30
- package/dist/css/colors.css.map +1 -1
- package/dist/css/fonts.css +47 -47
- package/dist/css/helper/index.css +6 -0
- package/dist/css/helper/index.css.map +1 -0
- package/dist/css/helper/primefaces.css +72 -47
- package/dist/css/helper/primefaces.css.map +1 -1
- package/dist/css/main.css +80 -62
- package/dist/css/main.css.map +1 -1
- package/dist/css/menu.css +42 -21
- package/dist/css/menu.css.map +1 -1
- package/dist/css/sizes.css +0 -308
- package/dist/css/sizes.css.map +1 -1
- package/dist/css/variables.css +2 -2
- package/package.json +1 -1
- package/src/css/colors.css +839 -3787
- package/src/css/colors.css.map +1 -1
- package/src/css/fonts.css +110 -32
- package/src/css/fonts.css.map +1 -1
- package/src/css/helper/googlemaps.css.map +1 -0
- package/src/css/helper/index.css +6 -0
- package/src/css/helper/index.css.map +1 -0
- package/src/css/helper/primefaces.css +101 -53
- package/src/css/helper/primefaces.css.map +1 -1
- package/src/css/index.css.map +1 -1
- package/src/css/main.css +127 -151
- package/src/css/main.css.map +1 -1
- package/src/css/menu.css +42 -22
- package/src/css/menu.css.map +1 -1
- package/src/css/sizes.css +0 -355
- package/src/css/sizes.css.map +1 -1
- package/src/css/variables.css +4 -4
- package/src/index.html +2 -10
- package/src/pages/menu/index.html +11 -6
- package/src/styles/_mixins.scss +13 -5
- package/src/styles/fonts.scss +2 -2
- package/src/styles/helper/index.scss +6 -0
- package/src/styles/helper/primefaces.scss +76 -41
- package/src/styles/main.scss +29 -31
- package/src/styles/menu.scss +45 -14
- package/src/styles/sizes.scss +3 -3
package/src/css/menu.css
CHANGED
|
@@ -57,7 +57,7 @@ nav,
|
|
|
57
57
|
nav,
|
|
58
58
|
.nav,
|
|
59
59
|
.menu-container {
|
|
60
|
-
flex: 1 1
|
|
60
|
+
flex: 1 1 100%;
|
|
61
61
|
gap: 0.5rem;
|
|
62
62
|
}
|
|
63
63
|
|
|
@@ -68,7 +68,6 @@ nav .item,
|
|
|
68
68
|
gap: 0.75rem;
|
|
69
69
|
padding: 0.5rem 1rem;
|
|
70
70
|
text-decoration: none;
|
|
71
|
-
color: currentColor;
|
|
72
71
|
}
|
|
73
72
|
nav .item .label,
|
|
74
73
|
.nav .item .label {
|
|
@@ -132,6 +131,12 @@ nav .item .label,
|
|
|
132
131
|
transition: transform 0.5s;
|
|
133
132
|
z-index: 1;
|
|
134
133
|
}
|
|
134
|
+
.main-menu:not(.side-menu:has(> .menu-snap)) {
|
|
135
|
+
flex-direction: column;
|
|
136
|
+
}
|
|
137
|
+
.main-menu img {
|
|
138
|
+
max-height: 5rem;
|
|
139
|
+
}
|
|
135
140
|
.main-menu nav,
|
|
136
141
|
.main-menu .nav {
|
|
137
142
|
font-size: 120%;
|
|
@@ -139,6 +144,7 @@ nav .item .label,
|
|
|
139
144
|
.main-menu nav .item,
|
|
140
145
|
.main-menu .nav .item {
|
|
141
146
|
/* border-radius: inherit; */
|
|
147
|
+
cursor: pointer;
|
|
142
148
|
}
|
|
143
149
|
.main-menu nav .item,
|
|
144
150
|
.main-menu .nav .item {
|
|
@@ -147,7 +153,7 @@ nav .item .label,
|
|
|
147
153
|
.main-menu nav .item > *,
|
|
148
154
|
.main-menu .nav .item > * {
|
|
149
155
|
/* position: relative; */
|
|
150
|
-
z-index: 1;
|
|
156
|
+
/* z-index: 1; */
|
|
151
157
|
}
|
|
152
158
|
.main-menu nav .item::before,
|
|
153
159
|
.main-menu .nav .item::before {
|
|
@@ -161,7 +167,7 @@ nav .item .label,
|
|
|
161
167
|
border-radius: inherit;
|
|
162
168
|
top: 0;
|
|
163
169
|
left: 0;
|
|
164
|
-
z-index:
|
|
170
|
+
z-index: -1;
|
|
165
171
|
}
|
|
166
172
|
.main-menu nav .item::before:not(img::before, img::after),
|
|
167
173
|
.main-menu .nav .item::before:not(img::before, img::after) {
|
|
@@ -191,8 +197,16 @@ nav .item .label,
|
|
|
191
197
|
font-size: 150%;
|
|
192
198
|
}
|
|
193
199
|
|
|
200
|
+
.menu-snap {
|
|
201
|
+
display: flex;
|
|
202
|
+
overflow: scroll;
|
|
203
|
+
}
|
|
204
|
+
.menu-snap .item {
|
|
205
|
+
padding: 0.125%;
|
|
206
|
+
z-index: 1;
|
|
207
|
+
}
|
|
208
|
+
|
|
194
209
|
.side-menu {
|
|
195
|
-
flex-direction: column;
|
|
196
210
|
position: relative;
|
|
197
211
|
height: 100%;
|
|
198
212
|
transition: flex-basis 0.5s, transform 0.5s, opacity 0.25s;
|
|
@@ -242,6 +256,9 @@ main footer {
|
|
|
242
256
|
.main-menu-container .full-menu .nav {
|
|
243
257
|
overflow-x: scroll;
|
|
244
258
|
}
|
|
259
|
+
.main-menu-container input.main-menu-trigger:not(:checked) ~ .side-menu > .menu-snap, .main-menu-container input.main-menu-trigger:not(:checked) ~ * .side-menu > .menu-snap {
|
|
260
|
+
flex-basis: 25%;
|
|
261
|
+
}
|
|
245
262
|
.main-menu-container.grid:has(> .side-menu:not(.mini)):has(> input.main-menu-trigger:checked) {
|
|
246
263
|
grid-template-columns: 0fr 1fr;
|
|
247
264
|
}
|
|
@@ -290,6 +307,10 @@ main footer {
|
|
|
290
307
|
.main-menu-container.flex input.main-menu-trigger:checked ~ * .side-menu.mini {
|
|
291
308
|
flex-basis: 5%;
|
|
292
309
|
}
|
|
310
|
+
.main-menu-container.flex input.main-menu-trigger:checked ~ .side-menu.mini:has(> .menu-snap),
|
|
311
|
+
.main-menu-container.flex input.main-menu-trigger:checked ~ * .side-menu.mini:has(> .menu-snap) {
|
|
312
|
+
flex-basis: 10%;
|
|
313
|
+
}
|
|
293
314
|
.main-menu-container.flex input.main-menu-trigger:checked ~ .side-menu.mini .menu-header .menu-logo,
|
|
294
315
|
.main-menu-container.flex input.main-menu-trigger:checked ~ * .side-menu.mini .menu-header .menu-logo {
|
|
295
316
|
display: none;
|
|
@@ -399,27 +420,25 @@ main footer {
|
|
|
399
420
|
border-bottom: thin solid;
|
|
400
421
|
padding: 0;
|
|
401
422
|
}
|
|
402
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu,
|
|
403
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu {
|
|
423
|
+
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu, .main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu {
|
|
404
424
|
flex-basis: 8.25%;
|
|
405
425
|
}
|
|
406
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-
|
|
407
|
-
|
|
426
|
+
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu:has(> .menu-snap), .main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu:has(> .menu-snap) {
|
|
427
|
+
flex-basis: 16.5%;
|
|
428
|
+
}
|
|
429
|
+
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-header .menu-logo, .main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .menu-header .menu-logo {
|
|
408
430
|
display: none;
|
|
409
431
|
}
|
|
410
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-header .menu-logo-alt,
|
|
411
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .menu-header .menu-logo-alt {
|
|
432
|
+
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-header .menu-logo-alt, .main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .menu-header .menu-logo-alt {
|
|
412
433
|
display: block;
|
|
413
434
|
}
|
|
414
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-header .title,
|
|
415
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .menu-header .title {
|
|
435
|
+
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-header .title, .main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .menu-header .title {
|
|
416
436
|
opacity: 0;
|
|
417
437
|
height: 0;
|
|
418
438
|
margin-bottom: 0;
|
|
419
439
|
}
|
|
420
440
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu nav .item,
|
|
421
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .nav .item,
|
|
422
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu nav .item,
|
|
441
|
+
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .nav .item, .main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu nav .item,
|
|
423
442
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .nav .item {
|
|
424
443
|
justify-content: center;
|
|
425
444
|
}
|
|
@@ -430,8 +449,7 @@ main footer {
|
|
|
430
449
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-header .item .label,
|
|
431
450
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-header .title .label,
|
|
432
451
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-footer .item .label,
|
|
433
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-footer .title .label,
|
|
434
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu nav .item .label,
|
|
452
|
+
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-footer .title .label, .main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu nav .item .label,
|
|
435
453
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu nav .title .label,
|
|
436
454
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .nav .item .label,
|
|
437
455
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .nav .title .label,
|
|
@@ -446,8 +464,7 @@ main footer {
|
|
|
446
464
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu nav .title,
|
|
447
465
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .nav .title,
|
|
448
466
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-header .title,
|
|
449
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-footer .title,
|
|
450
|
-
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu nav .title,
|
|
467
|
+
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ .side-menu .menu-footer .title, .main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu nav .title,
|
|
451
468
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .nav .title,
|
|
452
469
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .menu-header .title,
|
|
453
470
|
.main-menu-container.flex input.main-menu-trigger:not(:checked) ~ * .side-menu .menu-footer .title {
|
|
@@ -460,6 +477,9 @@ main footer {
|
|
|
460
477
|
}
|
|
461
478
|
/* Tablet Below */
|
|
462
479
|
@media (max-width: 768px) {
|
|
480
|
+
.main-menu-container input.main-menu-trigger:checked ~ .side-menu > .menu-snap, .main-menu-container input.main-menu-trigger:checked ~ * .side-menu > .menu-snap {
|
|
481
|
+
flex-basis: 25%;
|
|
482
|
+
}
|
|
463
483
|
.main-menu-container input.main-menu-trigger:not(:checked) ~ .full-menu .menu-container nav,
|
|
464
484
|
.main-menu-container input.main-menu-trigger:not(:checked) ~ .full-menu .menu-container .nav,
|
|
465
485
|
.main-menu-container input.main-menu-trigger:not(:checked) ~ .float-menu .menu-container nav,
|
|
@@ -490,8 +510,8 @@ main footer {
|
|
|
490
510
|
background-color: hsla(var(--black-hs), var(--black-l), 0.2);
|
|
491
511
|
z-index: 1;
|
|
492
512
|
}
|
|
493
|
-
input.main-menu-trigger:checked ~ .main-menu,
|
|
494
|
-
input.main-menu-trigger:checked ~ * .main-menu {
|
|
513
|
+
input.main-menu-trigger:checked ~ .main-menu:not(:has(> .menu-snap)),
|
|
514
|
+
input.main-menu-trigger:checked ~ * .main-menu:not(:has(> .menu-snap)) {
|
|
495
515
|
flex-direction: column;
|
|
496
516
|
}
|
|
497
517
|
input.main-menu-trigger:checked ~ .main-menu .menu-header,
|
|
@@ -528,7 +548,7 @@ main footer {
|
|
|
528
548
|
input.main-menu-trigger:checked ~ * .full-menu .menu-container {
|
|
529
549
|
background-color: unset;
|
|
530
550
|
}
|
|
531
|
-
.main-menu-container .main-menu nav, .main-menu-container .main-menu .nav, .main-menu-container .main-menu .menu-container, .main-menu-container.flex {
|
|
551
|
+
.main-menu-container input.main-menu-trigger:checked ~ .main-menu nav, .main-menu-container input.main-menu-trigger:checked ~ .main-menu .nav, .main-menu-container input.main-menu-trigger:checked ~ .main-menu .menu-container, .main-menu-container input.main-menu-trigger:checked ~ * .main-menu nav, .main-menu-container input.main-menu-trigger:checked ~ * .main-menu .nav, .main-menu-container input.main-menu-trigger:checked ~ * .main-menu .menu-container, .main-menu-container.flex {
|
|
532
552
|
flex-direction: column;
|
|
533
553
|
}
|
|
534
554
|
.main-menu-container.grid:has(> .side-menu) {
|
package/src/css/menu.css.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sourceRoot":"","sources":["../styles/menu.scss","../styles/_mixins.scss"],"names":[],"mappings":"AAGA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAmDA;AACE;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;;AAEA;EACE;;AAGF;EAGE;;AAQI;AAAA;AAAA;AAAA;EACE;EACA;;AAaV;EACE;EACA;EACA;;;AAGF;EACE;EACA;;;AAGF;AAAA;AAAA;AAAA;AAAA;EAKE;;;AAGF;AAAA;EAEE;;;AAGF;AAAA;AAAA;EAGE;EACA;;;AAKA;AAAA;EACE;EACA;EACA;EACA;EACA
|
|
1
|
+
{"version":3,"sourceRoot":"","sources":["../styles/menu.scss","../styles/_mixins.scss"],"names":[],"mappings":"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","file":"menu.css"}
|