From 0006bbb1c2e928723ba80f76587148cbe238116f Mon Sep 17 00:00:00 2001
From: John Doe <hamedhasan422421@gmail.com>
Date: Tue, 12 Sep 2023 17:26:15 +0300
Subject: [PATCH] =?UTF-8?q?=F0=9F=93=9D=20Add=20PostCardMeta=20to=20Card13?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

* Added PostCardMeta component to the Card13 component
* Updated the code to render the PostCardMeta component after the description

✅ Ready to be reviewed
---
 src/app/blog/Card13.tsx | 57 +++++++++++++++++++++++++++++++++++++++++
 src/app/blog/layout.tsx |  7 +++++
 2 files changed, 64 insertions(+)
 create mode 100644 src/app/blog/Card13.tsx
 create mode 100644 src/app/blog/layout.tsx

diff --git a/src/app/blog/Card13.tsx b/src/app/blog/Card13.tsx
new file mode 100644
index 0000000..826f21f
--- /dev/null
+++ b/src/app/blog/Card13.tsx
@@ -0,0 +1,57 @@
+import React, { FC } from "react";
+import PostCardMeta from "@/components/PostCardMeta";
+import { PostDataType } from "@/data/types";
+import PostTypeFeaturedIcon from "@/components/PostTypeFeaturedIcon";
+import Link from "next/link";
+import Image from "next/image";
+
+export interface Card13Props {
+  className?: string;
+  post: PostDataType;
+}
+
+const Card13: FC<Card13Props> = ({ className = "", post }) => {
+  const { title, href, desc, featuredImage, date, postType } = post;
+
+  return (
+    <div className={`nc-Card13 relative flex ${className}`} data-nc-id="Card13">
+      <div className="flex flex-col h-full py-2">
+        <h2 className={`nc-card-title block font-semibold text-base`}>
+          <Link href={href} className="line-clamp-2" title={title}>
+            {title}
+          </Link>
+        </h2>
+        <span className="hidden sm:block my-3 text-neutral-500 dark:text-neutral-400 ">
+          <span className="line-clamp-2"> {desc}</span>
+        </span>
+        <span className="mt-4 block sm:hidden text-sm text-neutral-500 ">
+          {date}
+        </span>
+        <div className="mt-auto hidden sm:block">
+          <PostCardMeta meta={{ ...post }} />
+        </div>
+      </div>
+
+      <Link
+        href={href}
+        className={`block relative h-full flex-shrink-0 w-2/5 sm:w-1/3 ml-3 sm:ml-5`}
+      >
+        <Image
+          fill
+          className="object-cover rounded-xl sm:rounded-3xl"
+          src={featuredImage}
+          alt={title}
+          sizes="(max-width: 768px) 100vw, 400px"
+        />
+        <PostTypeFeaturedIcon
+          className="absolute bottom-2 left-2"
+          postType={postType}
+          wrapSize="w-8 h-8"
+          iconSize="w-4 h-4"
+        />
+      </Link>
+    </div>
+  );
+};
+
+export default Card13;
diff --git a/src/app/blog/layout.tsx b/src/app/blog/layout.tsx
new file mode 100644
index 0000000..f628112
--- /dev/null
+++ b/src/app/blog/layout.tsx
@@ -0,0 +1,7 @@
+export default function DashboardLayout({
+  children, // will be a page or nested layout
+}: {
+  children: React.ReactNode;
+}) {
+  return <div>{children}</div>;
+}