From b151bde73a8fff5b2e47ac156a9278789415eccd Mon Sep 17 00:00:00 2001
From: ignace nyamagana butera <nyamsprod@gmail.com>
Date: Sat, 22 Jun 2024 23:36:04 +0200
Subject: [PATCH] Update styling

---
 docs/_data/manifest.yml                   |  2 +-
 docs/_layouts/index.html                  |  6 ++--
 docs/{styles.0004.css => styles.0005.css} | 40 +++++++++++++++++------
 3 files changed, 34 insertions(+), 14 deletions(-)
 rename docs/{styles.0004.css => styles.0005.css} (99%)

diff --git a/docs/_data/manifest.yml b/docs/_data/manifest.yml
index 8a767b9..e42b5fe 100644
--- a/docs/_data/manifest.yml
+++ b/docs/_data/manifest.yml
@@ -1,4 +1,4 @@
 {
-  "docs.css": "/styles.0004.css",
+  "docs.css": "/styles.0005.css",
   "docs.js": "/scripts.0002.js"
 }
diff --git a/docs/_layouts/index.html b/docs/_layouts/index.html
index 290094e..843fe3c 100644
--- a/docs/_layouts/index.html
+++ b/docs/_layouts/index.html
@@ -50,12 +50,12 @@ <h2 class="font-medium text-3xl text-light">Time range API for PHP</h2>
                 </span>
             </div>
 
-            <div class="flex flex-col gap-6 py-16 sm:py-24 text-light">
-
+            <div class="flex flex-col gap-6 pb-16 sm:pb-24 text-light">
+                <div class="text-xl">Love this package ? <a href="https://github.com/sponsors/nyamsprod" class="text-period-dark underline">Sponsor its development</a></div>
             </div>
 
             <div class="flex flex-col gap-6 sm:w-2/3">
-                <h3 class="font-black text-6xl md:text-8xl tracking-tighter">Highlights</h3>
+                <h3 class="font-black text-6xl md:text-8xl tracking-tighter mt-12 mb-6">Highlights</h3>
 
                 <p class="text-light">
                     <code>Period</code> is PHP's Time Range class. Based on ideas from
diff --git a/docs/styles.0004.css b/docs/styles.0005.css
similarity index 99%
rename from docs/styles.0004.css
rename to docs/styles.0005.css
index 68fd9dc..ef9ef88 100644
--- a/docs/styles.0004.css
+++ b/docs/styles.0005.css
@@ -691,6 +691,18 @@ video {
   margin-top: 1.5rem;
 }
 
+.mb-6 {
+  margin-bottom: 1.5rem;
+}
+
+.mt-16 {
+  margin-top: 4rem;
+}
+
+.mt-12 {
+  margin-top: 3rem;
+}
+
 .block {
   display: block;
 }
@@ -990,11 +1002,6 @@ video {
   padding-bottom: 2.5rem;
 }
 
-.py-16 {
-  padding-top: 4rem;
-  padding-bottom: 4rem;
-}
-
 .py-2 {
   padding-top: 0.5rem;
   padding-bottom: 0.5rem;
@@ -1015,6 +1022,10 @@ video {
   padding-bottom: 2.25rem;
 }
 
+.pb-16 {
+  padding-bottom: 4rem;
+}
+
 .pb-32 {
   padding-bottom: 8rem;
 }
@@ -1128,6 +1139,11 @@ video {
   color: rgb(0 0 0 / var(--tw-text-opacity));
 }
 
+.text-csv-base {
+  --tw-text-opacity: 1;
+  color: rgb(56 193 99 / var(--tw-text-opacity));
+}
+
 .text-dark {
   --tw-text-opacity: 1;
   color: rgb(44 44 44 / var(--tw-text-opacity));
@@ -1158,6 +1174,11 @@ video {
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
+.text-period-dark {
+  --tw-text-opacity: 1;
+  color: rgb(178 139 20 / var(--tw-text-opacity));
+}
+
 .underline {
   text-decoration-line: underline;
 }
@@ -1946,15 +1967,14 @@ img {
     padding-right: 1.5rem;
   }
 
-  .sm\:py-24 {
-    padding-top: 6rem;
-    padding-bottom: 6rem;
-  }
-
   .sm\:py-3 {
     padding-top: 0.75rem;
     padding-bottom: 0.75rem;
   }
+
+  .sm\:pb-24 {
+    padding-bottom: 6rem;
+  }
 }
 
 @media (min-width: 768px) {