hds-web 1.28.6 → 1.28.7
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.css +2 -2
- package/dist/index.es.css +2 -2
- package/dist/index.es.js +2 -2
- package/dist/index.js +2 -2
- package/package.json +1 -1
- package/src/HDS/foundation/Typography/Typography.js +1 -1
- package/src/HDS/modules/Cards/aboutSection.js +16 -17
- package/src/HDS/modules/Faq/faq.js +4 -3
- package/src/index.css +1 -0
- package/src/styles/tailwind.css +14 -8
- package/tailwind.config.js +1 -0
package/package.json
CHANGED
|
@@ -44,7 +44,7 @@ export default function Typography(props) {
|
|
|
44
44
|
'body3c-semi-bold': 'text-hds-m-body3c-semi-bold tb:text-hds-t-body3c-semi-bold db:text-hds-d-body3c-semi-bold',
|
|
45
45
|
'body3c-bold': 'text-hds-m-body3c-bold tb:text-hds-t-body3c-bold db:text-hds-d-body3c-bold',
|
|
46
46
|
'quote': 'font-petrona font-normal italic text-hds-m-quote tb:text-hds-t-quote db:text-hds-d-quote',
|
|
47
|
-
'code1': 'text-hds-m-code1 tb:text-hds-t-code1 db:text-hds-d-code1',
|
|
47
|
+
'code1': 'font-firaCode text-hds-m-code1 tb:text-hds-t-code1 db:text-hds-d-code1',
|
|
48
48
|
'code2': 'text-hds-m-code2 tb:text-hds-t-code2 db:text-hds-d-code2',
|
|
49
49
|
}
|
|
50
50
|
return React.createElement(
|
|
@@ -11,13 +11,13 @@ export default function AboutSection(props) {
|
|
|
11
11
|
<div>
|
|
12
12
|
<div className=" w-14 h-14 relative rounded-full border border-neutral-300 ">
|
|
13
13
|
<img alt={props.title ?? 'connectorImage'} src={props.imgUrl} className="rounded-full w-full " />
|
|
14
|
-
<div className="absolute top-8 left-10">
|
|
14
|
+
{props.is_verified && <div className="absolute top-8 left-10">
|
|
15
15
|
<Icon
|
|
16
16
|
height={'h-5 w-5 stroke-[1.5px]'}
|
|
17
17
|
variant='verifiedBlue'
|
|
18
18
|
|
|
19
19
|
/>
|
|
20
|
-
</div>
|
|
20
|
+
</div>}
|
|
21
21
|
</div>
|
|
22
22
|
|
|
23
23
|
{props.tags &&
|
|
@@ -36,7 +36,7 @@ export default function AboutSection(props) {
|
|
|
36
36
|
{props.title && <div className='pt-4 text-hds-t-h3 text-neutral-1000'>{props.title}</div>}
|
|
37
37
|
{props.description && <Typography textStyle='sub2' className='pt-2 text-neutral-500'>{props.description}</Typography>}
|
|
38
38
|
</div>
|
|
39
|
-
<a href={props.btnLink} className='mt-4 flex' >
|
|
39
|
+
{props.btnLink && <a href={props.btnLink} className='mt-4 flex' >
|
|
40
40
|
<HDSButton
|
|
41
41
|
type="secondary"
|
|
42
42
|
label={props.btnLabel ?? 'Deployment guide'}
|
|
@@ -45,21 +45,21 @@ export default function AboutSection(props) {
|
|
|
45
45
|
rightAnimatedArrow='true'
|
|
46
46
|
rightAnimatedArrowColor='#3970FD'
|
|
47
47
|
/>
|
|
48
|
-
</a>
|
|
48
|
+
</a>}
|
|
49
49
|
|
|
50
50
|
</div>
|
|
51
51
|
<div className="py-8 ">
|
|
52
52
|
<Typography textStyle='h6' className='text-neutral-500 uppercase'>{props.aboutTitle ?? 'About'}</Typography>
|
|
53
53
|
<div className="pt-4 flex flex-col gap-2">
|
|
54
|
-
<div className="flex gap-2">
|
|
54
|
+
{props.versionValue && <div className="flex gap-2">
|
|
55
55
|
<Typography textStyle='body1-medium' className='text-neutral-500'>{props.version ?? 'Version'}</Typography>
|
|
56
56
|
<Badges
|
|
57
57
|
color='blue'
|
|
58
58
|
children={props.versionValue}
|
|
59
59
|
// text_color='text-neutral-0'
|
|
60
60
|
/>
|
|
61
|
-
</div>
|
|
62
|
-
<div className="flex gap-2 items-center">
|
|
61
|
+
</div>}
|
|
62
|
+
{props.typeValue && <div className="flex gap-2 items-center">
|
|
63
63
|
<Typography textStyle='body1-medium' className='text-neutral-500'>{props.typeText ?? 'Type'}</Typography>
|
|
64
64
|
<Icon
|
|
65
65
|
height={'h-5 w-5 stroke-[1.5px]'}
|
|
@@ -67,15 +67,15 @@ export default function AboutSection(props) {
|
|
|
67
67
|
/>
|
|
68
68
|
<Typography textStyle='body1-medium' className='text-neutral-500'>{props.typeValue}</Typography>
|
|
69
69
|
|
|
70
|
-
</div>
|
|
71
|
-
<div className="flex gap-2">
|
|
70
|
+
</div>}
|
|
71
|
+
{props.releasedValue && <div className="flex gap-2">
|
|
72
72
|
<Typography textStyle='body1-medium' className='text-neutral-500'>{props.releasedText ?? 'Released'}</Typography>
|
|
73
73
|
<Typography textStyle='body1-medium' className='text-neutral-500'>{props.releasedValue}</Typography>
|
|
74
|
-
</div>
|
|
75
|
-
<div className="flex gap-2">
|
|
74
|
+
</div>}
|
|
75
|
+
{props.lastUpdateValue && <div className="flex gap-2">
|
|
76
76
|
<Typography textStyle='body1-medium' className='text-neutral-500'>{props.lastUpdatedText ?? 'Last Updated'}</Typography>
|
|
77
77
|
<Typography textStyle='body1-medium' className='text-neutral-500'>{props.lastUpdateValue}</Typography>
|
|
78
|
-
</div>
|
|
78
|
+
</div>}
|
|
79
79
|
{props.githubRepoLink && <a href={props.githubRepoLink} className="flex gap-2 items-center">
|
|
80
80
|
<Icon
|
|
81
81
|
height={'h-5 w-5 stroke-[1.5px]'}
|
|
@@ -99,7 +99,7 @@ export default function AboutSection(props) {
|
|
|
99
99
|
</div>
|
|
100
100
|
<div className="py-8">
|
|
101
101
|
<Typography textStyle='h6' className='text-neutral-500 uppercase'>{props.creator ?? 'Creator'}</Typography>
|
|
102
|
-
<a href={props.hasuraIncUrl} className="flex gap-2 items-center pt-4">
|
|
102
|
+
{props.hasuraIncUrl && <a href={props.hasuraIncUrl} className="flex gap-2 items-center pt-4">
|
|
103
103
|
|
|
104
104
|
<Typography
|
|
105
105
|
textStyle='body1-medium'
|
|
@@ -112,14 +112,13 @@ export default function AboutSection(props) {
|
|
|
112
112
|
variant='linkexternal01'
|
|
113
113
|
strokeClass='stroke-blue-600'
|
|
114
114
|
/>
|
|
115
|
-
</a>
|
|
116
|
-
<Typography
|
|
115
|
+
</a>}
|
|
116
|
+
{props.Email && <Typography
|
|
117
117
|
textStyle='body1-medium'
|
|
118
118
|
className='text-neutral-500 pt-2'
|
|
119
119
|
>
|
|
120
120
|
{props.Email ?? 'support@hasura.io'}
|
|
121
|
-
</Typography>
|
|
122
|
-
|
|
121
|
+
</Typography>}
|
|
123
122
|
</div>
|
|
124
123
|
</div>
|
|
125
124
|
</>
|
|
@@ -17,7 +17,7 @@ function DefaultAccordion(props) {
|
|
|
17
17
|
animate={{ opacity: 1 }}
|
|
18
18
|
transition={{ duration: 0.3, opacity: { ease: "easeIn" } }}
|
|
19
19
|
className='h-5 w-5 mt-3.5'>
|
|
20
|
-
<div className=' h-5 cursor-pointer' >
|
|
20
|
+
<div className='w-5 h-5 cursor-pointer' >
|
|
21
21
|
<div
|
|
22
22
|
aria-hidden="true"
|
|
23
23
|
className={` block absolute h-[2px] w-[14px] bg-blue-600 transform transition duration-300 `}
|
|
@@ -35,7 +35,9 @@ function DefaultAccordion(props) {
|
|
|
35
35
|
{props.accordionData && props.accordionData.map((item, index) => (
|
|
36
36
|
<div
|
|
37
37
|
key={index}
|
|
38
|
-
className="py-6 flex items-start"
|
|
38
|
+
className="py-6 flex items-start"
|
|
39
|
+
onClick={() => handleOpen(index)}
|
|
40
|
+
>
|
|
39
41
|
<div
|
|
40
42
|
className='pr-4'
|
|
41
43
|
>
|
|
@@ -45,7 +47,6 @@ function DefaultAccordion(props) {
|
|
|
45
47
|
|
|
46
48
|
<motion.div
|
|
47
49
|
className="cursor-pointer "
|
|
48
|
-
onClick={() => handleOpen(index)}
|
|
49
50
|
initial={{ opacity: 0 }}
|
|
50
51
|
animate={{ opacity: 1 }}
|
|
51
52
|
exit={{ opacity: 1 }}
|
package/src/index.css
CHANGED
package/src/styles/tailwind.css
CHANGED
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
@import url('https://fonts.googleapis.com/css2?family=Petrona:ital,wght@1,200&display=swap');
|
|
2
2
|
|
|
3
|
+
@import url('https://fonts.googleapis.com/css2?family=Fira+Code&display=swap');
|
|
4
|
+
|
|
3
5
|
/*
|
|
4
6
|
! tailwindcss v3.3.1 | MIT License | https://tailwindcss.com
|
|
5
7
|
*/
|
|
@@ -928,6 +930,10 @@ select{
|
|
|
928
930
|
left: 50%;
|
|
929
931
|
}
|
|
930
932
|
|
|
933
|
+
.left-10{
|
|
934
|
+
left: 2.5rem;
|
|
935
|
+
}
|
|
936
|
+
|
|
931
937
|
.left-14{
|
|
932
938
|
left: 3.5rem;
|
|
933
939
|
}
|
|
@@ -1012,6 +1018,10 @@ select{
|
|
|
1012
1018
|
top: 1.25rem;
|
|
1013
1019
|
}
|
|
1014
1020
|
|
|
1021
|
+
.top-8{
|
|
1022
|
+
top: 2rem;
|
|
1023
|
+
}
|
|
1024
|
+
|
|
1015
1025
|
.top-\[112px\]{
|
|
1016
1026
|
top: 112px;
|
|
1017
1027
|
}
|
|
@@ -1044,14 +1054,6 @@ select{
|
|
|
1044
1054
|
top: 100%;
|
|
1045
1055
|
}
|
|
1046
1056
|
|
|
1047
|
-
.left-10{
|
|
1048
|
-
left: 2.5rem;
|
|
1049
|
-
}
|
|
1050
|
-
|
|
1051
|
-
.top-8{
|
|
1052
|
-
top: 2rem;
|
|
1053
|
-
}
|
|
1054
|
-
|
|
1055
1057
|
.isolate{
|
|
1056
1058
|
isolation: isolate;
|
|
1057
1059
|
}
|
|
@@ -6757,6 +6759,10 @@ select{
|
|
|
6757
6759
|
text-indent: 2rem;
|
|
6758
6760
|
}
|
|
6759
6761
|
|
|
6762
|
+
.font-firaCode{
|
|
6763
|
+
font-family: Fira Code, monospace;
|
|
6764
|
+
}
|
|
6765
|
+
|
|
6760
6766
|
.font-petrona{
|
|
6761
6767
|
font-family: Petrona, serif;
|
|
6762
6768
|
}
|