feat(SW-217): Split up Card to two (Card and TeaserCard)

components/TempDesignSystem/TeaserCard/index.tsx

@@ -7,32 +7,32 @@ import Link from "@/components/TempDesignSystem/Link"
 import Body from "@/components/TempDesignSystem/Text/Body"
 
 import Subtitle from "../Text/Subtitle"
-import { contentCardVariants } from "./variants"
+import { teaserCardVariants } from "./variants"
 
-import styles from "./contentCard.module.css"
+import styles from "./teaserCard.module.css"
 
-import type { ContentCardProps } from "@/types/components/contentCard"
+import type { TeaserCardProps } from "@/types/components/teaserCard"
 
-export default function ContentCard({
+export default function TeaserCard({
   title,
   description,
   primaryButton,
   secondaryButton,
   sidePeekButton,
-  backgroundImage,
+  image,
   style = "default",
   alwaysStack = false,
   className,
-}: ContentCardProps) {
-  const cardClasses = contentCardVariants({ style, alwaysStack, className })
+}: TeaserCardProps) {
+  const cardClasses = teaserCardVariants({ style, alwaysStack, className })
 
   return (
-    <div className={cardClasses}>
-      {backgroundImage && (
+    <article className={cardClasses}>
+      {image && (
         <div className={styles.imageContainer}>
           <Image
-            src={backgroundImage.url}
-            alt={backgroundImage.meta?.alt || ""}
+            src={image.url}
+            alt={image.meta?.alt || ""}
             className={styles.backgroundImage}
             width={399}
             height={201}
@@ -70,6 +70,7 @@ export default function ContentCard({
                 <Link
                   href={primaryButton.href}
                   target={primaryButton.openInNewTab ? "_blank" : undefined}
+                  color="none"
                 >
                   {primaryButton.title}
                 </Link>
@@ -93,6 +94,6 @@ export default function ContentCard({
           </div>
         )}
       </div>
-    </div>
+    </article>
   )
 }

components/TempDesignSystem/TeaserCard/variants.ts

@@ -1,8 +1,8 @@
 import { cva } from "class-variance-authority"
 
-import styles from "./contentCard.module.css"
+import styles from "./teaserCard.module.css"
 
-export const contentCardVariants = cva(styles.card, {
+export const teaserCardVariants = cva(styles.card, {
   variants: {
     style: {
       default: styles.default,