first commit

resources/client/news/news-article-grid-item.tsx

@@ -0,0 +1,28 @@
+import {NewsArticleImage} from '@app/news/news-article-image';
+import {NewsArticleLink} from '@app/news/news-article-link';
+import {BulletSeparatedItems} from '@app/titles/bullet-separated-items';
+import {FormattedDate} from '@common/i18n/formatted-date';
+import {NewsArticle} from '@app/titles/models/news-article';
+
+interface Props {
+  article: NewsArticle;
+}
+export function NewsArticleGridItem({article}: Props) {
+  return (
+    <div className="items-start gap-14 lg:flex">
+      <NewsArticleImage
+        article={article}
+        className="aspect-poster max-w-90 max-md:hidden"
+      />
+      <div className="min-w-0 overflow-hidden overflow-ellipsis text-base md:mt-24 lg:mt-6">
+        <NewsArticleLink article={article} className="font-medium" />
+        <BulletSeparatedItems className="mt-10 min-w-0 overflow-hidden overflow-ellipsis text-xs">
+          <FormattedDate date={article.created_at} />
+          <div className="overflow-hidden overflow-ellipsis whitespace-nowrap">
+            {article.source}
+          </div>
+        </BulletSeparatedItems>
+      </div>
+    </div>
+  );
+}