new create

2026-08-11 20:29:33 +04:30 · 2026-08-09 15:35:49 +03:30
parent 6207bb8431
commit 95c3c74276
11 changed files with 678 additions and 8 deletions
@@ -0,0 +1,112 @@
+import type { Metadata } from "next";
+import Link from "next/link";
+
+import heroImage from "@/assets/images/hero/hero-1.jpg";
+import heroImageMobile from "@/assets/images/hero/hero-1-mobile.jpg";
+import { Reveal } from "@/components/Reveal";
+import { NewsCarousel } from "@/components/news/NewsCarousel";
+import { Editorial } from "@/components/shared/Editorial";
+import { PageCta } from "@/components/shared/PageCta";
+import { PageHero } from "@/components/shared/PageHero";
+import { SiteFooter } from "@/components/SiteFooter";
+import { SiteHeader } from "@/components/SiteHeader";
+import { blog, news, newsAndBlogPage } from "@/data/site";
+
+export const metadata: Metadata = {
+  title: "مقالات و اخبار",
+  description: "آخرین اخبار، رویدادها و مقالات گروه ساختمانی رئوفی.",
+};
+
+export default function NewsAndBlogPage() {
+  const hasNews = news.length > 0;
+  const hasBlog = blog.length > 0;
+  const hasNothing = !hasNews && !hasBlog;
+
+  return (
+    <>
+      <SiteHeader />
+
+      <main>
+        <PageHero
+          image={heroImage}
+          imageMobile={heroImageMobile}
+          caption={newsAndBlogPage.hero.caption}
+          title={newsAndBlogPage.hero.title}
+          breadcrumb={newsAndBlogPage.hero.breadcrumb}
+        />
+
+        <section className="bg-paper">
+          <Editorial
+            caption={newsAndBlogPage.overview.caption}
+            captionLatin={newsAndBlogPage.overview.captionLatin}
+            title={newsAndBlogPage.overview.title}
+            body={newsAndBlogPage.overview.body}
+            compact
+          />
+        </section>
+
+        {hasNothing && (
+          <section className="bg-sand py-16 lg:py-24">
+            <p className="text-center text-muted">{newsAndBlogPage.emptyMessage}</p>
+          </section>
+        )}
+
+        {hasNews && (
+          <section className="bg-sand py-16 lg:py-24">
+            <div className="mx-auto max-w-[1400px] px-6 lg:px-12">
+              <Reveal>
+                <p className="kicker mb-10 justify-center">
+                  {newsAndBlogPage.news.caption}
+                  <span className="latin">{newsAndBlogPage.news.captionLatin}</span>
+                </p>
+              </Reveal>
+            </div>
+
+            <NewsCarousel items={news} basePath="/news" />
+
+            <div className="mx-auto mt-10 max-w-[1400px] px-6 text-center lg:px-12">
+              <Link
+                href="/news"
+                className="inline-block rounded-full bg-gold px-9 py-3.5 text-white transition-colors duration-300 hover:bg-ink"
+              >
+                {newsAndBlogPage.news.action}
+              </Link>
+            </div>
+          </section>
+        )}
+
+        {hasBlog && (
+          <section className={`py-16 lg:py-24 ${hasNews ? "bg-paper" : "bg-sand"}`}>
+            <div className="mx-auto max-w-[1400px] px-6 lg:px-12">
+              <Reveal>
+                <p className="kicker mb-10 justify-center">
+                  {newsAndBlogPage.blog.caption}
+                  <span className="latin">{newsAndBlogPage.blog.captionLatin}</span>
+                </p>
+              </Reveal>
+            </div>
+
+            <NewsCarousel items={blog} basePath="/blog" />
+
+            <div className="mx-auto mt-10 max-w-[1400px] px-6 text-center lg:px-12">
+              <Link
+                href="/blog"
+                className="inline-block rounded-full bg-gold px-9 py-3.5 text-white transition-colors duration-300 hover:bg-ink"
+              >
+                {newsAndBlogPage.blog.action}
+              </Link>
+            </div>
+          </section>
+        )}
+
+        <PageCta
+          caption={newsAndBlogPage.cta.caption}
+          title={newsAndBlogPage.cta.title}
+          action={newsAndBlogPage.cta.action}
+        />
+      </main>
+
+      <SiteFooter />
+    </>
+  );
+}