@citygross/components_v2 0.0.11 → 0.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.
- package/dist/components/AlertBox/AlertBox.css.ts.vanilla.css +87 -0
- package/dist/components/AlertBox/AlertBox.css.vanilla.js +10 -0
- package/dist/components/AlertBox/AlertBox.d.ts +17 -0
- package/dist/components/AlertBox/AlertBox.js +38 -0
- package/dist/components/Box/Box.js +33 -16
- package/dist/components/BoxArrow/BoxArrow.css.ts.vanilla.css +154 -0
- package/dist/components/BoxArrow/BoxArrow.css.vanilla.js +6 -0
- package/dist/components/BoxArrow/BoxArrow.js +19 -0
- package/dist/components/CartItemSummary/CartItemSummary.css.ts.vanilla.css +23 -0
- package/dist/components/CartItemSummary/CartItemSummary.css.vanilla.js +8 -0
- package/dist/components/CartItemSummary/CartItemSummary.d.ts +15 -0
- package/dist/components/CartItemSummary/CartItemSummary.js +31 -0
- package/dist/components/CartSummary/CartSummary.css.ts.vanilla.css +34 -0
- package/dist/components/CartSummary/CartSummary.css.vanilla.js +11 -0
- package/dist/components/CartSummary/CartSummary.d.ts +26 -0
- package/dist/components/CartSummary/CartSummary.js +60 -0
- package/dist/components/Divider/Divider.css.ts.vanilla.css +6 -0
- package/dist/components/Divider/Divider.css.vanilla.js +7 -0
- package/dist/components/Divider/Divider.d.ts +9 -0
- package/dist/components/Divider/Divider.js +10 -0
- package/dist/components/Dot/Dot.css.ts.vanilla.css +8 -0
- package/dist/components/Dot/Dot.css.vanilla.js +7 -0
- package/dist/components/Dot/Dot.d.ts +9 -0
- package/dist/components/Dot/Dot.js +16 -0
- package/dist/components/FormControl/FormControl.css.ts.vanilla.css +21 -0
- package/dist/components/FormControl/FormControl.css.vanilla.js +7 -0
- package/dist/components/FormControl/FormControl.d.ts +17 -0
- package/dist/components/FormControl/FormControl.js +21 -0
- package/dist/components/Input/Input.css.ts.vanilla.css +60 -0
- package/dist/components/Input/Input.css.vanilla.js +9 -0
- package/dist/components/Input/Input.d.ts +16 -0
- package/dist/components/Input/Input.js +49 -0
- package/dist/components/ListItem/ListItem.css.ts.vanilla.css +72 -0
- package/dist/components/ListItem/ListItem.css.vanilla.js +11 -0
- package/dist/components/ListItem/ListItem.d.ts +29 -0
- package/dist/components/ListItem/ListItem.js +92 -0
- package/dist/components/ListItem/assets/fallback_grocery.js +3 -0
- package/dist/components/Skeleton/Skeleton.css.ts.vanilla.css +164 -0
- package/dist/components/Skeleton/Skeleton.css.vanilla.js +7 -0
- package/dist/components/Skeleton/Skeleton.d.ts +10 -0
- package/dist/components/Skeleton/Skeleton.js +22 -0
- package/dist/components/Spacer/Spacer.css.ts.vanilla.css +3 -0
- package/dist/components/Spacer/Spacer.css.vanilla.js +7 -0
- package/dist/components/Spacer/Spacer.d.ts +9 -0
- package/dist/components/Spacer/Spacer.js +6 -0
- package/dist/components/Spinner/Spinner.css.ts.vanilla.css +171 -0
- package/dist/components/Spinner/Spinner.css.vanilla.js +7 -0
- package/dist/components/Spinner/Spinner.d.ts +10 -0
- package/dist/components/Spinner/Spinner.js +17 -0
- package/dist/components/TimeLine/TimeLine.css.ts.vanilla.css +178 -0
- package/dist/components/TimeLine/TimeLine.css.vanilla.js +9 -0
- package/dist/components/TimeLine/TimeLine.d.ts +25 -0
- package/dist/components/TimeLine/TimeLine.js +53 -0
- package/dist/cssUtils/border.css.d.ts +4 -0
- package/dist/cssUtils/border.css.vanilla.js +6 -0
- package/dist/cssUtils/color.css.d.ts +6 -0
- package/dist/cssUtils/color.css.vanilla.js +8 -0
- package/dist/cssUtils/spacings.css.d.ts +9 -0
- package/dist/cssUtils/spacings.css.ts.vanilla.css +0 -66
- package/dist/cssUtils/spacings.css.vanilla.js +11 -0
- package/dist/cssUtils/typography.css.d.ts +5 -0
- package/dist/cssUtils/typography.css.ts.vanilla.css +100 -0
- package/dist/index.d.ts +16 -0
- package/dist/index.js +19 -0
- package/dist/typography/BodyText/BodyText.css.vanilla.js +8 -0
- package/dist/typography/BodyText/BodyText.d.ts +16 -0
- package/dist/typography/BodyText/BodyText.js +28 -0
- package/dist/typography/H3/H3.css.ts.vanilla.css +4 -0
- package/dist/typography/H3/H3.css.vanilla.js +8 -0
- package/dist/typography/H3/H3.js +24 -0
- package/package.json +2 -2
|
@@ -610,72 +610,6 @@
|
|
|
610
610
|
padding-bottom: 0px;
|
|
611
611
|
padding-top: 0px;
|
|
612
612
|
}
|
|
613
|
-
.spacings_spacingsToCssMapper_xxxs__e0awtz2c {
|
|
614
|
-
height: 2px;
|
|
615
|
-
}
|
|
616
|
-
.spacings_spacingsToCssMapper_xxs__e0awtz2d {
|
|
617
|
-
height: 4px;
|
|
618
|
-
}
|
|
619
|
-
.spacings_spacingsToCssMapper_xxs2__e0awtz2e {
|
|
620
|
-
height: 6px;
|
|
621
|
-
}
|
|
622
|
-
.spacings_spacingsToCssMapper_xs__e0awtz2f {
|
|
623
|
-
height: 8px;
|
|
624
|
-
}
|
|
625
|
-
.spacings_spacingsToCssMapper_xs2__e0awtz2g {
|
|
626
|
-
height: 12px;
|
|
627
|
-
}
|
|
628
|
-
.spacings_spacingsToCssMapper_sm__e0awtz2h {
|
|
629
|
-
height: 16px;
|
|
630
|
-
}
|
|
631
|
-
.spacings_spacingsToCssMapper_sm2__e0awtz2i {
|
|
632
|
-
height: 20px;
|
|
633
|
-
}
|
|
634
|
-
.spacings_spacingsToCssMapper_md__e0awtz2j {
|
|
635
|
-
height: 24px;
|
|
636
|
-
}
|
|
637
|
-
.spacings_spacingsToCssMapper_lg__e0awtz2k {
|
|
638
|
-
height: 32px;
|
|
639
|
-
}
|
|
640
|
-
.spacings_spacingsToCssMapper_xl__e0awtz2l {
|
|
641
|
-
height: 40px;
|
|
642
|
-
}
|
|
643
|
-
.spacings_spacingsToCssMapper_xxl__e0awtz2m {
|
|
644
|
-
height: 56px;
|
|
645
|
-
}
|
|
646
|
-
.spacings_spacingsToCssMapper_xxxs__e0awtz2n {
|
|
647
|
-
width: 2px;
|
|
648
|
-
}
|
|
649
|
-
.spacings_spacingsToCssMapper_xxs__e0awtz2o {
|
|
650
|
-
width: 4px;
|
|
651
|
-
}
|
|
652
|
-
.spacings_spacingsToCssMapper_xxs2__e0awtz2p {
|
|
653
|
-
width: 6px;
|
|
654
|
-
}
|
|
655
|
-
.spacings_spacingsToCssMapper_xs__e0awtz2q {
|
|
656
|
-
width: 8px;
|
|
657
|
-
}
|
|
658
|
-
.spacings_spacingsToCssMapper_xs2__e0awtz2r {
|
|
659
|
-
width: 12px;
|
|
660
|
-
}
|
|
661
|
-
.spacings_spacingsToCssMapper_sm__e0awtz2s {
|
|
662
|
-
width: 16px;
|
|
663
|
-
}
|
|
664
|
-
.spacings_spacingsToCssMapper_sm2__e0awtz2t {
|
|
665
|
-
width: 20px;
|
|
666
|
-
}
|
|
667
|
-
.spacings_spacingsToCssMapper_md__e0awtz2u {
|
|
668
|
-
width: 24px;
|
|
669
|
-
}
|
|
670
|
-
.spacings_spacingsToCssMapper_lg__e0awtz2v {
|
|
671
|
-
width: 32px;
|
|
672
|
-
}
|
|
673
|
-
.spacings_spacingsToCssMapper_xl__e0awtz2w {
|
|
674
|
-
width: 40px;
|
|
675
|
-
}
|
|
676
|
-
.spacings_spacingsToCssMapper_xxl__e0awtz2x {
|
|
677
|
-
width: 56px;
|
|
678
|
-
}
|
|
679
613
|
@media (min-width: 960px) {
|
|
680
614
|
.spacings_margin_xxxs__e0awtz0 {
|
|
681
615
|
margin: 2px;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
import './spacings.css.ts.vanilla.css';
|
|
2
|
+
|
|
3
|
+
var margin = { xxxs: "spacings_margin_xxxs__e0awtz0", xxs: "spacings_margin_xxs__e0awtz1", xxs2: "spacings_margin_xxs2__e0awtz2", xs: "spacings_margin_xs__e0awtz3", xs2: "spacings_margin_xs2__e0awtz4", sm: "spacings_margin_sm__e0awtz5", sm2: "spacings_margin_sm2__e0awtz6", md: "spacings_margin_md__e0awtz7", lg: "spacings_margin_lg__e0awtz8", xl: "spacings_margin_xl__e0awtz9", xxl: "spacings_margin_xxl__e0awtza", false: "spacings_margin_false__e0awtzb" };
|
|
4
|
+
var marginBottomDynamic = { xxxs: "spacings_marginBottomDynamic_xxxs__e0awtz10", xxs: "spacings_marginBottomDynamic_xxs__e0awtz11", xxs2: "spacings_marginBottomDynamic_xxs2__e0awtz12", xs: "spacings_marginBottomDynamic_xs__e0awtz13", xs2: "spacings_marginBottomDynamic_xs2__e0awtz14", sm: "spacings_marginBottomDynamic_sm__e0awtz15", sm2: "spacings_marginBottomDynamic_sm2__e0awtz16", md: "spacings_marginBottomDynamic_md__e0awtz17", lg: "spacings_marginBottomDynamic_lg__e0awtz18", xl: "spacings_marginBottomDynamic_xl__e0awtz19", xxl: "spacings_marginBottomDynamic_xxl__e0awtz1a", false: "spacings_marginBottomDynamic_false__e0awtz1b" };
|
|
5
|
+
var marginHorizontal = { xxxs: "spacings_marginHorizontal_xxxs__e0awtzc", xxs: "spacings_marginHorizontal_xxs__e0awtzd", xxs2: "spacings_marginHorizontal_xxs2__e0awtze", xs: "spacings_marginHorizontal_xs__e0awtzf", xs2: "spacings_marginHorizontal_xs2__e0awtzg", sm: "spacings_marginHorizontal_sm__e0awtzh", sm2: "spacings_marginHorizontal_sm2__e0awtzi", md: "spacings_marginHorizontal_md__e0awtzj", lg: "spacings_marginHorizontal_lg__e0awtzk", xl: "spacings_marginHorizontal_xl__e0awtzl", xxl: "spacings_marginHorizontal_xxl__e0awtzm", false: "spacings_marginHorizontal_false__e0awtzn" };
|
|
6
|
+
var marginVertical = { xxxs: "spacings_marginVertical_xxxs__e0awtzo", xxs: "spacings_marginVertical_xxs__e0awtzp", xxs2: "spacings_marginVertical_xxs2__e0awtzq", xs: "spacings_marginVertical_xs__e0awtzr", xs2: "spacings_marginVertical_xs2__e0awtzs", sm: "spacings_marginVertical_sm__e0awtzt", sm2: "spacings_marginVertical_sm2__e0awtzu", md: "spacings_marginVertical_md__e0awtzv", lg: "spacings_marginVertical_lg__e0awtzw", xl: "spacings_marginVertical_xl__e0awtzx", xxl: "spacings_marginVertical_xxl__e0awtzy", false: "spacings_marginVertical_false__e0awtzz" };
|
|
7
|
+
var padding = { xxxs: "spacings_padding_xxxs__e0awtz1c", xxs: "spacings_padding_xxs__e0awtz1d", xxs2: "spacings_padding_xxs2__e0awtz1e", xs: "spacings_padding_xs__e0awtz1f", xs2: "spacings_padding_xs2__e0awtz1g", sm: "spacings_padding_sm__e0awtz1h", sm2: "spacings_padding_sm2__e0awtz1i", md: "spacings_padding_md__e0awtz1j", lg: "spacings_padding_lg__e0awtz1k", xl: "spacings_padding_xl__e0awtz1l", xxl: "spacings_padding_xxl__e0awtz1m", false: "spacings_padding_false__e0awtz1n" };
|
|
8
|
+
var paddingHorizontal = { xxxs: "spacings_paddingHorizontal_xxxs__e0awtz1o", xxs: "spacings_paddingHorizontal_xxs__e0awtz1p", xxs2: "spacings_paddingHorizontal_xxs2__e0awtz1q", xs: "spacings_paddingHorizontal_xs__e0awtz1r", xs2: "spacings_paddingHorizontal_xs2__e0awtz1s", sm: "spacings_paddingHorizontal_sm__e0awtz1t", sm2: "spacings_paddingHorizontal_sm2__e0awtz1u", md: "spacings_paddingHorizontal_md__e0awtz1v", lg: "spacings_paddingHorizontal_lg__e0awtz1w", xl: "spacings_paddingHorizontal_xl__e0awtz1x", xxl: "spacings_paddingHorizontal_xxl__e0awtz1y", false: "spacings_paddingHorizontal_false__e0awtz1z" };
|
|
9
|
+
var paddingVertical = { xxxs: "spacings_paddingVertical_xxxs__e0awtz20", xxs: "spacings_paddingVertical_xxs__e0awtz21", xxs2: "spacings_paddingVertical_xxs2__e0awtz22", xs: "spacings_paddingVertical_xs__e0awtz23", xs2: "spacings_paddingVertical_xs2__e0awtz24", sm: "spacings_paddingVertical_sm__e0awtz25", sm2: "spacings_paddingVertical_sm2__e0awtz26", md: "spacings_paddingVertical_md__e0awtz27", lg: "spacings_paddingVertical_lg__e0awtz28", xl: "spacings_paddingVertical_xl__e0awtz29", xxl: "spacings_paddingVertical_xxl__e0awtz2a", false: "spacings_paddingVertical_false__e0awtz2b" };
|
|
10
|
+
|
|
11
|
+
export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical };
|
|
@@ -0,0 +1,100 @@
|
|
|
1
|
+
.typography_fontFamily_primary__xithyt0 {
|
|
2
|
+
font-family: "Poppins", "Helvetica Neue", Helvetica, Arial, sans-serif;
|
|
3
|
+
}
|
|
4
|
+
.typography_fontFamily_display__xithyt1 {
|
|
5
|
+
font-family: "Dom Casual";
|
|
6
|
+
}
|
|
7
|
+
.typography_fontFamily_code__xithyt2 {
|
|
8
|
+
font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, Courier, monospace;
|
|
9
|
+
}
|
|
10
|
+
.typography_fontSize_xs__xithyt3 {
|
|
11
|
+
font-size: 10px;
|
|
12
|
+
}
|
|
13
|
+
.typography_fontSize_s1__xithyt4 {
|
|
14
|
+
font-size: 12px;
|
|
15
|
+
}
|
|
16
|
+
.typography_fontSize_s2__xithyt5 {
|
|
17
|
+
font-size: 13px;
|
|
18
|
+
}
|
|
19
|
+
.typography_fontSize_s3__xithyt6 {
|
|
20
|
+
font-size: 15px;
|
|
21
|
+
}
|
|
22
|
+
.typography_fontSize_s4__xithyt7 {
|
|
23
|
+
font-size: 18px;
|
|
24
|
+
}
|
|
25
|
+
.typography_fontSize_m1__xithyt8 {
|
|
26
|
+
font-size: 24px;
|
|
27
|
+
}
|
|
28
|
+
.typography_fontSize_m2__xithyt9 {
|
|
29
|
+
font-size: 30px;
|
|
30
|
+
}
|
|
31
|
+
.typography_fontSize_l1__xithyta {
|
|
32
|
+
font-size: 41px;
|
|
33
|
+
}
|
|
34
|
+
.typography_fontSize_code__xithytb {
|
|
35
|
+
font-size: 90px;
|
|
36
|
+
}
|
|
37
|
+
.typography_fontWeight_regular__xithytc {
|
|
38
|
+
font-weight: 400;
|
|
39
|
+
}
|
|
40
|
+
.typography_fontWeight_medium__xithytd {
|
|
41
|
+
font-weight: 500;
|
|
42
|
+
}
|
|
43
|
+
.typography_fontWeight_semiBold__xithyte {
|
|
44
|
+
font-weight: 600;
|
|
45
|
+
}
|
|
46
|
+
.typography_fontWeight_bold__xithytf {
|
|
47
|
+
font-weight: 700;
|
|
48
|
+
}
|
|
49
|
+
.typography_lineHeight_xs__xithytg {
|
|
50
|
+
line-height: 15px;
|
|
51
|
+
}
|
|
52
|
+
.typography_lineHeight_s1__xithyth {
|
|
53
|
+
line-height: 18px;
|
|
54
|
+
}
|
|
55
|
+
.typography_lineHeight_s2__xithyti {
|
|
56
|
+
line-height: 19px;
|
|
57
|
+
}
|
|
58
|
+
.typography_lineHeight_m1__xithytj {
|
|
59
|
+
line-height: 22px;
|
|
60
|
+
}
|
|
61
|
+
.typography_lineHeight_m2__xithytk {
|
|
62
|
+
line-height: 27px;
|
|
63
|
+
}
|
|
64
|
+
.typography_lineHeight_m3__xithytl {
|
|
65
|
+
line-height: 36px;
|
|
66
|
+
}
|
|
67
|
+
.typography_lineHeight_l1__xithytm {
|
|
68
|
+
line-height: 45px;
|
|
69
|
+
}
|
|
70
|
+
.typography_textAlign_left__xithytn {
|
|
71
|
+
text-align: left;
|
|
72
|
+
}
|
|
73
|
+
.typography_textAlign_right__xithyto {
|
|
74
|
+
text-align: right;
|
|
75
|
+
}
|
|
76
|
+
.typography_textAlign_center__xithytp {
|
|
77
|
+
text-align: center;
|
|
78
|
+
}
|
|
79
|
+
.typography_textDecoration_lineThrough__xithytq {
|
|
80
|
+
text-decoration: line-through;
|
|
81
|
+
}
|
|
82
|
+
.typography_textDecoration_underline__xithytr {
|
|
83
|
+
text-decoration: underline;
|
|
84
|
+
}
|
|
85
|
+
.typography_bodyTextSize_tiny__xithyts {
|
|
86
|
+
font-size: 10px;
|
|
87
|
+
line-height: 15px;
|
|
88
|
+
}
|
|
89
|
+
.typography_bodyTextSize_extraSmall__xithytt {
|
|
90
|
+
font-size: 13px;
|
|
91
|
+
line-height: 19px;
|
|
92
|
+
}
|
|
93
|
+
.typography_bodyTextSize_small__xithytu {
|
|
94
|
+
font-size: 12px;
|
|
95
|
+
line-height: 18px;
|
|
96
|
+
}
|
|
97
|
+
.typography_bodyTextSize_default__xithytv {
|
|
98
|
+
font-size: 15px;
|
|
99
|
+
line-height: 22px;
|
|
100
|
+
}
|
package/dist/index.d.ts
CHANGED
|
@@ -1 +1,17 @@
|
|
|
1
1
|
export { Box, TBox } from './components/Box/Box.js';
|
|
2
|
+
export { AlertBox, TAlertBox } from './components/AlertBox/AlertBox.js';
|
|
3
|
+
export { CartItemSummary, TCartItemSummary, TSummaryItem } from './components/CartItemSummary/CartItemSummary.js';
|
|
4
|
+
export { Divider, TDivider } from './components/Divider/Divider.js';
|
|
5
|
+
export { Dot, TDot } from './components/Dot/Dot.js';
|
|
6
|
+
export { FormControl, TFormControl, TScreenWidth } from './components/FormControl/FormControl.js';
|
|
7
|
+
export { Input, TInput } from './components/Input/Input.js';
|
|
8
|
+
export { EListItemAlignment, ListItem, TItem, TListItem } from './components/ListItem/ListItem.js';
|
|
9
|
+
export { TSkeleton } from './components/Skeleton/Skeleton.js';
|
|
10
|
+
export { Spacer, TSpacer } from './components/Spacer/Spacer.js';
|
|
11
|
+
export { Spinner, TSpinner } from './components/Spinner/Spinner.js';
|
|
12
|
+
export { TTimeline, TTimelineItem, Timeline } from './components/TimeLine/TimeLine.js';
|
|
13
|
+
export { BodyText, TBodyText } from './typography/BodyText/BodyText.js';
|
|
14
|
+
export { borderColor, borderRadius } from './cssUtils/border.css.js';
|
|
15
|
+
export { backgroundColor, color, hoverBackgroundColor, hoverColor } from './cssUtils/color.css.js';
|
|
16
|
+
export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical } from './cssUtils/spacings.css.js';
|
|
17
|
+
export { CartSummary, TCartSummary } from './components/CartSummary/CartSummary.js';
|
package/dist/index.js
CHANGED
|
@@ -1 +1,20 @@
|
|
|
1
1
|
export { Box } from './components/Box/Box.js';
|
|
2
|
+
export { AlertBox } from './components/AlertBox/AlertBox.js';
|
|
3
|
+
import '@citygross/icons_v2';
|
|
4
|
+
import 'react';
|
|
5
|
+
import './components/BoxArrow/BoxArrow.css.vanilla.js';
|
|
6
|
+
export { CartItemSummary } from './components/CartItemSummary/CartItemSummary.js';
|
|
7
|
+
export { Divider } from './components/Divider/Divider.js';
|
|
8
|
+
export { Dot } from './components/Dot/Dot.js';
|
|
9
|
+
export { FormControl, TScreenWidth } from './components/FormControl/FormControl.js';
|
|
10
|
+
export { Input } from './components/Input/Input.js';
|
|
11
|
+
export { EListItemAlignment, ListItem } from './components/ListItem/ListItem.js';
|
|
12
|
+
import './components/Skeleton/Skeleton.css.vanilla.js';
|
|
13
|
+
export { Spacer } from './components/Spacer/Spacer.js';
|
|
14
|
+
export { Spinner } from './components/Spinner/Spinner.js';
|
|
15
|
+
export { Timeline } from './components/TimeLine/TimeLine.js';
|
|
16
|
+
export { BodyText } from './typography/BodyText/BodyText.js';
|
|
17
|
+
export { borderColor, borderRadius } from './cssUtils/border.css.vanilla.js';
|
|
18
|
+
export { backgroundColor, color, hoverBackgroundColor, hoverColor } from './cssUtils/color.css.vanilla.js';
|
|
19
|
+
export { margin, marginBottomDynamic, marginHorizontal, marginVertical, padding, paddingHorizontal, paddingVertical } from './cssUtils/spacings.css.vanilla.js';
|
|
20
|
+
export { CartSummary } from './components/CartSummary/CartSummary.js';
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import './../../cssUtils/typography.css.ts.vanilla.css';
|
|
2
|
+
import './../../cssUtils/color.css.ts.vanilla.css';
|
|
3
|
+
import 'src/typography/BodyText/BodyText.css.ts.vanilla.css';
|
|
4
|
+
import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
|
|
5
|
+
|
|
6
|
+
var bodyTextStyle = createRuntimeFn({ defaultClassName: "BodyText__1lpefp40", variantClassNames: { fontWeight: { regular: "typography_fontWeight_regular__xithytc", medium: "typography_fontWeight_medium__xithytd", semiBold: "typography_fontWeight_semiBold__xithyte", bold: "typography_fontWeight_bold__xithytf" }, textDecoration: { lineThrough: "typography_textDecoration_lineThrough__xithytq", underline: "typography_textDecoration_underline__xithytr" }, bodyTextSize: { tiny: "typography_bodyTextSize_tiny__xithyts", extraSmall: "typography_bodyTextSize_extraSmall__xithytt", small: "typography_bodyTextSize_small__xithytu", "default": "typography_bodyTextSize_default__xithytv" }, textAlign: { left: "typography_textAlign_left__xithytn", right: "typography_textAlign_right__xithyto", center: "typography_textAlign_center__xithytp" }, color: { primary: "color_color_primary__13rr0b20", secondary: "color_color_secondary__13rr0b21", brandYellow: "color_color_brandYellow__13rr0b22", brandBlue: "color_color_brandBlue__13rr0b23", brandPurple: "color_color_brandPurple__13rr0b24", brandPrio: "color_color_brandPrio__13rr0b25", yellowLighter: "color_color_yellowLighter__13rr0b26", yellowLight: "color_color_yellowLight__13rr0b27", blueLight: "color_color_blueLight__13rr0b28", blueLighter: "color_color_blueLighter__13rr0b29", blueMedium: "color_color_blueMedium__13rr0b2a", greenLight: "color_color_greenLight__13rr0b2b", greenMedium: "color_color_greenMedium__13rr0b2c", redLight: "color_color_redLight__13rr0b2d", recipeVego: "color_color_recipeVego__13rr0b2e", recipeLactose: "color_color_recipeLactose__13rr0b2f", recipeGluten: "color_color_recipeGluten__13rr0b2g", link: "color_color_link__13rr0b2h", white: "color_color_white__13rr0b2i", black: "color_color_black__13rr0b2j", lightest: "color_color_lightest__13rr0b2k", lighter: "color_color_lighter__13rr0b2l", light: "color_color_light__13rr0b2m", medium: "color_color_medium__13rr0b2n", mediumDark: "color_color_mediumDark__13rr0b2o", dark: "color_color_dark__13rr0b2p", darker: "color_color_darker__13rr0b2q", darkest: "color_color_darkest__13rr0b2r", buttonGray: "color_color_buttonGray__13rr0b2s", disabledGray: "color_color_disabledGray__13rr0b2t", disabledDarkGray: "color_color_disabledDarkGray__13rr0b2u", placeholder: "color_color_placeholder__13rr0b2v", border: "color_color_border__13rr0b2w", boxShadow: "color_color_boxShadow__13rr0b2x", boxShadowActive: "color_color_boxShadowActive__13rr0b2y", alertRed: "color_color_alertRed__13rr0b2z", alertBlue: "color_color_alertBlue__13rr0b210", alertGreen: "color_color_alertGreen__13rr0b211", darkOverlay: "color_color_darkOverlay__13rr0b212", transparent: "color_color_transparent__13rr0b213", brandBlueHover: "color_color_brandBlueHover__13rr0b214", brandYellowHover: "color_color_brandYellowHover__13rr0b215", brandPrioHover: "color_color_brandPrioHover__13rr0b216", brandBlueActive: "color_color_brandBlueActive__13rr0b217", brandYellowActive: "color_color_brandYellowActive__13rr0b218", brandPrioActive: "color_color_brandPrioActive__13rr0b219", none: "color_color_none__13rr0b21a" } }, defaultVariants: { color: "darkest", fontWeight: "regular", bodyTextSize: "default", textAlign: "left" }, compoundVariants: [] });
|
|
7
|
+
|
|
8
|
+
export { bodyTextStyle };
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { TPaletteKeys, TFontWeightKeys } from '@citygross/design-tokens_v2';
|
|
3
|
+
import { TBodyTextSizeKeys, TTextDecoration, TTextAlign } from '../../cssUtils/typography.css.js';
|
|
4
|
+
|
|
5
|
+
declare type TBodyText = {
|
|
6
|
+
children: React.ReactNode;
|
|
7
|
+
size?: TBodyTextSizeKeys;
|
|
8
|
+
color?: TPaletteKeys;
|
|
9
|
+
textDecoration?: TTextDecoration;
|
|
10
|
+
fontWeight?: TFontWeightKeys;
|
|
11
|
+
textAlign?: TTextAlign;
|
|
12
|
+
className?: string;
|
|
13
|
+
};
|
|
14
|
+
declare const BodyText: ({ children, color, fontWeight, textDecoration, size, textAlign, className }: TBodyText) => JSX.Element;
|
|
15
|
+
|
|
16
|
+
export { BodyText, TBodyText };
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { bodyTextStyle } from './BodyText.css.vanilla.js';
|
|
3
|
+
|
|
4
|
+
const BodyText = ({
|
|
5
|
+
children,
|
|
6
|
+
color,
|
|
7
|
+
fontWeight,
|
|
8
|
+
textDecoration,
|
|
9
|
+
size,
|
|
10
|
+
textAlign,
|
|
11
|
+
className
|
|
12
|
+
}) => {
|
|
13
|
+
return /* @__PURE__ */ React.createElement(
|
|
14
|
+
"p",
|
|
15
|
+
{
|
|
16
|
+
className: `${bodyTextStyle({
|
|
17
|
+
bodyTextSize: size,
|
|
18
|
+
color,
|
|
19
|
+
textDecoration,
|
|
20
|
+
textAlign,
|
|
21
|
+
fontWeight
|
|
22
|
+
})} ${className}`
|
|
23
|
+
},
|
|
24
|
+
children
|
|
25
|
+
);
|
|
26
|
+
};
|
|
27
|
+
|
|
28
|
+
export { BodyText };
|
|
@@ -0,0 +1,8 @@
|
|
|
1
|
+
import './../../cssUtils/typography.css.ts.vanilla.css';
|
|
2
|
+
import './../../cssUtils/color.css.ts.vanilla.css';
|
|
3
|
+
import './H3.css.ts.vanilla.css';
|
|
4
|
+
import { createRuntimeFn } from '@vanilla-extract/recipes/createRuntimeFn';
|
|
5
|
+
|
|
6
|
+
var H3Styles = createRuntimeFn({ defaultClassName: "H3_H3Styles__170fb7l0", variantClassNames: { color: { primary: "color_color_primary__13rr0b20", secondary: "color_color_secondary__13rr0b21", brandYellow: "color_color_brandYellow__13rr0b22", brandBlue: "color_color_brandBlue__13rr0b23", brandPurple: "color_color_brandPurple__13rr0b24", brandPrio: "color_color_brandPrio__13rr0b25", yellowLighter: "color_color_yellowLighter__13rr0b26", yellowLight: "color_color_yellowLight__13rr0b27", blueLight: "color_color_blueLight__13rr0b28", blueLighter: "color_color_blueLighter__13rr0b29", blueMedium: "color_color_blueMedium__13rr0b2a", greenLight: "color_color_greenLight__13rr0b2b", greenMedium: "color_color_greenMedium__13rr0b2c", redLight: "color_color_redLight__13rr0b2d", recipeVego: "color_color_recipeVego__13rr0b2e", recipeLactose: "color_color_recipeLactose__13rr0b2f", recipeGluten: "color_color_recipeGluten__13rr0b2g", link: "color_color_link__13rr0b2h", white: "color_color_white__13rr0b2i", black: "color_color_black__13rr0b2j", lightest: "color_color_lightest__13rr0b2k", lighter: "color_color_lighter__13rr0b2l", light: "color_color_light__13rr0b2m", medium: "color_color_medium__13rr0b2n", mediumDark: "color_color_mediumDark__13rr0b2o", dark: "color_color_dark__13rr0b2p", darker: "color_color_darker__13rr0b2q", darkest: "color_color_darkest__13rr0b2r", buttonGray: "color_color_buttonGray__13rr0b2s", disabledGray: "color_color_disabledGray__13rr0b2t", disabledDarkGray: "color_color_disabledDarkGray__13rr0b2u", placeholder: "color_color_placeholder__13rr0b2v", border: "color_color_border__13rr0b2w", boxShadow: "color_color_boxShadow__13rr0b2x", boxShadowActive: "color_color_boxShadowActive__13rr0b2y", alertRed: "color_color_alertRed__13rr0b2z", alertBlue: "color_color_alertBlue__13rr0b210", alertGreen: "color_color_alertGreen__13rr0b211", darkOverlay: "color_color_darkOverlay__13rr0b212", transparent: "color_color_transparent__13rr0b213", brandBlueHover: "color_color_brandBlueHover__13rr0b214", brandYellowHover: "color_color_brandYellowHover__13rr0b215", brandPrioHover: "color_color_brandPrioHover__13rr0b216", brandBlueActive: "color_color_brandBlueActive__13rr0b217", brandYellowActive: "color_color_brandYellowActive__13rr0b218", brandPrioActive: "color_color_brandPrioActive__13rr0b219", none: "color_color_none__13rr0b21a" }, textDecoration: { lineThrough: "typography_textDecoration_lineThrough__xithytq", underline: "typography_textDecoration_underline__xithytr" }, fontWeight: { regular: "typography_fontWeight_regular__xithytc", medium: "typography_fontWeight_medium__xithytd", semiBold: "typography_fontWeight_semiBold__xithyte", bold: "typography_fontWeight_bold__xithytf" } }, defaultVariants: { color: "darkest", fontWeight: "medium" }, compoundVariants: [] });
|
|
7
|
+
|
|
8
|
+
export { H3Styles };
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import React from 'react';
|
|
2
|
+
import { H3Styles } from './H3.css.vanilla.js';
|
|
3
|
+
|
|
4
|
+
const H3 = ({
|
|
5
|
+
children,
|
|
6
|
+
className,
|
|
7
|
+
color,
|
|
8
|
+
fontWeight,
|
|
9
|
+
lineThrough
|
|
10
|
+
}) => {
|
|
11
|
+
return /* @__PURE__ */ React.createElement(
|
|
12
|
+
"h3",
|
|
13
|
+
{
|
|
14
|
+
className: `${H3Styles({
|
|
15
|
+
color,
|
|
16
|
+
textDecoration: lineThrough ? "lineThrough" : null,
|
|
17
|
+
fontWeight
|
|
18
|
+
})} ${className}`
|
|
19
|
+
},
|
|
20
|
+
children
|
|
21
|
+
);
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
export { H3 };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@citygross/components_v2",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.13",
|
|
4
4
|
"license": "ISC",
|
|
5
5
|
"sideEffects": false,
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -79,5 +79,5 @@
|
|
|
79
79
|
"react-slick": "^0.30.1",
|
|
80
80
|
"slick-carousel": "^1.8.1"
|
|
81
81
|
},
|
|
82
|
-
"gitHead": "
|
|
82
|
+
"gitHead": "9476c3561b771a7433debdb873a15f0c88b4aa9e"
|
|
83
83
|
}
|