FD-3221 horizontal 4 meta

FDMediagroep · Nov 23, 2022 · 75c3449 · 75c3449
1 parent bee2e1e
commit 75c3449
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 18 deletions.
diff --git a/__tests__/components/card/__snapshots__/HorizontalCard4.test.tsx.snap b/__tests__/components/card/__snapshots__/HorizontalCard4.test.tsx.snap
@@ -55,21 +55,21 @@ https://images.example.com/image.png?auto=format&ixlib=react-9.5.4&w=8192 8192w"
         class="teaserText xs__pl+4 s__p+4"
       >
         <div
-          class="meta xs__m-0 xs__mb+2 body-text sans s"
+          class="meta xs__m-0 xs__mb+2 body-text sans xs"
         >
+          <time>
+            11:40
+          </time>
           <span
-            class="prefix"
+            class="dot"
           >
-            Ondernemen
+            •
           </span>
           <span
-            class="dot"
+            class="prefix"
           >
-            •
+            Ondernemen
           </span>
-          <time>
-            11:40
-          </time>
         </div>
         <div
           class="textContainer"

diff --git a/src/components/card/HorizontalCard2.tsx b/src/components/card/HorizontalCard2.tsx
@@ -2,14 +2,15 @@ import React from 'react';
 import styles from './HorizontalCard2.module.scss';
 
 interface Props {
+    style?: React.CSSProperties;
+    className?: string;
     id: string;
     url: string;
     label: string;
     time: string;
     title: string;
     intro: string;
     isRead?: boolean;
-    [x: string]: any;
 }
 
 /**

diff --git a/src/components/card/HorizontalCard4.module.scss b/src/components/card/HorizontalCard4.module.scss
@@ -93,11 +93,6 @@
         top: auto;
         left: auto;
         right: auto;
-        .update,
-        .prefix {
-            font-family: map-deep-get($typography, 'font-family', 'bold'),
-                sans-serif;
-        }
         .update {
             padding: 1px 8px;
             color: var(--card);

diff --git a/src/components/card/HorizontalCard4.tsx b/src/components/card/HorizontalCard4.tsx
@@ -2,17 +2,20 @@ import React from 'react';
 import styles from './HorizontalCard4.module.scss';
 
 interface Props {
+    style?: React.CSSProperties;
+    className?: string;
     id: string;
     /**
      * Custom image component. When set this will replace the default img-element.
      */
     imageComponent?: JSX.Element;
     url: string;
+    imageUrl?: string;
+    caption?: string;
     label: string;
     time: string;
     title: string;
     isRead?: boolean;
-    [x: string]: any;
 }
 
 /**
@@ -49,17 +52,18 @@ function HorizontalCard4(props: Props) {
 
                 <div className={`${styles.teaserText} xs__pl+4 s__p+4`}>
                     <div
-                        className={`${styles.meta} xs__m-0 xs__mb+2 body-text sans s`}
+                        className={`${styles.meta} xs__m-0 xs__mb+2 body-text sans xs`}
                     >
+                        <time>{props.time}</time>
+
                         {props.label && (
                             <>
+                                <span className={styles.dot}>•</span>
                                 <span className={styles.prefix}>
                                     {props.label}
                                 </span>
-                                <span className={styles.dot}>•</span>
                             </>
                         )}
-                        <time>{props.time}</time>
                     </div>
 
                     <div className={styles.textContainer}>