hds-web 1.26.5 → 1.26.6
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 +2 -2
- package/dist/index.es.css +2 -2
- package/dist/index.es.js +1 -1
- package/dist/index.js +1 -1
- package/package.json +1 -1
- package/src/HDS/modules/Events/eventListingCard.js +17 -15
- package/src/styles/tailwind.css +4 -0
package/package.json
CHANGED
@@ -5,18 +5,19 @@ import { Badges } from "../../components/BadgesCaption";
|
|
5
5
|
|
6
6
|
export default function EventListingCard(props) {
|
7
7
|
return (
|
8
|
-
|
8
|
+
<div className="group/eventListing hover:shadow-xl rounded-3xl transition-all duration-300">
|
9
9
|
<div className="self-start">
|
10
10
|
{
|
11
11
|
props.eventListingImg && (
|
12
|
-
<div>
|
13
|
-
<img src={props.eventListingImg} alt={props.title} className={`
|
12
|
+
<div className="">
|
13
|
+
<img src={props.eventListingImg} alt={props.title} className={` rounded-t-3xl max-h-[179px] object-contain ${props.imgBG}`} />
|
14
14
|
</div>
|
15
15
|
)
|
16
16
|
}
|
17
|
-
|
17
|
+
</div>
|
18
|
+
<div className="border border-neutral-200 group-hover/eventListing:border-opacity-0 transition-all duration-300 rounded-b-3xl">
|
18
19
|
<div className="p-6 pb-0">
|
19
|
-
{props.eventType &&
|
20
|
+
{props.eventType &&
|
20
21
|
<Badges
|
21
22
|
color={props.badgeColor ?? 'green'}
|
22
23
|
children={props.eventType}
|
@@ -27,17 +28,18 @@ export default function EventListingCard(props) {
|
|
27
28
|
<Typography textStyle="h4" as="h4" className="text-neutral-1000 py-2">{props.title}</Typography>
|
28
29
|
)
|
29
30
|
}
|
30
|
-
|
31
|
+
|
31
32
|
</div>
|
33
|
+
|
34
|
+
{
|
35
|
+
props.eventDate && (
|
36
|
+
<Typography textStyle="body3-medium" className="text-neutral-700 flex items-center duration-300 self-end p-6 pt-0">
|
37
|
+
{props.eventDate}
|
38
|
+
<Icon height={'h-5 w-5 stroke-[1.5px] ml-1 transition-all duration-300 ease-in-out group-hover/arrow:translate-x-[0.15rem]'} variant="chevronright" strokeClass="stroke-neutral-700" />
|
39
|
+
</Typography>
|
40
|
+
)
|
41
|
+
}
|
32
42
|
</div>
|
33
|
-
|
34
|
-
props.eventDate && (
|
35
|
-
<Typography textStyle="body3-medium" className="text-neutral-700 flex items-center duration-300 self-end p-6 pt-0">
|
36
|
-
{props.eventDate}
|
37
|
-
<Icon height={'h-5 w-5 stroke-[1.5px] ml-1 transition-all duration-300 ease-in-out group-hover/arrow:translate-x-[0.15rem]'} variant="chevronright" strokeClass="stroke-neutral-700" />
|
38
|
-
</Typography>
|
39
|
-
)
|
40
|
-
}
|
41
|
-
</>
|
43
|
+
</div>
|
42
44
|
)
|
43
45
|
}
|
package/src/styles/tailwind.css
CHANGED
@@ -10412,6 +10412,10 @@ select{
|
|
10412
10412
|
transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
|
10413
10413
|
}
|
10414
10414
|
|
10415
|
+
.group\/eventListing:hover .group-hover\/eventListing\:border-opacity-0{
|
10416
|
+
--tw-border-opacity: 0;
|
10417
|
+
}
|
10418
|
+
|
10415
10419
|
.group\/card:hover .group-hover\/card\:bg-blue-200{
|
10416
10420
|
--tw-bg-opacity: 1;
|
10417
10421
|
background-color: rgb(223 232 255 / var(--tw-bg-opacity));
|