From 555740dd7e7e2bbaffea99fcab197b60d710be4b Mon Sep 17 00:00:00 2001
From: bflatastic <bombayapirat@gmail.com>
Date: Sat, 7 Mar 2026 00:52:23 +0700
Subject: [PATCH] consistent gradients across pages,news page footer fix

---
 .../artcraft-website/src/pages/download/download.tsx     | 4 ++--
 frontend/apps/artcraft-website/src/pages/faq/article.tsx | 4 ++--
 frontend/apps/artcraft-website/src/pages/faq/index.tsx   | 4 ++--
 .../apps/artcraft-website/src/pages/news/news-index.tsx  | 4 ++--
 .../apps/artcraft-website/src/pages/news/news-post.tsx   | 4 ++--
 .../artcraft-website/src/pages/press-kit/press-kit.tsx   | 9 +++++----
 .../artcraft-website/src/pages/tutorials/article.tsx     | 4 ++--
 .../artcraft-website/src/pages/tutorials/tutorials.tsx   | 6 +++---
 .../libs/markdown-content/src/lib/pages/NewsIndex.tsx    | 6 +++---
 .../libs/markdown-content/src/lib/pages/NewsPost.tsx     | 8 ++++----
 10 files changed, 27 insertions(+), 26 deletions(-)

diff --git a/frontend/apps/artcraft-website/src/pages/download/download.tsx b/frontend/apps/artcraft-website/src/pages/download/download.tsx
index b92de27468..e9dfbc6eba 100644
--- a/frontend/apps/artcraft-website/src/pages/download/download.tsx
+++ b/frontend/apps/artcraft-website/src/pages/download/download.tsx
@@ -69,8 +69,8 @@ const Download = () => {
 
       {/* Background effects */}
       <div className="dotted-pattern absolute inset-0 z-[0] opacity-50" />
-      <div className="absolute inset-0 flex items-center justify-center pointer-events-none z-0">
-        <div className="w-[800px] h-[800px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[150px]" />
+      <div className="absolute top-0 inset-x-0 flex justify-center pointer-events-none z-0">
+        <div className="w-[900px] h-[900px] -mt-[200px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]" />
       </div>
 
       <div className="relative w-full max-w-6xl mx-auto px-6 sm:px-10 pt-36 sm:pt-40 pb-24">
diff --git a/frontend/apps/artcraft-website/src/pages/faq/article.tsx b/frontend/apps/artcraft-website/src/pages/faq/article.tsx
index fd7b6e932b..edd72a0f84 100644
--- a/frontend/apps/artcraft-website/src/pages/faq/article.tsx
+++ b/frontend/apps/artcraft-website/src/pages/faq/article.tsx
@@ -41,8 +41,8 @@ const FaqArticle = () => {
     <div className="relative min-h-screen bg-[#101014] text-white overflow-x-hidden bg-dots">
       <Seo title={title} description={description} jsonLd={jsonLd} />
 
-      <div className="absolute inset-0 flex items-center justify-center pointer-events-none z-0">
-        <div className="w-[900px] h-[900px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-25 blur-[120px]"></div>
+      <div className="absolute top-0 inset-x-0 flex justify-center pointer-events-none z-0">
+        <div className="w-[900px] h-[900px] -mt-[200px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]"></div>
       </div>
 
       <div className="relative z-10 mx-auto w-full max-w-3xl px-4 sm:px-6 pt-24 sm:pt-32 pb-32">
diff --git a/frontend/apps/artcraft-website/src/pages/faq/index.tsx b/frontend/apps/artcraft-website/src/pages/faq/index.tsx
index cfc8c4e025..89c5ae6f0b 100644
--- a/frontend/apps/artcraft-website/src/pages/faq/index.tsx
+++ b/frontend/apps/artcraft-website/src/pages/faq/index.tsx
@@ -29,8 +29,8 @@ const FaqIndex = () => {
     <div className="relative min-h-screen bg-[#101014] text-white overflow-x-hidden bg-dots">
       <Seo title={title} description={description} jsonLd={jsonLd} />
 
-      <div className="absolute inset-0 flex items-center justify-center pointer-events-none z-0">
-        <div className="w-[900px] h-[900px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-25 blur-[120px]"></div>
+      <div className="absolute top-0 inset-x-0 flex justify-center pointer-events-none z-0">
+        <div className="w-[900px] h-[900px] -mt-[200px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]"></div>
       </div>
 
       <div className="relative z-10 mx-auto w-full max-w-4xl px-4 sm:px-8 pt-28 sm:pt-36 pb-12">
diff --git a/frontend/apps/artcraft-website/src/pages/news/news-index.tsx b/frontend/apps/artcraft-website/src/pages/news/news-index.tsx
index c157a93206..67bca39ee6 100644
--- a/frontend/apps/artcraft-website/src/pages/news/news-index.tsx
+++ b/frontend/apps/artcraft-website/src/pages/news/news-index.tsx
@@ -4,14 +4,14 @@ import Footer from "../../components/footer";
 
 const NewsIndex = ({ basePath }: { basePath: string }) => {
   return (
-    <>
+    <div className="bg-[#101014] bg-dots">
       <Seo
         title="News & Updates - ArtCraft"
         description="Latest updates, features, and announcements from the ArtCraft team."
       />
       <LibNewsIndex basePath={basePath} />
       <Footer />
-    </>
+    </div>
   );
 };
 
diff --git a/frontend/apps/artcraft-website/src/pages/news/news-post.tsx b/frontend/apps/artcraft-website/src/pages/news/news-post.tsx
index 4c001309f4..12d597376a 100644
--- a/frontend/apps/artcraft-website/src/pages/news/news-post.tsx
+++ b/frontend/apps/artcraft-website/src/pages/news/news-post.tsx
@@ -16,11 +16,11 @@ const NewsPost = ({ basePath }: { basePath: string }) => {
   const desc = post ? post.description : "";
 
   return (
-    <>
+    <div className="bg-[#101014] bg-dots">
       <Seo title={title} description={desc} />
       <LibNewsPost basePath={basePath} />
       <Footer />
-    </>
+    </div>
   );
 };
 
diff --git a/frontend/apps/artcraft-website/src/pages/press-kit/press-kit.tsx b/frontend/apps/artcraft-website/src/pages/press-kit/press-kit.tsx
index ee39735e35..38ef059287 100644
--- a/frontend/apps/artcraft-website/src/pages/press-kit/press-kit.tsx
+++ b/frontend/apps/artcraft-website/src/pages/press-kit/press-kit.tsx
@@ -215,12 +215,13 @@ export default function PressKitPage() {
         description="Download ArtCraft press assets including logos, promotional videos, screenshots, and branding materials for media coverage."
       />
 
+      {/* Background glow */}
+      <div className="absolute top-0 inset-x-0 flex justify-center pointer-events-none z-0">
+        <div className="w-[900px] h-[900px] -mt-[200px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]" />
+      </div>
+
       {/* Hero Section */}
       <main className="relative pt-24 sm:pt-32 pb-12 sm:pb-16 px-4 sm:px-6 lg:px-8">
-        {/* Glowing Gradient Orb Background */}
-        <div className="absolute inset-0 flex items-start justify-center pointer-events-none z-0 overflow-hidden">
-          <div className="w-[800px] h-[600px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[100px] md:blur-[150px] transform-gpu -translate-y-1/2" />
-        </div>
 
         <div className="relative z-10 max-w-7xl mx-auto">
           {/* Header */}
diff --git a/frontend/apps/artcraft-website/src/pages/tutorials/article.tsx b/frontend/apps/artcraft-website/src/pages/tutorials/article.tsx
index 03f612c509..713c9becf5 100644
--- a/frontend/apps/artcraft-website/src/pages/tutorials/article.tsx
+++ b/frontend/apps/artcraft-website/src/pages/tutorials/article.tsx
@@ -53,8 +53,8 @@ const TutorialsArticle = () => {
     <div className="relative min-h-screen bg-[#101014] text-white overflow-x-hidden bg-dots">
       <Seo title={title} description={description} jsonLd={jsonLd} />
 
-      <div className="absolute inset-0 flex items-center justify-center pointer-events-none z-0">
-        <div className="w-[900px] h-[900px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-25 blur-[120px]"></div>
+      <div className="absolute top-0 inset-x-0 flex justify-center pointer-events-none z-0">
+        <div className="w-[900px] h-[900px] -mt-[200px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]"></div>
       </div>
 
       <div className="relative z-10 mx-auto w-full max-w-4xl px-4 sm:px-6 pt-24 sm:pt-32 pb-32">
diff --git a/frontend/apps/artcraft-website/src/pages/tutorials/tutorials.tsx b/frontend/apps/artcraft-website/src/pages/tutorials/tutorials.tsx
index dbc24f260b..118ede75eb 100644
--- a/frontend/apps/artcraft-website/src/pages/tutorials/tutorials.tsx
+++ b/frontend/apps/artcraft-website/src/pages/tutorials/tutorials.tsx
@@ -41,11 +41,11 @@ export const TutorialsPage = () => {
   return (
     <div className="relative min-h-screen bg-[#101014] text-white overflow-x-hidden bg-dots">
       <Seo title={pageTitle} description={pageDescription} />
-      <div className="absolute inset-0 flex items-center justify-center pointer-events-none z-0">
-        <div className="w-[900px] h-[900px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-25 blur-[120px]"></div>
+      <div className="absolute top-0 inset-x-0 flex justify-center pointer-events-none z-0">
+        <div className="w-[900px] h-[900px] -mt-[200px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]"></div>
       </div>
 
-      <div className="relative z-10 mx-auto w-full max-w-[1200px] px-4 sm:px-8 pt-28 sm:pt-36 pb-12">
+      <div className="relative z-10 mx-auto w-full max-w-[1200px] px-4 sm:px-8 pt-28 sm:pt-36 pb-12 min-h-screen">
         {/* Hero */}
         <div className="text-center mb-8 sm:mb-12">
           <h1 className="text-4xl sm:text-6xl font-bold mb-3">Tutorials</h1>
diff --git a/frontend/libs/markdown-content/src/lib/pages/NewsIndex.tsx b/frontend/libs/markdown-content/src/lib/pages/NewsIndex.tsx
index 9928d94f27..5539107b2c 100644
--- a/frontend/libs/markdown-content/src/lib/pages/NewsIndex.tsx
+++ b/frontend/libs/markdown-content/src/lib/pages/NewsIndex.tsx
@@ -18,9 +18,9 @@ export const NewsIndex = ({ basePath }: NewsIndexProps) => {
   // For now, we return the UI structure.
 
   return (
-    <div className="relative min-h-screen bg-[#101014] text-white overflow-hidden bg-dots">
-      <div className="absolute inset-0 flex items-center justify-center pointer-events-none z-0">
-        <div className="w-[900px] h-[900px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]"></div>
+    <div className="relative min-h-screen text-white">
+      <div className="absolute top-0 inset-x-0 flex justify-center pointer-events-none z-0">
+        <div className="w-[900px] h-[900px] -mt-[200px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]"></div>
       </div>
 
       <div className="relative z-10 mx-auto w-full max-w-4xl px-4 sm:px-8 pt-28 sm:pt-36 pb-12">
diff --git a/frontend/libs/markdown-content/src/lib/pages/NewsPost.tsx b/frontend/libs/markdown-content/src/lib/pages/NewsPost.tsx
index 28b6cfc841..29d07edd7d 100644
--- a/frontend/libs/markdown-content/src/lib/pages/NewsPost.tsx
+++ b/frontend/libs/markdown-content/src/lib/pages/NewsPost.tsx
@@ -19,7 +19,7 @@ export const NewsPost = ({ slug: propSlug, basePath }: NewsPostProps) => {
 
   if (!post) {
     return (
-      <div className="relative min-h-screen bg-[#101014] text-white overflow-hidden bg-dots">
+      <div className="relative min-h-screen text-white">
         <div className="relative z-10 mx-auto w-full max-w-[1200px] px-4 sm:px-8 pt-28 sm:pt-36 pb-12">
           <h1 className="text-3xl font-bold">Not found</h1>
           <p className="text-white/70">We couldn't find this article.</p>
@@ -35,9 +35,9 @@ export const NewsPost = ({ slug: propSlug, basePath }: NewsPostProps) => {
   }
 
   return (
-    <div className="relative min-h-screen bg-[#101014] text-white overflow-hidden bg-dots">
-      <div className="absolute inset-0 flex items-center justify-center pointer-events-none z-0">
-        <div className="w-[900px] h-[900px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]"></div>
+    <div className="relative min-h-screen text-white">
+      <div className="absolute top-0 inset-x-0 flex justify-center pointer-events-none z-0">
+        <div className="w-[900px] h-[900px] -mt-[200px] rounded-full bg-gradient-to-br from-blue-700 via-blue-500 to-[#00AABA] opacity-20 blur-[120px]"></div>
       </div>
 
       <div className="relative z-10 mx-auto w-full max-w-3xl px-4 sm:px-6 pt-24 sm:pt-32 pb-32">