hds-web 1.37.1 → 1.37.3
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/index.css +1 -1
- package/dist/index.es.css +1 -1
- package/dist/index.es.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +1 -1
- package/src/HDS/components/Footers/v3Footer.js +1 -1
- package/src/HDS/components/Headers/v3Header.js +2 -1
- package/src/HDS/modules/Cards/aboutSection.js +189 -121
- package/src/styles/tailwind.css +8 -12
package/package.json
CHANGED
|
@@ -580,7 +580,8 @@ V3Header.defaultProps = {
|
|
|
580
580
|
cta_leftVariantIcon: "zap",
|
|
581
581
|
cta_leftVariantIconColor: "#6C737F",
|
|
582
582
|
cta_text: "Get Started",
|
|
583
|
-
cta_link:
|
|
583
|
+
cta_link:
|
|
584
|
+
"https://cloud.hasura.io/signup?pg=nav&plcmt=product-dropdown&cta=get-started",
|
|
584
585
|
},
|
|
585
586
|
],
|
|
586
587
|
},
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
-
import { Badges } from
|
|
2
|
+
import { Badges } from "../../components/BadgesCaption";
|
|
3
3
|
import { Typography } from "../../foundation/Typography";
|
|
4
|
-
import { HDSButton } from
|
|
4
|
+
import { HDSButton } from "../../components/Buttons";
|
|
5
5
|
import { Icon } from "../../components/common-components";
|
|
6
6
|
export default function AboutSection(props) {
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
7
|
+
return (
|
|
8
|
+
<>
|
|
9
|
+
<div className="divide-y divide-neutral-200">
|
|
10
|
+
<div className=" pb-8">
|
|
11
|
+
<div>
|
|
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
14
|
{props.is_verified && <div className="absolute top-8 left-10">
|
|
15
15
|
<Icon
|
|
@@ -20,117 +20,185 @@ export default function AboutSection(props) {
|
|
|
20
20
|
</div>
|
|
21
21
|
}
|
|
22
22
|
</div> */}
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
23
|
+
{props.imgUrl && (
|
|
24
|
+
<div className="flex">
|
|
25
|
+
<img
|
|
26
|
+
alt={props.title ?? "connectorImage"}
|
|
27
|
+
src={props.imgUrl}
|
|
28
|
+
className=" max-h-[25px] "
|
|
29
|
+
/>
|
|
30
|
+
</div>
|
|
31
|
+
)}
|
|
26
32
|
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
33
|
+
{props.tags && (
|
|
34
|
+
<div className="gap-2 pt-8 flex flex-wrap">
|
|
35
|
+
{props.tags.map((tag, index) => (
|
|
36
|
+
<Badges key={index} color={tag.color} children={tag.label} />
|
|
37
|
+
))}
|
|
38
|
+
</div>
|
|
39
|
+
)}
|
|
40
|
+
</div>
|
|
41
|
+
<div>
|
|
42
|
+
{props.title && (
|
|
43
|
+
<div className="pt-4 text-hds-t-h3 text-neutral-1000">
|
|
44
|
+
{props.title}
|
|
45
|
+
</div>
|
|
46
|
+
)}
|
|
47
|
+
{props.description && (
|
|
48
|
+
<Typography textStyle="sub2" className="pt-2 text-neutral-500">
|
|
49
|
+
{props.description}
|
|
50
|
+
</Typography>
|
|
51
|
+
)}
|
|
52
|
+
</div>
|
|
53
|
+
{props.btnLink && (
|
|
54
|
+
<a href={props.btnLink} className="mt-4 flex">
|
|
55
|
+
<HDSButton
|
|
56
|
+
type="secondary"
|
|
57
|
+
label={props.btnLabel ?? "Deployment guide"}
|
|
58
|
+
state="default"
|
|
59
|
+
size="sm"
|
|
60
|
+
rightAnimatedArrow="true"
|
|
61
|
+
rightAnimatedArrowColor="#3970FD"
|
|
62
|
+
/>
|
|
63
|
+
</a>
|
|
64
|
+
)}
|
|
65
|
+
</div>
|
|
66
|
+
<div className="py-8 ">
|
|
67
|
+
<Typography textStyle="h6" className="text-neutral-500 uppercase">
|
|
68
|
+
{props.aboutTitle ?? "About"}
|
|
69
|
+
</Typography>
|
|
70
|
+
<div className="pt-4 flex flex-col gap-2">
|
|
71
|
+
{props.versionValue && (
|
|
72
|
+
<div className="flex gap-2">
|
|
73
|
+
<Typography
|
|
74
|
+
textStyle="body1-medium"
|
|
75
|
+
className="text-neutral-500"
|
|
76
|
+
>
|
|
77
|
+
{props.version ?? "Version"}
|
|
78
|
+
</Typography>
|
|
79
|
+
<Badges
|
|
80
|
+
color="blue"
|
|
81
|
+
children={props.versionValue}
|
|
82
|
+
// text_color='text-neutral-0'
|
|
83
|
+
/>
|
|
84
|
+
</div>
|
|
85
|
+
)}
|
|
86
|
+
{props.typeValue && (
|
|
87
|
+
<div className="flex gap-2 items-center">
|
|
88
|
+
<Typography
|
|
89
|
+
textStyle="body1-medium"
|
|
90
|
+
className="text-neutral-500"
|
|
91
|
+
>
|
|
92
|
+
{props.typeText ?? "Type"}
|
|
93
|
+
</Typography>
|
|
94
|
+
<Icon
|
|
95
|
+
height={"h-5 w-5 stroke-[1.5px]"}
|
|
96
|
+
variant={props.typeIconVariant}
|
|
97
|
+
strokeClass="stroke-neutral-800"
|
|
98
|
+
/>
|
|
99
|
+
<Typography
|
|
100
|
+
textStyle="body1c-medium"
|
|
101
|
+
className="text-neutral-800"
|
|
102
|
+
>
|
|
103
|
+
{props.typeValue}
|
|
104
|
+
</Typography>
|
|
105
|
+
</div>
|
|
106
|
+
)}
|
|
107
|
+
{props.releasedValue && (
|
|
108
|
+
<div className="flex gap-2">
|
|
109
|
+
<Typography
|
|
110
|
+
textStyle="body1-medium"
|
|
111
|
+
className="text-neutral-500"
|
|
112
|
+
>
|
|
113
|
+
{props.releasedText ?? "Released"}
|
|
114
|
+
</Typography>
|
|
115
|
+
<Typography
|
|
116
|
+
textStyle="body1-medium"
|
|
117
|
+
className="text-neutral-800"
|
|
118
|
+
>
|
|
119
|
+
{props.releasedValue}
|
|
120
|
+
</Typography>
|
|
121
|
+
</div>
|
|
122
|
+
)}
|
|
123
|
+
{props.lastUpdateValue && (
|
|
124
|
+
<div className="flex gap-2">
|
|
125
|
+
<Typography
|
|
126
|
+
textStyle="body1-medium"
|
|
127
|
+
className="text-neutral-500"
|
|
128
|
+
>
|
|
129
|
+
{props.lastUpdatedText ?? "Last Updated"}
|
|
130
|
+
</Typography>
|
|
131
|
+
<Typography
|
|
132
|
+
textStyle="body1-medium"
|
|
133
|
+
className="text-neutral-800"
|
|
134
|
+
>
|
|
135
|
+
{props.lastUpdateValue}
|
|
136
|
+
</Typography>
|
|
137
|
+
</div>
|
|
138
|
+
)}
|
|
139
|
+
{props.deployed && (
|
|
140
|
+
<div className="flex gap-2">
|
|
141
|
+
<Typography
|
|
142
|
+
textStyle="body1-medium"
|
|
143
|
+
className="text-neutral-500"
|
|
144
|
+
>
|
|
145
|
+
{props.deployed ?? "Deployed"}
|
|
146
|
+
</Typography>
|
|
147
|
+
<Typography
|
|
148
|
+
textStyle="body1-medium"
|
|
149
|
+
className="text-neutral-800"
|
|
150
|
+
>
|
|
151
|
+
{props.deployedValue}
|
|
152
|
+
</Typography>
|
|
153
|
+
</div>
|
|
154
|
+
)}
|
|
155
|
+
{props.githubRepoLink && (
|
|
156
|
+
<a
|
|
157
|
+
href={props.githubRepoLink}
|
|
158
|
+
className="flex gap-2 items-center"
|
|
159
|
+
>
|
|
160
|
+
<Icon height={"h-6 w-6 stroke-[1.5px]"} variant="octoface" />
|
|
161
|
+
<Typography textStyle="body1-medium" className="text-blue-600">
|
|
162
|
+
{props.githubText ?? "GitHub Repo"}
|
|
163
|
+
</Typography>
|
|
164
|
+
<Icon
|
|
165
|
+
height={"h-5 w-5 stroke-[1.5px]"}
|
|
166
|
+
variant="linkexternal01"
|
|
167
|
+
strokeClass="stroke-blue-600"
|
|
168
|
+
/>
|
|
169
|
+
</a>
|
|
170
|
+
)}
|
|
171
|
+
</div>
|
|
172
|
+
</div>
|
|
173
|
+
<div className="py-8">
|
|
174
|
+
<Typography textStyle="h6" className="text-neutral-500 uppercase">
|
|
175
|
+
{props.creator ?? "Creator"}
|
|
176
|
+
</Typography>
|
|
177
|
+
{props.hasuraIncUrl && (
|
|
178
|
+
<a
|
|
179
|
+
href={props.hasuraIncUrl}
|
|
180
|
+
className="flex gap-2 items-center pt-4"
|
|
181
|
+
>
|
|
182
|
+
<Typography textStyle="body1-medium" className="text-blue-600">
|
|
183
|
+
{props.hasuraInc ?? "Hasura, Inc"}
|
|
184
|
+
</Typography>
|
|
185
|
+
<Icon
|
|
186
|
+
height={"h-5 w-5 stroke-[1.5px]"}
|
|
187
|
+
variant="linkexternal01"
|
|
188
|
+
strokeClass="stroke-blue-600"
|
|
189
|
+
/>
|
|
190
|
+
</a>
|
|
191
|
+
)}
|
|
192
|
+
{props.Email && (
|
|
193
|
+
<Typography
|
|
194
|
+
textStyle="body1-medium"
|
|
195
|
+
className="text-neutral-500 pt-2"
|
|
196
|
+
>
|
|
197
|
+
{props.Email ?? "support@hasura.io"}
|
|
198
|
+
</Typography>
|
|
199
|
+
)}
|
|
200
|
+
</div>
|
|
201
|
+
</div>
|
|
202
|
+
</>
|
|
203
|
+
);
|
|
204
|
+
}
|
package/src/styles/tailwind.css
CHANGED
|
@@ -11147,10 +11147,6 @@ select{
|
|
|
11147
11147
|
min-width: 500px;
|
|
11148
11148
|
}
|
|
11149
11149
|
|
|
11150
|
-
.tb\:min-w-\[130px\]{
|
|
11151
|
-
min-width: 130px;
|
|
11152
|
-
}
|
|
11153
|
-
|
|
11154
11150
|
.tb\:max-w-\[17rem\]{
|
|
11155
11151
|
max-width: 17rem;
|
|
11156
11152
|
}
|
|
@@ -12011,6 +12007,14 @@ select{
|
|
|
12011
12007
|
margin-right: 1rem;
|
|
12012
12008
|
}
|
|
12013
12009
|
|
|
12010
|
+
.tb-l\:-ml-1{
|
|
12011
|
+
margin-left: -0.25rem;
|
|
12012
|
+
}
|
|
12013
|
+
|
|
12014
|
+
.tb-l\:-ml-6{
|
|
12015
|
+
margin-left: -1.5rem;
|
|
12016
|
+
}
|
|
12017
|
+
|
|
12014
12018
|
.tb-l\:mb-0{
|
|
12015
12019
|
margin-bottom: 0px;
|
|
12016
12020
|
}
|
|
@@ -12023,14 +12027,6 @@ select{
|
|
|
12023
12027
|
margin-top: 0px;
|
|
12024
12028
|
}
|
|
12025
12029
|
|
|
12026
|
-
.tb-l\:-ml-6{
|
|
12027
|
-
margin-left: -1.5rem;
|
|
12028
|
-
}
|
|
12029
|
-
|
|
12030
|
-
.tb-l\:-ml-1{
|
|
12031
|
-
margin-left: -0.25rem;
|
|
12032
|
-
}
|
|
12033
|
-
|
|
12034
12030
|
.tb-l\:block{
|
|
12035
12031
|
display: block;
|
|
12036
12032
|
}
|