@levo-so/blocks 0.1.84 → 0.1.85

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 (5) hide show
  1. package/package.json +6 -6
  2. package/src/blocks/navbar/navbar-1.schema.ts +200 -776
  3. package/src/blocks/navbar/navbar-2.schema.ts +206 -1136
  4. package/src/blocks/navbar/navbar-3.schema.ts +375 -11887
  5. package/src/blocks/navbar/navbar-4.schema.ts +2101 -23248
package/src/blocks/navbar/navbar-1.schema.ts CHANGED
@@ -141,6 +141,197 @@ const DEFAULT_CONTENT = {
141
141
 
142
142
  export type INavbar1Content = typeof DEFAULT_CONTENT;
143
143
 
144
+ const DESKTOP_NAV_MENU_STYLE_GROUP = {
145
+ "desktop-nav-menu_levoGroup": {
146
+ display: "flex",
147
+ "align-items": "center",
148
+ "column-gap": "7xl",
149
+ tablet: {
150
+ display: "none",
151
+ },
152
+ },
153
+ "desktop-nav-menu_levoGroupItem": {
154
+ "nav-item-title": {
155
+ width: "fit-content",
156
+ "font-size": "base",
157
+ "font-weight": 400,
158
+ "white-space": "nowrap",
159
+ color: "text-1",
160
+ },
161
+ "nav-item-dropdown-trigger": {
162
+ display: "flex",
163
+ "column-gap": "2xs",
164
+ "align-items": "center",
165
+ cursor: "pointer",
166
+ },
167
+ "nav-item-dropdown-trigger-title": {
168
+ width: "fit-content",
169
+ "font-size": "base",
170
+ "line-height": 1.5,
171
+ "font-weight": 400,
172
+ "white-space": "nowrap",
173
+ color: "var(--color-text-1)",
174
+ },
175
+ "sub-items_levoGroup": {
176
+ display: "flex",
177
+ padding: "4xs",
178
+ "flex-direction": "column",
179
+ "column-gap": "0",
180
+ "row-gap": "0",
181
+ "border-width": "1px",
182
+ "outline-style": "none",
183
+ width: "fit-content",
184
+ "background-color": "#ffffff",
185
+ "box-shadow": "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
186
+ },
187
+ "sub-items_levoGroupItem": {
188
+ "sub-item-link": {
189
+ display: "flex",
190
+ "padding-top": "sm",
191
+ "padding-bottom": "sm",
192
+ "padding-left": "sm",
193
+ "padding-right": "sm",
194
+ "column-gap": "sm",
195
+ "align-items": "center",
196
+ "border-radius": "base",
197
+ width: "100%",
198
+ _hover: {
199
+ "background-color": "rgba(241 245 249 / 0.5)",
200
+ },
201
+ },
202
+ "sub-item-icon-container": {
203
+ "aspect-ratio": "1",
204
+ display: "flex",
205
+ "justify-content": "center",
206
+ "align-items": "center",
207
+ "border-radius": "base",
208
+ height: "41.4px",
209
+ width: "41.4px",
210
+ "background-color": "rgb(241 245 249 / 1)",
211
+ },
212
+ "sub-item-icon": {
213
+ "object-fit": "contain",
214
+ width: "24px",
215
+ height: "24px",
216
+ },
217
+ "sub-item-text-container": {
218
+ display: "flex",
219
+ "flex-direction": "column",
220
+ flex: "1 1 0%",
221
+ "row-gap": "5xs",
222
+ },
223
+ "sub-item-title": {
224
+ "font-size": "sm",
225
+ "line-height": 1.625,
226
+ "font-weight": 600,
227
+ color: "var(--color-text-1)",
228
+ },
229
+ "sub-item-description": {
230
+ "font-size": "xs",
231
+ "line-height": 1.375,
232
+ "font-weight": 400,
233
+ color: "var(--color-text-2)",
234
+ },
235
+ },
236
+ },
237
+ };
238
+
239
+ const MOBILE_NAV_MENU_STYLE_GROUP = {
240
+ "mobile-nav-menu_levoGroup": {
241
+ display: "flex",
242
+ "flex-direction": "column",
243
+ "row-gap": "2xs",
244
+ },
245
+ "mobile-nav-menu_levoGroupItem": {
246
+ "nav-item-title-container": {
247
+ width: "100%",
248
+ },
249
+ "nav-item-title": {
250
+ "padding-top": "2xs",
251
+ "padding-bottom": "2xs",
252
+ "column-gap": "2xs",
253
+ "justify-content": "flex-start",
254
+ width: "100%",
255
+
256
+ color: "text-1",
257
+ },
258
+ "nav-item-dropdown-container": {
259
+ display: "flex",
260
+ "flex-direction": "column",
261
+ width: "100%",
262
+ },
263
+ "nav-item-dropdown-trigger": {
264
+ display: "flex",
265
+ "padding-top": "2xs",
266
+ "padding-bottom": "2xs",
267
+ "column-gap": "2xs",
268
+ "justify-content": "space-between",
269
+ "align-items": "center",
270
+ width: "100%",
271
+ "font-size": "lg",
272
+ "line-height": 1.625,
273
+ "font-weight": 600,
274
+ cursor: "pointer",
275
+ },
276
+ "nav-item-dropdown-trigger-title": {
277
+ "font-size": "lg",
278
+ "line-height": "28px",
279
+ "font-weight": 600,
280
+ color: "var(--color-text-1)",
281
+ },
282
+ "sub-items_levoGroup": {
283
+ display: "flex",
284
+ "flex-direction": "column",
285
+ "row-gap": "4xs",
286
+ width: "100%",
287
+ },
288
+ "sub-items_levoGroupItem": {
289
+ "sub-item-link": {
290
+ display: "flex",
291
+ "padding-top": "2xs",
292
+ "padding-bottom": "2xs",
293
+ "padding-left": "2xs",
294
+ "padding-right": "2xs",
295
+ "column-gap": "sm",
296
+ "align-items": "center",
297
+ "border-radius": "base",
298
+ width: "100%",
299
+ },
300
+ "sub-item-icon-container": {
301
+ "aspect-ratio": "1 / 1",
302
+ display: "flex",
303
+ "justify-content": "center",
304
+ "align-items": "center",
305
+ "border-radius": "base",
306
+ },
307
+ "sub-item-icon": {
308
+ "object-fit": "contain",
309
+ width: "24px",
310
+ height: "24px",
311
+ },
312
+ "sub-item-text-container": {
313
+ display: "flex",
314
+ "flex-direction": "column",
315
+ flex: "1 1 0%",
316
+ "row-gap": "4xs",
317
+ },
318
+ "sub-item-title-container": {},
319
+ "sub-item-title": {
320
+ "font-size": "base",
321
+ "line-height": 1.2,
322
+ "font-weight": 600,
323
+ color: "var(--color-text-1)",
324
+ },
325
+ "sub-item-description": {
326
+ "font-size": "sm",
327
+ "line-height": 1.375,
328
+ "font-weight": 400,
329
+ color: "var(--color-text-2)",
330
+ },
331
+ },
332
+ },
333
+ };
334
+
144
335
  export const Navbar1: IBlock = {
145
336
  category_id: "navbar",
146
337
  title: "Navbar 1",
@@ -367,6 +558,8 @@ export const Navbar1: IBlock = {
367
558
  key: "default",
368
559
  title: "Default",
369
560
  styles: {
561
+ ...DESKTOP_NAV_MENU_STYLE_GROUP,
562
+ ...MOBILE_NAV_MENU_STYLE_GROUP,
370
563
  layout: {
371
564
  position: "fixed",
372
565
  top: "2rem",
@@ -397,103 +590,6 @@ export const Navbar1: IBlock = {
397
590
  "nav-logo": {
398
591
  height: "36px",
399
592
  },
400
- "desktop-nav-menu_levoGroup": {
401
- display: "flex",
402
- "align-items": "center",
403
- "column-gap": "7xl",
404
- tablet: {
405
- display: "none",
406
- },
407
- },
408
- "desktop-nav-menu": Array(3)
409
- .fill(0)
410
- .map(() => ({
411
- "nav-item-title": {
412
- width: "fit-content",
413
- "font-size": "base",
414
- "font-weight": 400,
415
- "white-space": "nowrap",
416
- color: "text-1",
417
- },
418
- "nav-item-dropdown-trigger": {
419
- display: "flex",
420
- "column-gap": "2xs",
421
- "align-items": "center",
422
- cursor: "pointer",
423
- },
424
- "nav-item-dropdown-trigger-title": {
425
- width: "fit-content",
426
- "font-size": "base",
427
- "line-height": 1.5,
428
- "font-weight": 400,
429
- "white-space": "nowrap",
430
- color: "var(--color-text-1)",
431
- },
432
- "sub-items_levoGroup": {
433
- display: "flex",
434
- padding: "4xs",
435
- "flex-direction": "column",
436
- "column-gap": "0",
437
- "row-gap": "0",
438
- "border-width": "1px",
439
- "outline-style": "none",
440
- width: "fit-content",
441
- "background-color": "#ffffff",
442
- "box-shadow":
443
- "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
444
- },
445
- "sub-items": Array(3)
446
- .fill(0)
447
- .map((_, index) => ({
448
- "sub-item-link": {
449
- display: "flex",
450
- "padding-top": "sm",
451
- "padding-bottom": "sm",
452
- "padding-left": "sm",
453
- "padding-right": "sm",
454
- "column-gap": "sm",
455
- "align-items": "center",
456
- "border-radius": "base",
457
- width: "100%",
458
- _hover: {
459
- "background-color": "rgba(241 245 249 / 0.5)",
460
- },
461
- },
462
- "sub-item-icon-container": {
463
- "aspect-ratio": "1",
464
- display: "flex",
465
- "justify-content": "center",
466
- "align-items": "center",
467
- "border-radius": "base",
468
- height: "41.4px",
469
- width: "41.4px",
470
- "background-color": "rgb(241 245 249 / 1)",
471
- },
472
- "sub-item-icon": {
473
- "object-fit": "contain",
474
- width: "24px",
475
- height: "24px",
476
- },
477
- "sub-item-text-container": {
478
- display: "flex",
479
- "flex-direction": "column",
480
- flex: "1 1 0%",
481
- "row-gap": "5xs",
482
- },
483
- "sub-item-title": {
484
- "font-size": "sm",
485
- "line-height": 1.625,
486
- "font-weight": 600,
487
- color: "var(--color-text-1)",
488
- },
489
- "sub-item-description": {
490
- "font-size": "xs",
491
- "line-height": 1.375,
492
- "font-weight": 400,
493
- color: "var(--color-text-2)",
494
- },
495
- })),
496
- })),
497
593
  "desktop-cta-group_levoGroup": {
498
594
  display: "flex",
499
595
  "column-gap": "sm",
@@ -545,103 +641,6 @@ export const Navbar1: IBlock = {
545
641
  "box-shadow": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
546
642
  transform: "translate(-50%, 0) rotate(0) skewX(0) skewY(0) scaleX(1) scaleY(1)",
547
643
  },
548
- "mobile-nav-menu_levoGroup": {
549
- display: "flex",
550
- "flex-direction": "column",
551
- "row-gap": "2xs",
552
- },
553
- "mobile-nav-menu": Array(3)
554
- .fill(0)
555
- .map(() => ({
556
- "nav-item-title-container": {
557
- width: "100%",
558
- },
559
- "nav-item-title": {
560
- "padding-top": "2xs",
561
- "padding-bottom": "2xs",
562
- "column-gap": "2xs",
563
- "justify-content": "flex-start",
564
- width: "100%",
565
-
566
- color: "text-1",
567
- },
568
- "nav-item-dropdown-container": {
569
- display: "flex",
570
- "flex-direction": "column",
571
- width: "100%",
572
- },
573
- "nav-item-dropdown-trigger": {
574
- display: "flex",
575
- "padding-top": "2xs",
576
- "padding-bottom": "2xs",
577
- "column-gap": "2xs",
578
- "justify-content": "space-between",
579
- "align-items": "center",
580
- width: "100%",
581
- "font-size": "lg",
582
- "line-height": 1.625,
583
- "font-weight": 600,
584
- cursor: "pointer",
585
- },
586
- "nav-item-dropdown-trigger-title": {
587
- "font-size": "lg",
588
- "line-height": "28px",
589
- "font-weight": 600,
590
- color: "var(--color-text-1)",
591
- },
592
- "sub-items_levoGroup": {
593
- display: "flex",
594
- "flex-direction": "column",
595
- "row-gap": "4xs",
596
- width: "100%",
597
- },
598
- "sub-items": Array(3)
599
- .fill(0)
600
- .map(() => ({
601
- "sub-item-link": {
602
- display: "flex",
603
- "padding-top": "2xs",
604
- "padding-bottom": "2xs",
605
- "padding-left": "2xs",
606
- "padding-right": "2xs",
607
- "column-gap": "sm",
608
- "align-items": "center",
609
- "border-radius": "base",
610
- width: "100%",
611
- },
612
- "sub-item-icon-container": {
613
- "aspect-ratio": "1 / 1",
614
- display: "flex",
615
- "justify-content": "center",
616
- "align-items": "center",
617
- "border-radius": "base",
618
- },
619
- "sub-item-icon": {
620
- "object-fit": "contain",
621
- width: "24px",
622
- height: "24px",
623
- },
624
- "sub-item-text-container": {
625
- display: "flex",
626
- "flex-direction": "column",
627
- flex: "1 1 0%",
628
- "row-gap": "4xs",
629
- },
630
- "sub-item-title-container": {},
631
- "sub-item-title": {
632
- "font-size": "base",
633
- "line-height": 1.2,
634
- "font-weight": 600,
635
- color: "var(--color-text-1)",
636
- },
637
- "sub-item-description": {
638
- "font-size": "sm",
639
- "line-height": 1.375,
640
- "font-weight": 400,
641
- color: "var(--color-text-2)",
642
- },
643
- })),
644
- })),
645
644
  "mobile-cta-group_levoGroup": {
646
645
  "margin-top": "2xs",
647
646
  width: "100%",
@@ -690,6 +689,8 @@ export const Navbar1: IBlock = {
690
689
  key: "default-search",
691
690
  title: "Default with Search",
692
691
  styles: {
692
+ ...DESKTOP_NAV_MENU_STYLE_GROUP,
693
+ ...MOBILE_NAV_MENU_STYLE_GROUP,
693
694
  layout: {
694
695
  position: "fixed",
695
696
  top: "2rem",
@@ -720,103 +721,7 @@ export const Navbar1: IBlock = {
720
721
  "nav-logo": {
721
722
  height: "36px",
722
723
  },
723
- "desktop-nav-menu_levoGroup": {
724
- display: "flex",
725
- "align-items": "center",
726
- "column-gap": "7xl",
727
- tablet: {
728
- display: "none",
729
- },
730
- },
731
- "desktop-nav-menu": Array(3)
732
- .fill(0)
733
- .map(() => ({
734
- "nav-item-title": {
735
- width: "fit-content",
736
- "font-size": "base",
737
- "font-weight": 400,
738
- "white-space": "nowrap",
739
- color: "text-1",
740
- },
741
- "nav-item-dropdown-trigger": {
742
- display: "flex",
743
- "column-gap": "2xs",
744
- "align-items": "center",
745
- cursor: "pointer",
746
- },
747
- "nav-item-dropdown-trigger-title": {
748
- width: "fit-content",
749
- "font-size": "base",
750
- "line-height": 1.5,
751
- "font-weight": 400,
752
- "white-space": "nowrap",
753
- color: "var(--color-text-1)",
754
- },
755
- "sub-items_levoGroup": {
756
- display: "flex",
757
- padding: "4xs",
758
- "flex-direction": "column",
759
- "column-gap": "0",
760
- "row-gap": "0",
761
- "border-width": "1px",
762
- "outline-style": "none",
763
- width: "fit-content",
764
- "background-color": "#ffffff",
765
- "box-shadow":
766
- "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
767
- },
768
- "sub-items": Array(3)
769
- .fill(0)
770
- .map((_, index) => ({
771
- "sub-item-link": {
772
- display: "flex",
773
- "padding-top": "sm",
774
- "padding-bottom": "sm",
775
- "padding-left": "sm",
776
- "padding-right": "sm",
777
- "column-gap": "sm",
778
- "align-items": "center",
779
- "border-radius": "base",
780
- width: "100%",
781
- _hover: {
782
- "background-color": "rgba(241 245 249 / 0.5)",
783
- },
784
- },
785
- "sub-item-icon-container": {
786
- "aspect-ratio": "1",
787
- display: "flex",
788
- "justify-content": "center",
789
- "align-items": "center",
790
- "border-radius": "base",
791
- height: "41.4px",
792
- width: "41.4px",
793
- "background-color": "rgb(241 245 249 / 1)",
794
- },
795
- "sub-item-icon": {
796
- "object-fit": "contain",
797
- width: "24px",
798
- height: "24px",
799
- },
800
- "sub-item-text-container": {
801
- display: "flex",
802
- "flex-direction": "column",
803
- flex: "1 1 0%",
804
- "row-gap": "5xs",
805
- },
806
- "sub-item-title": {
807
- "font-size": "sm",
808
- "line-height": 1.625,
809
- "font-weight": 600,
810
- color: "var(--color-text-1)",
811
- },
812
- "sub-item-description": {
813
- "font-size": "xs",
814
- "line-height": 1.375,
815
- "font-weight": 400,
816
- color: "var(--color-text-2)",
817
- },
818
- })),
819
- })),
724
+
820
725
  "desktop-cta-group_levoGroup": {
821
726
  display: "flex",
822
727
  "column-gap": "sm",
@@ -867,103 +772,6 @@ export const Navbar1: IBlock = {
867
772
  "box-shadow": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
868
773
  transform: "translate(-50%, 0) rotate(0) skewX(0) skewY(0) scaleX(1) scaleY(1)",
869
774
  },
870
- "mobile-nav-menu_levoGroup": {
871
- display: "flex",
872
- "flex-direction": "column",
873
- "row-gap": "2xs",
874
- },
875
- "mobile-nav-menu": Array(3)
876
- .fill(0)
877
- .map(() => ({
878
- "nav-item-title-container": {
879
- width: "100%",
880
- },
881
- "nav-item-title": {
882
- "padding-top": "2xs",
883
- "padding-bottom": "2xs",
884
- "column-gap": "2xs",
885
- "justify-content": "flex-start",
886
- width: "100%",
887
-
888
- color: "text-1",
889
- },
890
- "nav-item-dropdown-container": {
891
- display: "flex",
892
- "flex-direction": "column",
893
- width: "100%",
894
- },
895
- "nav-item-dropdown-trigger": {
896
- display: "flex",
897
- "padding-top": "2xs",
898
- "padding-bottom": "2xs",
899
- "column-gap": "2xs",
900
- "justify-content": "space-between",
901
- "align-items": "center",
902
- width: "100%",
903
- "font-size": "lg",
904
- "line-height": 1.625,
905
- "font-weight": 600,
906
- cursor: "pointer",
907
- },
908
- "nav-item-dropdown-trigger-title": {
909
- "font-size": "lg",
910
- "line-height": "28px",
911
- "font-weight": 600,
912
- color: "var(--color-text-1)",
913
- },
914
- "sub-items_levoGroup": {
915
- display: "flex",
916
- "flex-direction": "column",
917
- "row-gap": "4xs",
918
- width: "100%",
919
- },
920
- "sub-items": Array(3)
921
- .fill(0)
922
- .map(() => ({
923
- "sub-item-link": {
924
- display: "flex",
925
- "padding-top": "2xs",
926
- "padding-bottom": "2xs",
927
- "padding-left": "2xs",
928
- "padding-right": "2xs",
929
- "column-gap": "sm",
930
- "align-items": "center",
931
- "border-radius": "base",
932
- width: "100%",
933
- },
934
- "sub-item-icon-container": {
935
- "aspect-ratio": "1 / 1",
936
- display: "flex",
937
- "justify-content": "center",
938
- "align-items": "center",
939
- "border-radius": "base",
940
- },
941
- "sub-item-icon": {
942
- "object-fit": "contain",
943
- width: "24px",
944
- height: "24px",
945
- },
946
- "sub-item-text-container": {
947
- display: "flex",
948
- "flex-direction": "column",
949
- flex: "1 1 0%",
950
- "row-gap": "4xs",
951
- },
952
- "sub-item-title-container": {},
953
- "sub-item-title": {
954
- "font-size": "base",
955
- "line-height": 1.2,
956
- "font-weight": 600,
957
- color: "var(--color-text-1)",
958
- },
959
- "sub-item-description": {
960
- "font-size": "sm",
961
- "line-height": 1.375,
962
- "font-weight": 400,
963
- color: "var(--color-text-2)",
964
- },
965
- })),
966
- })),
967
775
  "mobile-cta-group_levoGroup": {
968
776
  "margin-top": "2xs",
969
777
  width: "100%",
@@ -1007,6 +815,8 @@ export const Navbar1: IBlock = {
1007
815
  key: "full-width",
1008
816
  title: "Full Width",
1009
817
  styles: {
818
+ ...DESKTOP_NAV_MENU_STYLE_GROUP,
819
+ ...MOBILE_NAV_MENU_STYLE_GROUP,
1010
820
  layout: {
1011
821
  position: "fixed",
1012
822
  top: "0",
@@ -1028,103 +838,6 @@ export const Navbar1: IBlock = {
1028
838
  "nav-logo": {
1029
839
  height: "36px",
1030
840
  },
1031
- "desktop-nav-menu_levoGroup": {
1032
- display: "flex",
1033
- "align-items": "center",
1034
- "column-gap": "7xl",
1035
- tablet: {
1036
- display: "none",
1037
- },
1038
- },
1039
- "desktop-nav-menu": Array(3)
1040
- .fill(0)
1041
- .map(() => ({
1042
- "nav-item-title": {
1043
- width: "fit-content",
1044
- "font-size": "base",
1045
- "font-weight": 400,
1046
- "white-space": "nowrap",
1047
- color: "text-1",
1048
- },
1049
- "nav-item-dropdown-trigger": {
1050
- display: "flex",
1051
- "column-gap": "2xs",
1052
- "align-items": "center",
1053
- cursor: "pointer",
1054
- },
1055
- "nav-item-dropdown-trigger-title": {
1056
- width: "fit-content",
1057
- "font-size": "base",
1058
- "line-height": 1.5,
1059
- "font-weight": 400,
1060
- "white-space": "nowrap",
1061
- color: "var(--color-text-1)",
1062
- },
1063
- "sub-items_levoGroup": {
1064
- display: "flex",
1065
- padding: "4xs",
1066
- "flex-direction": "column",
1067
- "column-gap": "0",
1068
- "row-gap": "0",
1069
- "border-width": "1px",
1070
- "outline-style": "none",
1071
- width: "fit-content",
1072
- "background-color": "#ffffff",
1073
- "box-shadow":
1074
- "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
1075
- },
1076
- "sub-items": Array(3)
1077
- .fill(0)
1078
- .map(() => ({
1079
- "sub-item-link": {
1080
- display: "flex",
1081
- "padding-top": "sm",
1082
- "padding-bottom": "sm",
1083
- "padding-left": "sm",
1084
- "padding-right": "sm",
1085
- "column-gap": "sm",
1086
- "align-items": "center",
1087
- "border-radius": "base",
1088
- width: "100%",
1089
- _hover: {
1090
- "background-color": "rgba(241 245 249 / 0.5)",
1091
- },
1092
- },
1093
- "sub-item-icon-container": {
1094
- "aspect-ratio": "1",
1095
- display: "flex",
1096
- "justify-content": "center",
1097
- "align-items": "center",
1098
- "border-radius": "base",
1099
- height: "41.4px",
1100
- width: "41.4px",
1101
- "background-color": "rgb(241 245 249 / 1)",
1102
- },
1103
- "sub-item-icon": {
1104
- "object-fit": "contain",
1105
- width: "24px",
1106
- height: "24px",
1107
- },
1108
- "sub-item-text-container": {
1109
- display: "flex",
1110
- "flex-direction": "column",
1111
- flex: "1 1 0%",
1112
- "row-gap": "5xs",
1113
- },
1114
- "sub-item-title": {
1115
- "font-size": "sm",
1116
- "line-height": 1.625,
1117
- "font-weight": 600,
1118
- color: "var(--color-text-1)",
1119
- },
1120
- "sub-item-description": {
1121
- "font-size": "xs",
1122
- "line-height": 1.375,
1123
- "font-weight": 400,
1124
- color: "var(--color-text-2)",
1125
- },
1126
- })),
1127
- })),
1128
841
  "desktop-cta-group_levoGroup": {
1129
842
  display: "flex",
1130
843
  "column-gap": "sm",
@@ -1175,103 +888,6 @@ export const Navbar1: IBlock = {
1175
888
  "box-shadow": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
1176
889
  transform: "translate(-50%, 0) rotate(0) skewX(0) skewY(0) scaleX(1) scaleY(1)",
1177
890
  },
1178
- "mobile-nav-menu_levoGroup": {
1179
- display: "flex",
1180
- "flex-direction": "column",
1181
- "row-gap": "2xs",
1182
- },
1183
- "mobile-nav-menu": Array(3)
1184
- .fill(0)
1185
- .map(() => ({
1186
- "nav-item-title-container": {
1187
- width: "100%",
1188
- },
1189
- "nav-item-title": {
1190
- "padding-top": "2xs",
1191
- "padding-bottom": "2xs",
1192
- "column-gap": "2xs",
1193
- "justify-content": "flex-start",
1194
- width: "100%",
1195
-
1196
- color: "text-1",
1197
- },
1198
- "nav-item-dropdown-container": {
1199
- display: "flex",
1200
- "flex-direction": "column",
1201
- width: "100%",
1202
- },
1203
- "nav-item-dropdown-trigger": {
1204
- display: "flex",
1205
- "padding-top": "2xs",
1206
- "padding-bottom": "2xs",
1207
- "column-gap": "2xs",
1208
- "justify-content": "space-between",
1209
- "align-items": "center",
1210
- width: "100%",
1211
- "font-size": "lg",
1212
- "line-height": 1.625,
1213
- "font-weight": 600,
1214
- cursor: "pointer",
1215
- },
1216
- "nav-item-dropdown-trigger-title": {
1217
- "font-size": "lg",
1218
- "line-height": "28px",
1219
- "font-weight": 600,
1220
- color: "var(--color-text-1)",
1221
- },
1222
- "sub-items_levoGroup": {
1223
- display: "flex",
1224
- "flex-direction": "column",
1225
- "row-gap": "4xs",
1226
- width: "100%",
1227
- },
1228
- "sub-items": Array(3)
1229
- .fill(0)
1230
- .map(() => ({
1231
- "sub-item-link": {
1232
- display: "flex",
1233
- "padding-top": "2xs",
1234
- "padding-bottom": "2xs",
1235
- "padding-left": "2xs",
1236
- "padding-right": "2xs",
1237
- "column-gap": "sm",
1238
- "align-items": "center",
1239
- "border-radius": "base",
1240
- width: "100%",
1241
- },
1242
- "sub-item-icon-container": {
1243
- "aspect-ratio": "1 / 1",
1244
- display: "flex",
1245
- "justify-content": "center",
1246
- "align-items": "center",
1247
- "border-radius": "base",
1248
- },
1249
- "sub-item-icon": {
1250
- "object-fit": "contain",
1251
- width: "24px",
1252
- height: "24px",
1253
- },
1254
- "sub-item-text-container": {
1255
- display: "flex",
1256
- "flex-direction": "column",
1257
- flex: "1 1 0%",
1258
- "row-gap": "4xs",
1259
- },
1260
- "sub-item-title-container": {},
1261
- "sub-item-title": {
1262
- "font-size": "base",
1263
- "line-height": 1.2,
1264
- "font-weight": 600,
1265
- color: "var(--color-text-1)",
1266
- },
1267
- "sub-item-description": {
1268
- "font-size": "sm",
1269
- "line-height": 1.375,
1270
- "font-weight": 400,
1271
- color: "var(--color-text-2)",
1272
- },
1273
- })),
1274
- })),
1275
891
  "mobile-cta-group_levoGroup": {
1276
892
  "margin-top": "2xs",
1277
893
  width: "100%",
@@ -1318,6 +934,8 @@ export const Navbar1: IBlock = {
1318
934
  key: "full-width-search",
1319
935
  title: "Full Width with Search",
1320
936
  styles: {
937
+ ...DESKTOP_NAV_MENU_STYLE_GROUP,
938
+ ...MOBILE_NAV_MENU_STYLE_GROUP,
1321
939
  layout: {
1322
940
  position: "fixed",
1323
941
  top: "0",
@@ -1339,103 +957,6 @@ export const Navbar1: IBlock = {
1339
957
  "nav-logo": {
1340
958
  height: "36px",
1341
959
  },
1342
- "desktop-nav-menu_levoGroup": {
1343
- display: "flex",
1344
- "align-items": "center",
1345
- "column-gap": "7xl",
1346
- tablet: {
1347
- display: "none",
1348
- },
1349
- },
1350
- "desktop-nav-menu": Array(3)
1351
- .fill(0)
1352
- .map(() => ({
1353
- "nav-item-title": {
1354
- width: "fit-content",
1355
- "font-size": "base",
1356
- "font-weight": 400,
1357
- "white-space": "nowrap",
1358
- color: "text-1",
1359
- },
1360
- "nav-item-dropdown-trigger": {
1361
- display: "flex",
1362
- "column-gap": "2xs",
1363
- "align-items": "center",
1364
- cursor: "pointer",
1365
- },
1366
- "nav-item-dropdown-trigger-title": {
1367
- width: "fit-content",
1368
- "font-size": "base",
1369
- "line-height": 1.5,
1370
- "font-weight": 400,
1371
- "white-space": "nowrap",
1372
- color: "var(--color-text-1)",
1373
- },
1374
- "sub-items_levoGroup": {
1375
- display: "flex",
1376
- padding: "4xs",
1377
- "flex-direction": "column",
1378
- "column-gap": "0",
1379
- "row-gap": "0",
1380
- "border-width": "1px",
1381
- "outline-style": "none",
1382
- width: "fit-content",
1383
- "background-color": "#ffffff",
1384
- "box-shadow":
1385
- "0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05)",
1386
- },
1387
- "sub-items": Array(3)
1388
- .fill(0)
1389
- .map(() => ({
1390
- "sub-item-link": {
1391
- display: "flex",
1392
- "padding-top": "sm",
1393
- "padding-bottom": "sm",
1394
- "padding-left": "sm",
1395
- "padding-right": "sm",
1396
- "column-gap": "sm",
1397
- "align-items": "center",
1398
- "border-radius": "base",
1399
- width: "100%",
1400
- _hover: {
1401
- "background-color": "rgba(241 245 249 / 0.5)",
1402
- },
1403
- },
1404
- "sub-item-icon-container": {
1405
- "aspect-ratio": "1",
1406
- display: "flex",
1407
- "justify-content": "center",
1408
- "align-items": "center",
1409
- "border-radius": "base",
1410
- height: "41.4px",
1411
- width: "41.4px",
1412
- "background-color": "rgb(241 245 249 / 1)",
1413
- },
1414
- "sub-item-icon": {
1415
- "object-fit": "contain",
1416
- width: "24px",
1417
- height: "24px",
1418
- },
1419
- "sub-item-text-container": {
1420
- display: "flex",
1421
- "flex-direction": "column",
1422
- flex: "1 1 0%",
1423
- "row-gap": "5xs",
1424
- },
1425
- "sub-item-title": {
1426
- "font-size": "sm",
1427
- "line-height": 1.625,
1428
- "font-weight": 600,
1429
- color: "var(--color-text-1)",
1430
- },
1431
- "sub-item-description": {
1432
- "font-size": "xs",
1433
- "line-height": 1.375,
1434
- "font-weight": 400,
1435
- color: "var(--color-text-2)",
1436
- },
1437
- })),
1438
- })),
1439
960
  "desktop-cta-group_levoGroup": {
1440
961
  display: "flex",
1441
962
  "column-gap": "sm",
@@ -1486,103 +1007,6 @@ export const Navbar1: IBlock = {
1486
1007
  "box-shadow": "0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06)",
1487
1008
  transform: "translate(-50%, 0) rotate(0) skewX(0) skewY(0) scaleX(1) scaleY(1)",
1488
1009
  },
1489
- "mobile-nav-menu_levoGroup": {
1490
- display: "flex",
1491
- "flex-direction": "column",
1492
- "row-gap": "2xs",
1493
- },
1494
- "mobile-nav-menu": Array(3)
1495
- .fill(0)
1496
- .map(() => ({
1497
- "nav-item-title-container": {
1498
- width: "100%",
1499
- },
1500
- "nav-item-title": {
1501
- "padding-top": "2xs",
1502
- "padding-bottom": "2xs",
1503
- "column-gap": "2xs",
1504
- "justify-content": "flex-start",
1505
- width: "100%",
1506
-
1507
- color: "text-1",
1508
- },
1509
- "nav-item-dropdown-container": {
1510
- display: "flex",
1511
- "flex-direction": "column",
1512
- width: "100%",
1513
- },
1514
- "nav-item-dropdown-trigger": {
1515
- display: "flex",
1516
- "padding-top": "2xs",
1517
- "padding-bottom": "2xs",
1518
- "column-gap": "2xs",
1519
- "justify-content": "space-between",
1520
- "align-items": "center",
1521
- width: "100%",
1522
- "font-size": "lg",
1523
- "line-height": 1.625,
1524
- "font-weight": 600,
1525
- cursor: "pointer",
1526
- },
1527
- "nav-item-dropdown-trigger-title": {
1528
- "font-size": "lg",
1529
- "line-height": "28px",
1530
- "font-weight": 600,
1531
- color: "var(--color-text-1)",
1532
- },
1533
- "sub-items_levoGroup": {
1534
- display: "flex",
1535
- "flex-direction": "column",
1536
- "row-gap": "4xs",
1537
- width: "100%",
1538
- },
1539
- "sub-items": Array(3)
1540
- .fill(0)
1541
- .map(() => ({
1542
- "sub-item-link": {
1543
- display: "flex",
1544
- "padding-top": "2xs",
1545
- "padding-bottom": "2xs",
1546
- "padding-left": "2xs",
1547
- "padding-right": "2xs",
1548
- "column-gap": "sm",
1549
- "align-items": "center",
1550
- "border-radius": "base",
1551
- width: "100%",
1552
- },
1553
- "sub-item-icon-container": {
1554
- "aspect-ratio": "1 / 1",
1555
- display: "flex",
1556
- "justify-content": "center",
1557
- "align-items": "center",
1558
- "border-radius": "base",
1559
- },
1560
- "sub-item-icon": {
1561
- "object-fit": "contain",
1562
- width: "24px",
1563
- height: "24px",
1564
- },
1565
- "sub-item-text-container": {
1566
- display: "flex",
1567
- "flex-direction": "column",
1568
- flex: "1 1 0%",
1569
- "row-gap": "4xs",
1570
- },
1571
- "sub-item-title-container": {},
1572
- "sub-item-title": {
1573
- "font-size": "base",
1574
- "line-height": 1.2,
1575
- "font-weight": 600,
1576
- color: "var(--color-text-1)",
1577
- },
1578
- "sub-item-description": {
1579
- "font-size": "sm",
1580
- "line-height": 1.375,
1581
- "font-weight": 400,
1582
- color: "var(--color-text-2)",
1583
- },
1584
- })),
1585
- })),
1586
1010
  "mobile-cta-group_levoGroup": {
1587
1011
  "margin-top": "2xs",
1588
1012
  width: "100%",