From 2c676c9dfeac6015c3c13047610e96737b22aa5c Mon Sep 17 00:00:00 2001
From: Dwayne Charrington <dwaynecharrington@gmail.com>
Date: Mon, 16 Dec 2024 21:30:39 +1000
Subject: [PATCH] feat(layouts): updating headers of templates to be more
 condensed

---
 themes/aurelia-theme/layouts/_default/single.html | 14 +++++++-------
 themes/aurelia-theme/layouts/blog/list.html       |  5 +----
 themes/aurelia-theme/layouts/blog/single.html     |  2 +-
 themes/aurelia-theme/layouts/contact/single.html  |  2 +-
 themes/aurelia-theme/layouts/faq/single.html      |  2 +-
 themes/aurelia-theme/layouts/learn/single.html    |  2 +-
 6 files changed, 12 insertions(+), 15 deletions(-)

diff --git a/themes/aurelia-theme/layouts/_default/single.html b/themes/aurelia-theme/layouts/_default/single.html
index 50449b4..6e1ed16 100644
--- a/themes/aurelia-theme/layouts/_default/single.html
+++ b/themes/aurelia-theme/layouts/_default/single.html
@@ -1,23 +1,23 @@
 {{ define "main" }}
-<section class="relative py-24 bg-gradient-to-b from-white to-gray-50">
+<section class="relative pt-safe pb-8 bg-gradient-to-b from-white to-gray-50">
   <!-- Decorative Background -->
   <div class="absolute inset-0 overflow-hidden pointer-events-none">
-    <div class="absolute top-1/4 -right-1/4 w-[600px] h-[600px] bg-gradient-to-r from-aurelia/10 to-aurelia-light/10 rounded-full blur-3xl"></div>
-    <div class="absolute -bottom-1/4 -left-1/4 w-[600px] h-[600px] bg-gradient-to-r from-aurelia-light/5 to-purple-500/5 rounded-full blur-3xl"></div>
+    <div class="absolute top-0 -right-1/4 w-[400px] h-[400px] bg-gradient-to-r from-aurelia/10 to-aurelia-light/10 rounded-full blur-2xl"></div>
+    <div class="absolute bottom-0 -left-1/4 w-[400px] h-[400px] bg-gradient-to-r from-aurelia-light/5 to-purple-500/5 rounded-full blur-2xl"></div>
   </div>
 
   <!-- Header Content -->
-  <div class="relative z-10 max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
-    <h1 class="text-4xl md:text-5xl font-bold mb-4 bg-gradient-to-r from-aurelia to-aurelia-light bg-clip-text text-transparent">
+  <div class="relative z-10 max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
+    <h1 class="text-3xl md:text-4xl font-bold mb-3 bg-gradient-to-r from-aurelia to-aurelia-light bg-clip-text text-transparent">
       {{ .Title }}
     </h1>
     {{ with .Description }}
-    <p class="text-lg md:text-xl text-gray-600 mb-8">{{ . }}</p>
+    <p class="text-base md:text-lg text-gray-600">{{ . }}</p>
     {{ end }}
   </div>
 </section>
 
-<section class="py-12 md:py-16 bg-white relative">
+<section class="py-4 bg-white relative">
   <div class="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8">
     <!-- Main Content -->
     <div class="prose prose-lg max-w-none
diff --git a/themes/aurelia-theme/layouts/blog/list.html b/themes/aurelia-theme/layouts/blog/list.html
index dacedb9..e169150 100644
--- a/themes/aurelia-theme/layouts/blog/list.html
+++ b/themes/aurelia-theme/layouts/blog/list.html
@@ -1,6 +1,6 @@
 {{ define "main" }}
 <!-- Blog Header Section -->
-<section class="relative py-24 bg-gradient-to-b from-white to-gray-50">
+<section class="relative pt-safe pb-8 bg-gradient-to-b from-white to-gray-50">
   <!-- Decorative Background -->
   <div class="absolute inset-0 overflow-hidden">
     <div class="absolute top-1/4 -right-1/4 w-[500px] h-[500px] bg-gradient-to-r from-aurelia/10 to-aurelia-light/10 rounded-full blur-3xl"></div>
@@ -9,9 +9,6 @@
 
   <!-- Header Content -->
   <div class="relative z-10 max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 text-center">
-    <span class="inline-block px-4 py-1 rounded-full bg-aurelia/10 text-aurelia text-sm font-medium mb-4">
-      Blog
-    </span>
     <h1 class="text-4xl md:text-5xl font-bold mb-4 bg-gradient-to-r from-aurelia to-aurelia-light bg-clip-text text-transparent">
       The Aurelia Blog
     </h1>
diff --git a/themes/aurelia-theme/layouts/blog/single.html b/themes/aurelia-theme/layouts/blog/single.html
index dd83fcc..b3556e2 100644
--- a/themes/aurelia-theme/layouts/blog/single.html
+++ b/themes/aurelia-theme/layouts/blog/single.html
@@ -1,6 +1,6 @@
 {{ define "main" }}
 <!-- Article Header -->
-<section class="relative py-24 bg-gradient-to-b from-white to-gray-50">
+<section class="relative pt-safe pb-8 bg-gradient-to-b from-white to-gray-50">
   <!-- Decorative Background -->
   <div class="absolute inset-0 overflow-hidden">
     <div class="absolute top-1/4 -right-1/4 w-[500px] h-[500px] bg-gradient-to-r from-aurelia/10 to-aurelia-light/10 rounded-full blur-3xl"></div>
diff --git a/themes/aurelia-theme/layouts/contact/single.html b/themes/aurelia-theme/layouts/contact/single.html
index af1b702..8d945c0 100644
--- a/themes/aurelia-theme/layouts/contact/single.html
+++ b/themes/aurelia-theme/layouts/contact/single.html
@@ -1,6 +1,6 @@
 {{ define "main" }}
 <!-- Contact Header -->
-<section class="relative py-24 bg-gradient-to-b from-white to-gray-50">
+<section class="relative pt-safe pb-8 bg-gradient-to-b from-white to-gray-50">
   <!-- Decorative Background -->
   <div class="absolute inset-0 overflow-hidden">
     <div class="absolute top-1/4 -right-1/4 w-[500px] h-[500px] bg-gradient-to-r from-aurelia/10 to-aurelia-light/10 rounded-full blur-3xl"></div>
diff --git a/themes/aurelia-theme/layouts/faq/single.html b/themes/aurelia-theme/layouts/faq/single.html
index 7dfde92..03f4ec6 100644
--- a/themes/aurelia-theme/layouts/faq/single.html
+++ b/themes/aurelia-theme/layouts/faq/single.html
@@ -1,5 +1,5 @@
 {{ define "main" }}
-<section class="relative py-24 bg-gradient-to-b from-white to-gray-50">
+<section class="relative pt-safe pb-8 bg-gradient-to-b from-white to-gray-50">
   <!-- Decorative Background -->
   <div class="absolute inset-0 overflow-hidden">
     <div class="absolute top-1/4 -right-1/4 w-[500px] h-[500px] bg-gradient-to-r from-aurelia/10 to-aurelia-light/10 rounded-full blur-3xl"></div>
diff --git a/themes/aurelia-theme/layouts/learn/single.html b/themes/aurelia-theme/layouts/learn/single.html
index 710108e..c29678d 100644
--- a/themes/aurelia-theme/layouts/learn/single.html
+++ b/themes/aurelia-theme/layouts/learn/single.html
@@ -1,6 +1,6 @@
 {{ define "main" }}
 <!-- Learn Header -->
-<section class="relative py-24 bg-gradient-to-b from-white to-gray-50">
+<section class="relative pt-safe pb-8 bg-gradient-to-b from-white to-gray-50">
   <!-- Decorative Background -->
   <div class="absolute inset-0 overflow-hidden">
     <div class="absolute top-1/4 -right-1/4 w-[500px] h-[500px] bg-gradient-to-r from-aurelia/10 to-aurelia-light/10 rounded-full blur-3xl"></div>