From 057f2bebf20de1032f3b2d92dbe641b5125db964 Mon Sep 17 00:00:00 2001
From: Hananoshika Yomaru <brenkysbwim@gmail.com>
Date: Thu, 21 May 2026 11:54:23 -0700
Subject: [PATCH] homepage CLS is now reduced by reserving layout space up
 front and treating the particle background as a pre-sized enhancement layer.

I made three targeted changes:

 1. themes/openfreebooks/templates/base.html: added a body_class block so templates can declare first-render shell behavior.
 2. themes/openfreebooks/templates/index.html: set homepage body classes to page-home has-particle-background, so the background layering mode is present from first paint (not added later during hydration).
 3. themes/openfreebooks/sass/_layout.scss: reserved in-flow space before hydration with a fixed header shell (#site-header min-height, including mobile override), reserved marquee slot height on home (#marquee min-height), and stabilized page shell sizing (body/home main min-height behavior).
---
 static/feed.xml                           | 16 +++++++-------
 static/sitemap.xml                        |  2 +-
 themes/openfreebooks/sass/_layout.scss    | 26 +++++++++++++++++++++++
 themes/openfreebooks/templates/base.html  |  2 +-
 themes/openfreebooks/templates/index.html |  2 ++
 5 files changed, 38 insertions(+), 10 deletions(-)

diff --git a/static/feed.xml b/static/feed.xml
index 19e5f96..8360171 100644
--- a/static/feed.xml
+++ b/static/feed.xml
@@ -4,7 +4,14 @@
     <title>Open Free Books</title>
     <link>https://openfreebooks.org/</link>
     <description>Recent updates to Open Free Books pages and live chapters.</description>
-    <lastBuildDate>Thu, 21 May 2026 17:54:08 GMT</lastBuildDate>
+    <lastBuildDate>Thu, 21 May 2026 18:40:42 GMT</lastBuildDate>
+    <item>
+      <title>Contribute</title>
+      <link>https://openfreebooks.org/contributing/</link>
+      <guid isPermaLink="true">https://openfreebooks.org/contributing/</guid>
+      <pubDate>Thu, 21 May 2026 18:40:42 GMT</pubDate>
+      <description>Contribute</description>
+    </item>
     <item>
       <title>Integer arithmetic</title>
       <link>https://openfreebooks.org/math/integer-arithmetic/</link>
@@ -306,13 +313,6 @@
       <pubDate>Tue, 19 May 2026 19:29:49 GMT</pubDate>
       <description>Search</description>
     </item>
-    <item>
-      <title>Contribute</title>
-      <link>https://openfreebooks.org/contributing/</link>
-      <guid isPermaLink="true">https://openfreebooks.org/contributing/</guid>
-      <pubDate>Tue, 19 May 2026 12:34:25 GMT</pubDate>
-      <description>Contribute</description>
-    </item>
     <item>
       <title>Mathematics</title>
       <link>https://openfreebooks.org/math/</link>
diff --git a/static/sitemap.xml b/static/sitemap.xml
index 9b0073d..1d60826 100644
--- a/static/sitemap.xml
+++ b/static/sitemap.xml
@@ -14,7 +14,7 @@
   </url>
   <url>
     <loc>https://openfreebooks.org/contributing/</loc>
-    <lastmod>2026-05-19T12:34:25.000Z</lastmod>
+    <lastmod>2026-05-21T18:40:42.000Z</lastmod>
   </url>
   <url>
     <loc>https://openfreebooks.org/credits/</loc>
diff --git a/themes/openfreebooks/sass/_layout.scss b/themes/openfreebooks/sass/_layout.scss
index ee548b7..0e3319e 100644
--- a/themes/openfreebooks/sass/_layout.scss
+++ b/themes/openfreebooks/sass/_layout.scss
@@ -16,20 +16,46 @@ html,
 body {
   margin: 0;
   padding: 0;
+  min-height: 100%;
   background: var(--paper);
   color: var(--ink);
   font-family: var(--font-body);
 }
 
+body {
+  min-height: 100vh;
+  display: flex;
+  flex-direction: column;
+}
+
+#site-header {
+  min-height: 88px;
+}
+
+@media (max-width: 768px) {
+  #site-header {
+    min-height: 82px;
+  }
+}
+
 .container {
   width: min(1100px, 92vw);
   margin: 0 auto;
 }
 
 main {
+  flex: 1 0 auto;
   min-height: 50vh;
 }
 
+body.page-home main {
+  min-height: 100vh;
+}
+
+body.page-home #marquee {
+  min-height: 58px;
+}
+
 section {
   padding: 54px 0;
 }
diff --git a/themes/openfreebooks/templates/base.html b/themes/openfreebooks/templates/base.html
index 632c983..839cc9e 100644
--- a/themes/openfreebooks/templates/base.html
+++ b/themes/openfreebooks/templates/base.html
@@ -33,7 +33,7 @@
     ></script>
     {% block extra_head %}{% endblock extra_head %}
   </head>
-  <body>
+  <body class="{% block body_class %}{% endblock body_class %}">
     <script id="site-config" type="application/json">
       {
         "brand": {{ config.extra.site_title | json_encode() | safe }},
diff --git a/themes/openfreebooks/templates/index.html b/themes/openfreebooks/templates/index.html
index 5997f81..a3448d7 100644
--- a/themes/openfreebooks/templates/index.html
+++ b/themes/openfreebooks/templates/index.html
@@ -10,6 +10,8 @@
 <div id="webgl-background" aria-hidden="true"></div>
 {% endblock page_background %}
 
+{% block body_class %}page-home has-particle-background{% endblock body_class %}
+
 {% block content %}
 <section class="hero">
   <div class="container">