hds-web 1.9.0 → 1.9.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "hds-web",
-  "version": "1.9.0",
+  "version": "1.9.2",
   "private": false,
   "main": "dist/index.js",
   "module": "dist/index.es.js",

package/src/HDS/components/Cards/Misc/imageBadgeCard.js

@@ -1,12 +1,16 @@
-export default function imageBadgeCard (card){
+import React from "react"
+import { HDSColor } from "../../../foundation/ColorPalette"
+import { Typography } from "../../../foundation/Typography"
+import {Badges} from "../../BadgesCaption"
+export default function ImageBadgeCard (card){
 
 return(
     <>
         <div className={`${HDSColor(card.cardBg)}bg-neutral-0 max-w-[700px] min-h-[245px] rounded-3xl p-8`}>
-            <div className='flex flex-row justify-between gap-4'>
+            <div className='flex flex-col tb:flex-row  justify-between gap-4'>
 
 
-                <div className='max-w-[400px]'>
+                <div className='tb:max-w-[400px]'>
 
                     <Badges
                         color={card.badge.color}
@@ -16,8 +20,8 @@ return(
                     <Typography textStyle='h4' className='mt-2 text-neutral-1000'>{card.title}</Typography>
                     <Typography textStyle='sub2' className='mt-2 text-neutral-600'>{card.subTitle}</Typography>
                 </div>
-                <div>
-                    <img src={card.imageUrl} alt={card.title} className='max-w-[290px] max-h-[181px]' />
+                <div className="flex justify-center">
+                    <img src={card.imageUrl} alt={card.title} className='tb:max-w-[290px] tb:max-h-[181px]' />
 
                 </div>
             </div>

package/src/HDS/components/Cards/Misc/index.js

@@ -1,4 +1,5 @@
 export {default as TalkCard} from './talkCard';
 export {default as TalkCard2} from './talkcard2';
 export {default as IconCard} from './iconCard';
-export {default as ImageCard} from './imageCard';
+export {default as ImageCard} from './imageCard';
+export {default as ImageBadgeCard} from './imageBadgeCard';

package/src/styles/tailwind.css

@@ -9920,6 +9920,10 @@ select{
     max-height: 25.25rem;
   }
 
+  .tb\:max-h-\[181px\]{
+    max-height: 181px;
+  }
+
   .tb\:w-1\/2{
     width: 50%;
   }
@@ -9978,6 +9982,10 @@ select{
     max-width: 530px;
   }
 
+  .tb\:max-w-\[400px\]{
+    max-width: 400px;
+  }
+
   .tb\:snap-always{
     scroll-snap-stop: always;
   }