From fec2701ebc8f6ac767c20ec3a0f5d1670c6329da Mon Sep 17 00:00:00 2001 From: Johannes Date: Thu, 25 Jun 2026 16:26:05 +0200 Subject: [PATCH 01/39] Homepage update: redesigned hero, shelves, categories, and outro --- gutenberg/gutenberg-globals.css | 423 ++++++++++++++++++++++++++++++++ site/index.md | 295 +++++++++++++--------- 2 files changed, 600 insertions(+), 118 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 184917bb..25870cf7 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3505,6 +3505,429 @@ top: 14px; +/*------------------------------------*\ + HOMEPAGE REDESIGN (scoped under .pgx) +\*------------------------------------*/ +/* Palette from globals: teal #427E94, card teal #d9eaef, chip #C7DDE3, gold #9a772b */ + +.pgx { + --pgx-teal: #427E94; + --pgx-teal-dark: #2c6478; + --pgx-card: #d9eaef; + --pgx-gold: #9a772b; + --hover-focus-color: #eef1f3; +} + +/* Links harmonized to teal */ +.pgx.homepage a { color: var(--pgx-teal-dark); } +.pgx.homepage a:hover { color: #1e4a5c; } + +/* ---------- Hero ---------- */ +.pgx-hero { margin: 28px 0 16px; } +.pgx #slogan { margin: 0 0 18px; padding-bottom: 0; font-size: clamp(2.6rem, 4.6vw, 3.1rem); font-weight: 400; line-height: 1.1; letter-spacing: -0.01em; } +.pgx .pgx-mission { + margin: 0 0 32px; + max-width: 60em; + font-size: clamp(1.3rem, 1.85vw, 1.5rem); + line-height: 1.55; + color: #2c3338; +} +.pgx .pgx-mission strong { color: var(--pgx-teal-dark); font-weight: 600; } +.pgx-trust { + display: flex; + flex-wrap: wrap; + row-gap: 12px; + list-style: none; + padding: 0; + margin: 0; + color: #3f454b; + font-size: 1.36rem; +} +.pgx-trust li { display: inline-flex; align-items: center; white-space: nowrap; } +.pgx-trust li::before { content: "\2713"; color: var(--pgx-teal); font-weight: 700; margin-right: 10px; font-size: 1.05em; } + +/* ---------- Buttons ---------- */ +.pgx.homepage .pgx-btn { + display: inline-flex; + align-items: center; + gap: 8px; + padding: 11px 22px; + border-radius: 4px; + font-size: 1.05rem; + font-weight: 700; + text-decoration: none; + transition: opacity 0.2s ease, background-color 0.2s ease; +} +.pgx.homepage .pgx-btn-primary { background-color: var(--pgx-teal); color: #ffffff; border: 2px solid var(--pgx-teal); } +.pgx.homepage .pgx-btn-primary:hover { background-color: var(--pgx-teal); color: #ffffff; opacity: 0.9; } +.pgx.homepage .pgx-btn-secondary { background-color: #ffffff; border: 2px solid var(--pgx-teal); color: var(--pgx-teal-dark); } +.pgx.homepage .pgx-btn-secondary:hover { background-color: var(--pgx-card); opacity: 0.9; } +.pgx.homepage .pgx-btn-donate { background-color: var(--pgx-card); } +.pgx-lead-links .pgx-btn { min-width: 150px; justify-content: center; } + +/* ---------- Shelf flow ---------- */ +.pgx-flow { display: flex; flex-direction: column; } +.pgx-flow-popular { margin-top: 48px; margin-bottom: 62px; } + +.pgx .category-grid { margin-top: 36px; margin-bottom: 62px; gap: 30px; } +.pgx .category-grid a { font-size: 1.2rem; padding: 19px 24px; flex-basis: 330px; white-space: nowrap; } +.pgx .category-grid a:before { content: none; } +/* one column below 676px — never a 2-column squeeze */ +@media (max-width: 676px) { + .pgx .category-grid a { flex-basis: 100%; max-width: 400px; } +} +.pgx .category-grid .pgx-cat-icon { width: 1.6rem; height: 1.6rem; flex-shrink: 0; color: #5ba0b5; transition: transform 0.3s ease; } +.pgx .category-grid a:hover .pgx-cat-icon { transform: scale(1.1); } +.pgx .category-grid a, +.pgx .category-grid a:link, +.pgx .category-grid a:visited { color: #1f2428; background: #fafbfc; border-color: #e3e7ea; } +.pgx .category-grid a:hover { color: #1f2428; background: #eef1f3; border-color: #e3e7ea; transform: translateY(-3px); box-shadow: 0 6px 14px rgba(0,0,0,0.08); } + +/* strip the old boxy card chrome around shelves */ +.pgx .library { margin: 0; } +.pgx .library .box_shadow { + background: transparent; + border: none; + border-radius: 0; + padding: 0; + margin: 0; + box-shadow: none; +} + +/* shelf header */ +.pgx-shelf-head { + display: flex; + align-items: flex-end; + justify-content: space-between; + gap: 24px; + margin: 0 0 20px; + padding-bottom: 16px; + border-bottom: 1px solid #e7eef1; +} +.pgx-shelf-titles { display: flex; flex-direction: column; gap: 5px; } +.pgx-shelf-title { + font-size: 1.35rem; + font-weight: 600; + letter-spacing: -0.02em; + color: #1f2428; + line-height: 1.05; +} +.pgx.homepage a.pgx-shelf-more { + display: inline-flex; + align-items: center; + flex-shrink: 0; + font-size: 0.82rem; + font-weight: 700; + letter-spacing: 0.15em; + text-transform: uppercase; + color: var(--pgx-teal); + text-decoration: none; + white-space: nowrap; + padding: 6px 10px; + margin: -6px -10px; + border-radius: 8px; + transition: color 0.18s ease, background 0.18s ease; +} +.pgx.homepage a.pgx-shelf-more span { + font-size: 1.3em; + opacity: 0.8; + transition: opacity 0.18s ease, transform 0.18s ease; +} +.pgx.homepage a.pgx-shelf-more:hover { color: var(--pgx-teal); background: #eef1f3; text-decoration: none; } +.pgx.homepage a.pgx-shelf-more:hover span { opacity: 1; transform: translateX(2px); } + +/* the scrolling track — visible thin scrollbar (no JS arrows) */ +.pgx-rail { position: relative; } +/* right-edge fade: persistent "scroll for more" cue (no JS, all browsers) */ +.pgx-rail::after { + content: ""; + position: absolute; + top: 0; right: 0; bottom: 8px; + width: 36px; + background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,0.8)); + pointer-events: none; + z-index: 4; +} +.pgx .lib.latest { + gap: 0; /* overrides base .lib.latest gap:28px; spacing via margin fallback below */ + padding: 18px 4px 18px 14px; + scroll-snap-type: x proximity; + scroll-behavior: smooth; +} +.pgx .lib.latest::-webkit-scrollbar { height: 8px; } +.pgx .lib.latest::-webkit-scrollbar-thumb { background-color: #b8b8b8; border-radius: 10px; } +.pgx .lib.latest::-webkit-scrollbar-track { background-color: #f1f1f1; border-radius: 10px; } + +/* book card */ +.pgx .lib.latest > a { + position: relative; + scroll-snap-align: start; + border-radius: 4px; +} +.pgx .lib.latest .cover_image { + width: 106px; + height: auto; + transition: transform 0.22s ease; +} +.pgx .lib.latest a:hover .cover_image { transform: translateY(-6px); } +.pgx .lib.latest .cover_img { + position: relative; + width: 106px; + height: 159px; + border-radius: 3px; +} +.pgx .lib.latest .cover_img img { + width: 106px; + height: 159px; + border-radius: 3px 4px 4px 3px; + box-shadow: + 0 1px 2px rgba(0, 0, 0, 0.16), + 0 14px 26px -10px rgba(20, 50, 60, 0.5); + transition: box-shadow 0.22s ease; +} +.pgx .lib.latest a:hover .cover_img img { + box-shadow: + 0 2px 4px rgba(0, 0, 0, 0.18), + 0 22px 38px -12px rgba(20, 50, 60, 0.62); +} +/* subtle book-spine shading on the left edge */ +.pgx .lib.latest .cover_img::before { + content: ""; + position: absolute; + top: 0; left: 0; bottom: 0; + width: 7px; + border-radius: 3px 0 0 3px; + background: linear-gradient(to right, rgba(0,0,0,0.22), rgba(0,0,0,0.04) 60%, transparent); + z-index: 2; + pointer-events: none; +} +/* read-free hover affordance */ +.pgx .lib.latest .cover_img::after { + content: "Read free \2192"; + position: absolute; + bottom: 10px; + left: 50%; + transform: translateX(-50%) translateY(6px); + background-color: rgba(33, 37, 41, 0.9); + color: #ffffff; + padding: 5px 13px; + border-radius: 14px; + font-size: 0.76rem; + font-weight: 600; + white-space: nowrap; + opacity: 0; + transition: opacity 0.18s ease, transform 0.18s ease; + pointer-events: none; + z-index: 3; +} +.pgx .lib.latest a:hover .cover_img::after { opacity: 1; transform: translateX(-50%) translateY(0); } + +/* title + author block */ +.pgx .lib.latest .cover_title { + margin-top: 11px; + width: 118px; + max-width: 118px; + text-align: left; + background: transparent; +} +.pgx .lib.latest .cover_title h5, +.pgx .lib.latest .cover_title .h5 { + width: 118px; + height: auto; + font-size: 0.9rem; + font-weight: 600; + color: #14181b; + line-height: 1.32; + letter-spacing: -0.005em; + background-color: transparent; + display: -webkit-box; + -webkit-line-clamp: 3; + -webkit-box-orient: vertical; + overflow: hidden; +} +.pgx .lib.latest > a:hover .cover_title h5, +.pgx .lib.latest > a:hover .cover_title .h5 { + -webkit-line-clamp: 99; + overflow: visible; + height: auto; +} + +/* ---------- Outro: lead statement + explore ---------- */ +.pgx-cards { margin: 14px 0 36px; } +.pgx-lead-text { + margin: 0; + line-height: 1.72; + color: #3a4046; + letter-spacing: 0.005em; + text-wrap: pretty; +} +.pgx-lead-text strong { font-weight: 600; color: #1b2024; } +.pgx-lead-links { display: flex; flex-wrap: wrap; row-gap: 12px; } + +.pgx-cards-row { + display: grid; + grid-template-columns: repeat(2, 1fr); + gap: 24px; + align-items: stretch; +} +.pgx-card { + display: flex; + flex-direction: column; + background-color: #fafbfc; + border: none; + border-radius: 16px; + padding: 32px 30px 30px; +} +.pgx-cards-row--outro { grid-template-columns: 1.05fr 1fr; gap: 38px; } +.pgx-cards-row--outro .pgx-card { padding-top: 16px; } +.pgx-card--lead { justify-content: flex-start; align-self: start; } +.pgx-card--lead .pgx-lead-text { + text-align: left; + font-size: clamp(1.08rem, 1.3vw, 1.22rem); +} +.pgx.homepage .pgx-lead-note { margin: auto 0 0; padding-top: 8px; font-size: clamp(1.08rem, 1.3vw, 1.22rem); color: #6a7075; } + +/* Row 1: lead block on its own row, centered and wider */ +.pgx-lead-wide { max-width: 880px; margin: 0 auto 22px; align-items: center; text-align: center; background: transparent; } +.pgx-lead-wide .pgx-lead-text { + margin: 26px 0; + max-width: 800px; + text-align: center; + text-wrap: balance; + font-size: clamp(1.24rem, 1.55vw, 1.42rem); + line-height: 1.6; + letter-spacing: -0.002em; +} +.pgx-lead-wide .pgx-lead-links { justify-content: center; } +.pgx.homepage .pgx-lead-wide .pgx-lead-note { margin: 20px 0 0; } +.pgx.homepage .pgx-lead-note a { color: var(--pgx-teal-dark); text-decoration: underline; text-underline-offset: 2px; } +.pgx.homepage .pgx-lead-note a:hover { color: var(--pgx-teal); } +.pgx-card--explore .pgx-card-accordion { margin-top: 0; } +@media (max-width: 920px) { + .pgx-cards-row, + .pgx-cards-row--outro { grid-template-columns: 1fr; gap: 18px; } + /* let cards shrink below their content so nothing overflows the viewport */ + .pgx-cards-row .pgx-card, + .pgx-cards-row--outro .pgx-card { min-width: 0; } + .pgx.homepage .pgx-ic { min-width: 0; } +} + +/* ---------- Accordion (CSS-only via checkbox) ---------- */ +.pgx-acc-item { border-bottom: 1px solid #e3e7ea; } +.pgx-acc-item:last-child { border-bottom: none; } +.pgx .pgx-acc-toggle { + position: absolute; + width: 1px; + height: 1px; + overflow: hidden; + clip: rect(0 0 0 0); + white-space: nowrap; +} +.pgx.homepage .pgx-acc-head { + width: 100%; + display: flex; + align-items: center; + justify-content: space-between; + gap: 20px; + padding: 22px 6px; + cursor: pointer; + color: #1f2428; + transition: color 0.18s ease; +} +.pgx.homepage .pgx-acc-head:hover { color: var(--pgx-teal-dark); } +.pgx .pgx-acc-toggle:focus-visible + .pgx-acc-head { outline: 2px solid #7ebed0; outline-offset: 2px; } +.pgx-acc-title { font-size: 1.35rem; font-weight: 600; letter-spacing: -0.018em; white-space: nowrap; flex-shrink: 0; } +.pgx-acc-icon { position: relative; width: 17px; height: 17px; flex-shrink: 0; } +.pgx-acc-icon::before, +.pgx-acc-icon::after { + content: ""; + position: absolute; + background: var(--pgx-teal); + border-radius: 2px; + transition: transform 0.25s ease, opacity 0.25s ease; +} +.pgx-acc-icon::before { left: 0; top: 50%; width: 100%; height: 2px; transform: translateY(-50%); } +.pgx-acc-icon::after { top: 0; left: 50%; width: 2px; height: 100%; transform: translateX(-50%); } +.pgx .pgx-acc-toggle:checked ~ .pgx-acc-head .pgx-acc-icon::after { transform: translateX(-50%) scaleY(0); opacity: 0; } +.pgx-acc-inner { max-height: 0; overflow: hidden; transition: max-height 0.32s ease; } +/* generous cap for the open-state transition; raise if any panel grows taller */ +.pgx .pgx-acc-toggle:checked ~ .pgx-acc-inner { max-height: 1400px; } +.pgx-acc-content { padding: 2px 6px 30px; font-size: 1.05rem; line-height: 1.6; color: #4a5056; max-width: 70em; } +.pgx-acc-content ul { list-style: none; padding: 0; margin: 0; } +.pgx-acc-content li { margin-bottom: 12px; line-height: 1.5; } + +/* ---------- Follow card ---------- */ +.pgx-card--social { text-align: center; align-items: center; justify-content: flex-start; } +.pgx.homepage .pgx-social-title { font-size: 1.35rem; font-weight: 600; letter-spacing: -0.018em; color: #1f2428; line-height: 1.05; text-align: center; margin: 22px 0 28px; } +.pgx-social-icons { display: flex; flex-direction: column; align-items: stretch; } +.pgx.homepage .pgx-ic { + display: flex; + align-items: center; + justify-content: center; + gap: 14px; + min-width: 340px; + min-height: 64px; + padding: 7px 18px; + background: #fafbfc; + border: 1px solid #e3e7ea; + border-radius: 12px; + text-decoration: none; + transition: transform 0.18s ease, background 0.18s ease, box-shadow 0.18s ease; +} +.pgx.homepage .pgx-ic:hover { transform: translateY(-3px); background: #eef1f3; box-shadow: 0 6px 14px rgba(0,0,0,0.08); } +/* label centered in button; icon hangs just to its left */ +.pgx-ic-glyph { + position: absolute; + right: 100%; + top: 50%; + transform: translateY(-50%); + margin-right: 14px; + width: 44px; + height: 44px; + border-radius: 50%; + display: grid; + place-items: center; + color: #ffffff; + flex-shrink: 0; +} +.pgx-ic-glyph svg { width: 26px; height: 26px; fill: currentColor; display: block; } +.pgx-ic-name { position: relative; font-size: 1.08rem; font-weight: 600; letter-spacing: -0.01em; color: #1f2428; } +.pgx-ic--fb .pgx-ic-glyph { background-color: #1877F2; } +.pgx-ic--mast .pgx-ic-glyph { background-color: #6364FF; } +.pgx-ic--bsky .pgx-ic-glyph { background-color: #1185FE; } +.pgx-social-feed { margin: 26px 0 0; font-size: 0.98rem; color: #5b6166; } +.pgx.homepage .pgx-social-feed a { color: var(--pgx-teal-dark); text-decoration: underline; text-underline-offset: 2px; } + +/* ---------- Flex-gap fallback (Safari/iOS <14.1, Chrome <84 ignore flex gap) ---------- */ +/* Margins reproduce the spacing; modern browsers render identically. Wrap rows keep row-gap. */ +.pgx-trust > li:not(:last-child) { margin-right: 36px; } +.pgx-lead-links > *:not(:last-child) { margin-right: 16px; } +.pgx-social-icons > * + * { margin-top: 14px; } +.pgx-card--lead > * + * { margin-top: 20px; } +.pgx .lib.latest > * + * { margin-left: 22px; } +.pgx.homepage a.pgx-shelf-more span { margin-left: 6px; } +.pgx .category-grid a { gap: 0; } /* override base 12px icon gap; margin below */ +.pgx .category-grid .pgx-cat-icon { margin-right: 12px; } +/* .category-grid tile gap (30px) left as flex gap: a margin fallback would + mis-indent wrapped rows on modern browsers. Degrades to denser tiles only. */ + +/* remove container's trailing space so the band meets the footer */ +.page_content:has(> .pgx) { padding-bottom: 0; margin-bottom: 0; } + +@media (max-width: 600px) { + .pgx #slogan { font-size: clamp(2.5rem, 7.5vw, 2.6rem); } + .pgx-flow-popular { margin-top: 44px; margin-bottom: 44px; } + .pgx-card { padding: 28px 22px; } +} + +/* below 410px shrink the slogan with the viewport so it stays on one line */ +@media (max-width: 410px) { + .pgx #slogan { font-size: 9.2vw; } +} + + + + /*------------------------------------*\ ANIMATIONS \*------------------------------------*/ diff --git a/site/index.md b/site/index.md index 02ebbb58..d27babfe 100644 --- a/site/index.md +++ b/site/index.md @@ -4,138 +4,197 @@ title: Free eBooks | Project Gutenberg permalink: / --- -
+
-

Project Gutenberg is a library of over 75,000 free eBooks

+ +
+

75,000+ free eBooks

-

Choose among free epub and Kindle eBooks, download them or read them online. You will find the world's great literature here, with focus on older works for which U.S. copyright has expired. Thousands of volunteers digitized and diligently proofread the eBooks, for you to enjoy.

+

Choose among free eBooks to download or read online. You will find the world's great literature here. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

- -
-
-

Newest Releases find more

-
- {% include latest_covers.html %} -
-
-
+
    +
  • 100% free
    • +
  • No registration
    • +
  • No app required
    • +
+
+ + +
-
-
-

Find Free eBooks

- +
+
+
+
+
+ Most Popular +
+ Browse all +
+
+
+ {% include popular_covers.html %} +
+
+
+
-
-

Project Gutenberg

-
    -
  • ✓ 100% Free - No fees, no registration, completely free
    • -
  • ✓ No Apps Required - only regular Web browsers or eBook readers needed
    • -
  • ✓ 50+ Years - Pioneering free eBooks since 1971
    • -
  • ✓ Volunteer-based - hundreds of volunteers have contributed over the years
    • -
  • ✓ Read about our late CEO, Dr. Greg Newby.
    • -
  • Consider a small donation to help us digitize more books: donate
    • - -
+
+
+
+ Categories +
+ Browse all +
+
+ History + Literature + Science & Technology + Social Sciences & Society + Arts & Culture + Religion & Philosophy + Lifestyle & Hobbies + Health & Medicine + Education & Reference +
-
- -
-
-

Most Popular find more

-
- {% include popular_covers.html %} -
-
-
+
+
+
+
+
+ New Releases +
+ Browse all +
+
+
+ {% include latest_covers.html %} +
+
+
+
+
-
- History - Literature - Science & Technology - Social Sciences & Society - Arts & Culture - Religion & Philosophy - Lifestyle & Hobbies - Health & Medicine - Education & Reference
-
-
-

Get Help

- -

How to Help

-
    -
  • Distributed Proofreaders welcomes new volunteers. This is the main source of new Project Gutenberg eBooks. Getting started is easy, and just a page a day will help!
    • -
  • Fix and improve Project Gutenberg by reporting errors, bugs, typos, and suggesting changes.
    • -
  • Record audiobooks with our friends at LibriVox.
    • -
-
+ +
-
-

Special Areas

- +
+

Project Gutenberg is the world's oldest digital library. Michael Hart started the Project in 1971. Today it is a nonprofit sustained entirely by volunteers who digitize and proofread works of literature as they enter the public domain, keeping them free for everyone, everywhere. We charge nothing, run no ads and never will. Donations are what keep our servers running.

+
+ Learn more + Donate +
+

Read about our late CEO, Dr. Greg Newby.

-
-
-
-

Audio Books

-

Audio books are a great way to enjoy literature. We recommend the following sources. All of them are digitizations of Project Gutenberg texts. They are freely available and in the public domain in the US.

- -
- -
-

Our Social Media

- -

News Feeds of new eBooks

- +
+ +
+
+ +
+ + +
+
+ +
+
+
+ +
+ + +
+
+
    +
  • Distributed Proofreaders welcomes new volunteers. This is the main source of new Project Gutenberg eBooks. Getting started is easy, and just a page a day will help!
    • +
  • Fix and improve Project Gutenberg by reporting errors, bugs, typos, and suggesting changes.
    • +
  • Record audiobooks with our friends at LibriVox.
    • +
+
+
+
+ +
+ + +
+
+

Audio books are a great way to enjoy literature. We recommend the following sources. All of them are digitizations of Project Gutenberg texts. They are freely available and in the public domain in the US.

+ +
+
+
+ +
+ + +
+
+ +
+
+
+ +
+
+ + +
-
+
From e2cbdb89f0ee1c209f8bda8dc392ea5f4daf34ee Mon Sep 17 00:00:00 2001 From: Johannes Date: Sun, 28 Jun 2026 20:04:29 +0100 Subject: [PATCH 02/39] Homepage: New Releases carousel first; add 'library' to slogan --- gutenberg/gutenberg-globals.css | 4 ++-- site/index.md | 18 +++++++++--------- 2 files changed, 11 insertions(+), 11 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 25870cf7..8f0cd153 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3567,7 +3567,7 @@ top: 14px; /* ---------- Shelf flow ---------- */ .pgx-flow { display: flex; flex-direction: column; } -.pgx-flow-popular { margin-top: 48px; margin-bottom: 62px; } +.pgx-flow-newest { margin-top: 48px; margin-bottom: 62px; } .pgx .category-grid { margin-top: 36px; margin-bottom: 62px; gap: 30px; } .pgx .category-grid a { font-size: 1.2rem; padding: 19px 24px; flex-basis: 330px; white-space: nowrap; } @@ -3916,7 +3916,7 @@ top: 14px; @media (max-width: 600px) { .pgx #slogan { font-size: clamp(2.5rem, 7.5vw, 2.6rem); } - .pgx-flow-popular { margin-top: 44px; margin-bottom: 44px; } + .pgx-flow-newest { margin-top: 44px; margin-bottom: 44px; } .pgx-card { padding: 28px 22px; } } diff --git a/site/index.md b/site/index.md index d27babfe..c3339b15 100644 --- a/site/index.md +++ b/site/index.md @@ -8,7 +8,7 @@ permalink: /
-

75,000+ free eBooks

+

A library of 75,000+ free eBooks

Choose among free eBooks to download or read online. You will find the world's great literature here. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

@@ -22,18 +22,18 @@ permalink: /
-
+
- Most Popular + New Releases
- Browse all + Browse all
- {% include popular_covers.html %} + {% include latest_covers.html %}
@@ -60,18 +60,18 @@ permalink: /
-
+
- New Releases + Most Popular
- Browse all + Browse all
- {% include latest_covers.html %} + {% include popular_covers.html %}
From f857a9f0b66f8e9c86c14b1ff966561935877b21 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sun, 28 Jun 2026 20:09:04 +0100 Subject: [PATCH 03/39] Homepage: New Releases carousel first; add 'library' to slogan, smaller slogan --- gutenberg/gutenberg-globals.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 8f0cd153..b8cfea99 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3524,7 +3524,7 @@ top: 14px; /* ---------- Hero ---------- */ .pgx-hero { margin: 28px 0 16px; } -.pgx #slogan { margin: 0 0 18px; padding-bottom: 0; font-size: clamp(2.6rem, 4.6vw, 3.1rem); font-weight: 400; line-height: 1.1; letter-spacing: -0.01em; } +.pgx #slogan { margin: 0 0 18px; padding-bottom: 0; font-size: clamp(2.5rem, 4.6vw, 2.7rem); font-weight: 400; line-height: 1.1; letter-spacing: -0.01em; } .pgx .pgx-mission { margin: 0 0 32px; max-width: 60em; From 4e7aaf6fd8a5eef1dd00bb3dcd9581dbeeb4eded Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 29 Jun 2026 00:17:17 +0100 Subject: [PATCH 04/39] Homepage: subtle teal tint background for the two carousels --- gutenberg/gutenberg-globals.css | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index b8cfea99..119fb7be 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3583,13 +3583,13 @@ top: 14px; .pgx .category-grid a:visited { color: #1f2428; background: #fafbfc; border-color: #e3e7ea; } .pgx .category-grid a:hover { color: #1f2428; background: #eef1f3; border-color: #e3e7ea; transform: translateY(-3px); box-shadow: 0 6px 14px rgba(0,0,0,0.08); } -/* strip the old boxy card chrome around shelves */ +/* shelf card — subtle teal tint (lighter than the .top-header #7ebed0) wrapping header + rail */ .pgx .library { margin: 0; } .pgx .library .box_shadow { - background: transparent; + background: #eef6f9; border: none; - border-radius: 0; - padding: 0; + border-radius: 12px; + padding: 22px 24px; margin: 0; box-shadow: none; } @@ -3636,7 +3636,7 @@ top: 14px; .pgx.homepage a.pgx-shelf-more:hover { color: var(--pgx-teal); background: #eef1f3; text-decoration: none; } .pgx.homepage a.pgx-shelf-more:hover span { opacity: 1; transform: translateX(2px); } -/* the scrolling track — visible thin scrollbar (no JS arrows) */ +/* the scrolling track (tint comes from the .box_shadow card above) */ .pgx-rail { position: relative; } /* right-edge fade: persistent "scroll for more" cue (no JS, all browsers) */ .pgx-rail::after { @@ -3644,13 +3644,13 @@ top: 14px; position: absolute; top: 0; right: 0; bottom: 8px; width: 36px; - background: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,0.8)); + background: linear-gradient(to right, rgba(238,246,249,0), rgba(238,246,249,0.9)); pointer-events: none; z-index: 4; } .pgx .lib.latest { gap: 0; /* overrides base .lib.latest gap:28px; spacing via margin fallback below */ - padding: 18px 4px 18px 14px; + padding: 14px 0; scroll-snap-type: x proximity; scroll-behavior: smooth; } From b548bc63206564ba93d071b9150c64e438226f21 Mon Sep 17 00:00:00 2001 From: Johannes Date: Fri, 3 Jul 2026 18:20:19 +0100 Subject: [PATCH 05/39] Homepage: show live exact ebook count in slogan via book_count include --- .github/workflows/jekyll.yml | 1 + .gitignore | 1 + README.md | 17 +++++++++-------- _includes/book_count_test.html | 1 + site/index.md | 2 +- 5 files changed, 13 insertions(+), 9 deletions(-) create mode 100644 _includes/book_count_test.html diff --git a/.github/workflows/jekyll.yml b/.github/workflows/jekyll.yml index 0c382db3..f0cb0631 100644 --- a/.github/workflows/jekyll.yml +++ b/.github/workflows/jekyll.yml @@ -21,6 +21,7 @@ jobs: run: | cp "./_includes/latest_covers_test.html" "./_includes/latest_covers.html" cp "./_includes/latest_covers_test.html" "./_includes/popular_covers.html" + cp "./_includes/book_count_test.html" "./_includes/book_count.html" - name: Install Jekyll run: | diff --git a/.gitignore b/.gitignore index 3091bcff..65f202cd 100644 --- a/.gitignore +++ b/.gitignore @@ -14,6 +14,7 @@ vendor _includes/latest_covers.html _includes/random_covers.html _includes/popular_covers.html +_includes/book_count.html # Misc to_delete diff --git a/README.md b/README.md index e90fb5e7..93e55286 100644 --- a/README.md +++ b/README.md @@ -14,14 +14,15 @@ First, clone the project: git clone https://github.com/gutenbergtools/gutenbergsite.git cd gutenbergsite -In production, `_includes/latest_covers.html` is generated by a web query on -the prod system. For testing you can -`cp "_includes/latest_covers_test.html" "_includes/latest_covers.html"` - -`latest_covers.html` is not tracked by git. There are two ways to run -a development environment. In either situation, as you edit files, the server -should notice and automatically build the changes into the site without -a restart. +In production, `_includes/latest_covers.html` and `_includes/book_count.html` +are generated by a web query on the prod system. For testing you can +`cp "_includes/latest_covers_test.html" "_includes/latest_covers.html"` and +`cp "_includes/book_count_test.html" "_includes/book_count.html"` + +`latest_covers.html` and `book_count.html` are not tracked by git. There +are two ways to run a development environment. In either situation, as you +edit files, the server should notice and automatically build the changes into +the site without a restart. ### Run locally diff --git a/_includes/book_count_test.html b/_includes/book_count_test.html new file mode 100644 index 00000000..eb89c1ef --- /dev/null +++ b/_includes/book_count_test.html @@ -0,0 +1 @@ +78,000 \ No newline at end of file diff --git a/site/index.md b/site/index.md index c3339b15..bd3e452e 100644 --- a/site/index.md +++ b/site/index.md @@ -8,7 +8,7 @@ permalink: /
-

A library of 75,000+ free eBooks

+

A library of {% include book_count.html %} free eBooks

Choose among free eBooks to download or read online. You will find the world's great literature here. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

From 6f6307beeb7544d38dbd7e0d48b8f8caf6d3c9d0 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sat, 4 Jul 2026 01:56:10 +0100 Subject: [PATCH 06/39] Homepage: revise hero badges and restore copyright-scope line in sub-slogan --- site/index.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/site/index.md b/site/index.md index bd3e452e..cac654c7 100644 --- a/site/index.md +++ b/site/index.md @@ -10,12 +10,12 @@ permalink: /

A library of {% include book_count.html %} free eBooks

-

Choose among free eBooks to download or read online. You will find the world's great literature here. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

+

Choose among free eBooks to download or read online. Here you will find the world's great literature, whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

  • 100% free
  • No registration
    • -
  • No app required
    • +
  • Yours to keep
From 1657ba97c64f90ce24bcbd6ac72aca43382f30e9 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sat, 4 Jul 2026 02:04:40 +0100 Subject: [PATCH 07/39] Homepage: align Categories header/grid with the two carousels --- gutenberg/gutenberg-globals.css | 2 ++ 1 file changed, 2 insertions(+) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 119fb7be..a977c6b7 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3568,6 +3568,8 @@ top: 14px; /* ---------- Shelf flow ---------- */ .pgx-flow { display: flex; flex-direction: column; } .pgx-flow-newest { margin-top: 48px; margin-bottom: 62px; } +/* inset Categories to align with the carousels' .box_shadow 24px padding */ +.pgx .pgx-flow-cats { padding: 0 24px; } .pgx .category-grid { margin-top: 36px; margin-bottom: 62px; gap: 30px; } .pgx .category-grid a { font-size: 1.2rem; padding: 19px 24px; flex-basis: 330px; white-space: nowrap; } From e7ec30c05801c44ab42b06c9465c59a398b52df7 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sat, 4 Jul 2026 14:06:28 +0100 Subject: [PATCH 08/39] Homepage: lead statement legibility + mobile left-align; tighten Categories header/grid; sub-slogan wording --- gutenberg/gutenberg-globals.css | 26 +++++++++++++++++--------- site/index.md | 2 +- 2 files changed, 18 insertions(+), 10 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index a977c6b7..3d8cc703 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3571,7 +3571,7 @@ top: 14px; /* inset Categories to align with the carousels' .box_shadow 24px padding */ .pgx .pgx-flow-cats { padding: 0 24px; } -.pgx .category-grid { margin-top: 36px; margin-bottom: 62px; gap: 30px; } +.pgx .category-grid { margin-top: 6px; margin-bottom: 62px; gap: 30px; } .pgx .category-grid a { font-size: 1.2rem; padding: 19px 24px; flex-basis: 330px; white-space: nowrap; } .pgx .category-grid a:before { content: none; } /* one column below 676px — never a 2-column squeeze */ @@ -3755,7 +3755,7 @@ top: 14px; } /* ---------- Outro: lead statement + explore ---------- */ -.pgx-cards { margin: 14px 0 36px; } +.pgx-cards { margin: 6px 0 36px; } .pgx-lead-text { margin: 0; line-height: 1.72; @@ -3790,17 +3790,18 @@ top: 14px; .pgx.homepage .pgx-lead-note { margin: auto 0 0; padding-top: 8px; font-size: clamp(1.08rem, 1.3vw, 1.22rem); color: #6a7075; } /* Row 1: lead block on its own row, centered and wider */ -.pgx-lead-wide { max-width: 880px; margin: 0 auto 22px; align-items: center; text-align: center; background: transparent; } +.pgx-lead-wide { max-width: 720px; margin: 0 auto 22px; align-items: center; text-align: center; background: transparent; } .pgx-lead-wide .pgx-lead-text { - margin: 26px 0; - max-width: 800px; + margin: 24px 0 4px; + max-width: 680px; text-align: center; text-wrap: balance; - font-size: clamp(1.24rem, 1.55vw, 1.42rem); - line-height: 1.6; - letter-spacing: -0.002em; + color: #2b3037; + font-size: 1.35rem; + line-height: 1.7; + letter-spacing: 0.002em; } -.pgx-lead-wide .pgx-lead-links { justify-content: center; } +.pgx-lead-wide .pgx-lead-links { justify-content: center; margin-top: 12px; } .pgx.homepage .pgx-lead-wide .pgx-lead-note { margin: 20px 0 0; } .pgx.homepage .pgx-lead-note a { color: var(--pgx-teal-dark); text-decoration: underline; text-underline-offset: 2px; } .pgx.homepage .pgx-lead-note a:hover { color: var(--pgx-teal); } @@ -3919,7 +3920,14 @@ top: 14px; @media (max-width: 600px) { .pgx #slogan { font-size: clamp(2.5rem, 7.5vw, 2.6rem); } .pgx-flow-newest { margin-top: 44px; margin-bottom: 44px; } + /* a little more breathing room above Categories on mobile */ + .pgx .pgx-flow-cats { margin-top: 16px; } .pgx-card { padding: 28px 22px; } + /* left-align the lead statement, buttons and note on narrow screens — easier to read than centered */ + .pgx-lead-wide { align-items: stretch; text-align: left; } + .pgx-lead-wide .pgx-lead-text { text-align: left; text-wrap: pretty; } + .pgx-lead-wide .pgx-lead-links { justify-content: flex-start; } + .pgx.homepage .pgx-lead-wide .pgx-lead-note { text-align: left; } } /* below 410px shrink the slogan with the viewport so it stays on one line */ diff --git a/site/index.md b/site/index.md index cac654c7..deb6a04f 100644 --- a/site/index.md +++ b/site/index.md @@ -10,7 +10,7 @@ permalink: /

A library of {% include book_count.html %} free eBooks

-

Choose among free eBooks to download or read online. Here you will find the world's great literature, whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

+

Choose among free eBooks to download or read online. You will find the world's great literature here with a focus on older works whose U.S. copyright has expired. Thousands of volunteers have digitized and proofread these books for you.

  • 100% free
    • From a5ae77d4d3e175530922af6039552433e2043260 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sat, 4 Jul 2026 15:06:02 +0100 Subject: [PATCH 09/39] Homepage: trust badges as inline dot-separated line on mobile (<635px) --- gutenberg/gutenberg-globals.css | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 3d8cc703..7e26482a 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3930,6 +3930,24 @@ top: 14px; .pgx.homepage .pgx-lead-wide .pgx-lead-note { text-align: left; } } +/* trust badges as one inline dot-separated line on narrow screens — font scales + with the viewport so the three stay on a single line at the largest size that fits */ +@media (max-width: 635px) { + .pgx-trust { + flex-wrap: nowrap; + justify-content: flex-start; + gap: 0; + margin-top: 6px; + color: #5b6166; + font-weight: 700; + font-size: clamp(0.8rem, 4vw, 1.45rem); + } + .pgx-trust > li:not(:last-child) { margin-right: 0; } + .pgx-trust li { padding: 0; background: none; border: none; white-space: nowrap; } + .pgx-trust li::before { content: "\00B7"; color: #9aa0a5; font-weight: 700; margin: 0 7px; font-size: 1em; } + .pgx-trust li:first-child::before { content: none; } +} + /* below 410px shrink the slogan with the viewport so it stays on one line */ @media (max-width: 410px) { .pgx #slogan { font-size: 9.2vw; } From b4c63855b0d3230d17c4a2b6fb2e5a20e2efb27b Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 6 Jul 2026 22:49:38 +0100 Subject: [PATCH 10/39] Homepage: experimental 3rd outro card (Newsletter signup); tighten outro gap/width --- gutenberg/gutenberg-globals.css | 11 ++++++++--- site/index.md | 12 +++++++++++- 2 files changed, 19 insertions(+), 4 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 7e26482a..6e31b751 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3780,7 +3780,12 @@ top: 14px; border-radius: 16px; padding: 32px 30px 30px; } -.pgx-cards-row--outro { grid-template-columns: 1.05fr 1fr; gap: 38px; } +.pgx-cards-row--outro { grid-template-columns: 1.15fr 1fr 1fr; gap: 28px; max-width: 1320px; margin: 0 auto; } +.pgx-news-intro { margin: 22px 0 20px; font-size: 0.98rem; line-height: 1.5; color: #5b6166; text-align: center; } +.pgx-news-form { display: flex; flex-direction: column; gap: 12px; } +.pgx-news-input { padding: 12px 14px; border: 1px solid #d3d8dc; border-radius: 10px; font-size: 1rem; background: #fff; } +.pgx-news-input:focus { outline: none; border-color: var(--pgx-teal-dark); } +.pgx.homepage .pgx-news-btn { width: 100%; justify-content: center; } .pgx-cards-row--outro .pgx-card { padding-top: 16px; } .pgx-card--lead { justify-content: flex-start; align-self: start; } .pgx-card--lead .pgx-lead-text { @@ -3790,10 +3795,10 @@ top: 14px; .pgx.homepage .pgx-lead-note { margin: auto 0 0; padding-top: 8px; font-size: clamp(1.08rem, 1.3vw, 1.22rem); color: #6a7075; } /* Row 1: lead block on its own row, centered and wider */ -.pgx-lead-wide { max-width: 720px; margin: 0 auto 22px; align-items: center; text-align: center; background: transparent; } +.pgx-lead-wide { max-width: 820px; margin: 0 auto 6px; align-items: center; text-align: center; background: transparent; } .pgx-lead-wide .pgx-lead-text { margin: 24px 0 4px; - max-width: 680px; + max-width: 780px; text-align: center; text-wrap: balance; color: #2b3037; diff --git a/site/index.md b/site/index.md index deb6a04f..4ba9a7b8 100644 --- a/site/index.md +++ b/site/index.md @@ -10,7 +10,7 @@ permalink: /

    A library of {% include book_count.html %} free eBooks

    -

    Choose among free eBooks to download or read online. You will find the world's great literature here with a focus on older works whose U.S. copyright has expired. Thousands of volunteers have digitized and proofread these books for you.

    +

    Choose among free eBooks to download or read online. You will find great literature here with a focus on older works whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized these books for you to enjoy.

    • 100% free
      • @@ -194,6 +194,16 @@ permalink: / Bluesky.

+ +
From f66d638f10ad525c92c106265feb9da163969c6a Mon Sep 17 00:00:00 2001 From: Johannes Date: Tue, 7 Jul 2026 15:21:28 +0100 Subject: [PATCH 11/39] Homepage: outro cards shrink in tandem; cap/center social buttons; tighten newsletter copy --- gutenberg/gutenberg-globals.css | 15 ++++++++------- site/index.md | 19 ++++++++----------- 2 files changed, 16 insertions(+), 18 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 6e31b751..e3bcd4eb 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3562,7 +3562,7 @@ top: 14px; .pgx.homepage .pgx-btn-primary:hover { background-color: var(--pgx-teal); color: #ffffff; opacity: 0.9; } .pgx.homepage .pgx-btn-secondary { background-color: #ffffff; border: 2px solid var(--pgx-teal); color: var(--pgx-teal-dark); } .pgx.homepage .pgx-btn-secondary:hover { background-color: var(--pgx-card); opacity: 0.9; } -.pgx.homepage .pgx-btn-donate { background-color: var(--pgx-card); } +.pgx.homepage .pgx-btn-donate { background-color: #eaf3f6; } .pgx-lead-links .pgx-btn { min-width: 150px; justify-content: center; } /* ---------- Shelf flow ---------- */ @@ -3780,12 +3780,12 @@ top: 14px; border-radius: 16px; padding: 32px 30px 30px; } -.pgx-cards-row--outro { grid-template-columns: 1.15fr 1fr 1fr; gap: 28px; max-width: 1320px; margin: 0 auto; } +.pgx-cards-row--outro { grid-template-columns: 1.15fr 1fr 1fr; gap: 28px; max-width: 1320px; margin: 12px auto 0; } .pgx-news-intro { margin: 22px 0 20px; font-size: 0.98rem; line-height: 1.5; color: #5b6166; text-align: center; } .pgx-news-form { display: flex; flex-direction: column; gap: 12px; } .pgx-news-input { padding: 12px 14px; border: 1px solid #d3d8dc; border-radius: 10px; font-size: 1rem; background: #fff; } .pgx-news-input:focus { outline: none; border-color: var(--pgx-teal-dark); } -.pgx.homepage .pgx-news-btn { width: 100%; justify-content: center; } +.pgx.homepage .pgx-news-btn { align-self: center; justify-content: center; min-width: 150px; background-color: #eaf3f6; } .pgx-cards-row--outro .pgx-card { padding-top: 16px; } .pgx-card--lead { justify-content: flex-start; align-self: start; } .pgx-card--lead .pgx-lead-text { @@ -3802,7 +3802,7 @@ top: 14px; text-align: center; text-wrap: balance; color: #2b3037; - font-size: 1.35rem; + font-size: clamp(1.3rem, 1.85vw, 1.5rem); line-height: 1.7; letter-spacing: 0.002em; } @@ -3817,7 +3817,6 @@ top: 14px; /* let cards shrink below their content so nothing overflows the viewport */ .pgx-cards-row .pgx-card, .pgx-cards-row--outro .pgx-card { min-width: 0; } - .pgx.homepage .pgx-ic { min-width: 0; } } /* ---------- Accordion (CSS-only via checkbox) ---------- */ @@ -3867,13 +3866,14 @@ top: 14px; /* ---------- Follow card ---------- */ .pgx-card--social { text-align: center; align-items: center; justify-content: flex-start; } .pgx.homepage .pgx-social-title { font-size: 1.35rem; font-weight: 600; letter-spacing: -0.018em; color: #1f2428; line-height: 1.05; text-align: center; margin: 22px 0 28px; } -.pgx-social-icons { display: flex; flex-direction: column; align-items: stretch; } +.pgx-social-icons { display: flex; flex-direction: column; align-items: center; width: 100%; } .pgx.homepage .pgx-ic { display: flex; align-items: center; justify-content: center; gap: 14px; - min-width: 340px; + width: 100%; + max-width: 340px; min-height: 64px; padding: 7px 18px; background: #fafbfc; @@ -3904,6 +3904,7 @@ top: 14px; .pgx-ic--mast .pgx-ic-glyph { background-color: #6364FF; } .pgx-ic--bsky .pgx-ic-glyph { background-color: #1185FE; } .pgx-social-feed { margin: 26px 0 0; font-size: 0.98rem; color: #5b6166; } +.pgx-card--newsletter .pgx-social-feed { text-align: center; } .pgx.homepage .pgx-social-feed a { color: var(--pgx-teal-dark); text-decoration: underline; text-underline-offset: 2px; } /* ---------- Flex-gap fallback (Safari/iOS <14.1, Chrome <84 ignore flex gap) ---------- */ diff --git a/site/index.md b/site/index.md index 4ba9a7b8..a016ddf9 100644 --- a/site/index.md +++ b/site/index.md @@ -10,7 +10,7 @@ permalink: /

A library of {% include book_count.html %} free eBooks

-

Choose among free eBooks to download or read online. You will find great literature here with a focus on older works whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized these books for you to enjoy.

+

Choose free eBooks to download or read online. You will find great literature here with a focus on older works whose U.S. copyright is expired. Thousands of Project Gutenberg volunteers have digitized these books for you.

  • 100% free
    • @@ -172,6 +172,13 @@ permalink: /
+ + From d7c494022b7b07a595ed7c2e0c80ca8f0eafe4ab Mon Sep 17 00:00:00 2001 From: Johannes Date: Tue, 7 Jul 2026 16:04:15 +0100 Subject: [PATCH 12/39] Homepage: pad Newsletter card, tighten title-to-text gap --- gutenberg/gutenberg-globals.css | 3 +++ 1 file changed, 3 insertions(+) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index e3bcd4eb..1d2b4ae9 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3904,6 +3904,9 @@ top: 14px; .pgx-ic--mast .pgx-ic-glyph { background-color: #6364FF; } .pgx-ic--bsky .pgx-ic-glyph { background-color: #1185FE; } .pgx-social-feed { margin: 26px 0 0; font-size: 0.98rem; color: #5b6166; } +.pgx-card--newsletter { padding-left: 44px; padding-right: 44px; } +.pgx.homepage .pgx-card--newsletter .pgx-social-title { margin-bottom: 9px; } +.pgx-card--newsletter .pgx-news-intro { margin-top: 9px; } .pgx-card--newsletter .pgx-social-feed { text-align: center; } .pgx.homepage .pgx-social-feed a { color: var(--pgx-teal-dark); text-decoration: underline; text-underline-offset: 2px; } From 2c83fc164a2146b19ab9c6ba54419ac0f2a767e8 Mon Sep 17 00:00:00 2001 From: Johannes Date: Tue, 7 Jul 2026 16:18:30 +0100 Subject: [PATCH 13/39] Homepage: equal-width outro cards --- gutenberg/gutenberg-globals.css | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 1d2b4ae9..17a55e94 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3780,7 +3780,7 @@ top: 14px; border-radius: 16px; padding: 32px 30px 30px; } -.pgx-cards-row--outro { grid-template-columns: 1.15fr 1fr 1fr; gap: 28px; max-width: 1320px; margin: 12px auto 0; } +.pgx-cards-row--outro { grid-template-columns: 1fr 1fr 1fr; gap: 28px; max-width: 1320px; margin: 12px auto 0; } .pgx-news-intro { margin: 22px 0 20px; font-size: 0.98rem; line-height: 1.5; color: #5b6166; text-align: center; } .pgx-news-form { display: flex; flex-direction: column; gap: 12px; } .pgx-news-input { padding: 12px 14px; border: 1px solid #d3d8dc; border-radius: 10px; font-size: 1rem; background: #fff; } From 9404d7d8a8f4770b2d684b86f07fa31770c9e14d Mon Sep 17 00:00:00 2001 From: Johannes Date: Tue, 7 Jul 2026 16:25:58 +0100 Subject: [PATCH 14/39] Homepage: swap accordion order (Special Areas before Audio Books); fix mission copy grammar --- site/index.md | 34 +++++++++++++++++----------------- 1 file changed, 17 insertions(+), 17 deletions(-) diff --git a/site/index.md b/site/index.md index a016ddf9..55c85bfd 100644 --- a/site/index.md +++ b/site/index.md @@ -10,7 +10,7 @@ permalink: /

A library of {% include book_count.html %} free eBooks

-

Choose free eBooks to download or read online. You will find great literature here with a focus on older works whose U.S. copyright is expired. Thousands of Project Gutenberg volunteers have digitized these books for you.

+

Choose free eBooks to download or read online. You will find great literature here with a focus on older works whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized these books for you.

  • 100% free
    • @@ -132,38 +132,38 @@ permalink: /
- -
- -
-

Read about our late CEO, Dr. Greg Newby.

+

Read about our late CEO, Dr. Greg Newby

From 14246829af8edc94a83e25f6b89affbb9e880b74 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sat, 11 Jul 2026 17:01:50 +0100 Subject: [PATCH 17/39] Homepage: scale sub-slogan with slogan below 410px --- gutenberg/gutenberg-globals.css | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 123d85d1..b1b8e2ef 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3952,9 +3952,11 @@ top: 14px; .pgx-trust li:first-child::before { content: none; } } -/* below 410px shrink the slogan with the viewport so it stays on one line */ +/* below 410px shrink the slogan with the viewport so it stays on one line; + scale the sub-slogan in step so their proportion stays fixed */ @media (max-width: 410px) { .pgx #slogan { font-size: 9.2vw; } + .pgx .pgx-mission { font-size: 4.8vw; } } From fa3f4ef6872cb0a827a4368dc4110a3469fa6371 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sat, 11 Jul 2026 17:32:10 +0100 Subject: [PATCH 18/39] Homepage: avoid orphan word in mission text (text-wrap: pretty) --- gutenberg/gutenberg-globals.css | 1 + 1 file changed, 1 insertion(+) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index b1b8e2ef..c12ee389 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3531,6 +3531,7 @@ top: 14px; font-size: clamp(1.3rem, 1.85vw, 1.5rem); line-height: 1.55; color: #2c3338; + text-wrap: pretty; /* avoid a lone word on the last line */ } .pgx .pgx-mission strong { color: var(--pgx-teal-dark); font-weight: 600; } .pgx-trust { From 3f42621f3fa24f7cc814882c0912d6348769d579 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sun, 2 Aug 2026 17:17:00 +0100 Subject: [PATCH 19/39] Homepage: drop trust badges, restore original slogan text, adopt dev's ebook_count include --- .github/workflows/jekyll.yml | 2 +- .gitignore | 2 +- _includes/book_count_test.html | 1 - gutenberg/gutenberg-globals.css | 31 ------------------------------- site/index.md | 10 ++-------- 5 files changed, 4 insertions(+), 42 deletions(-) delete mode 100644 _includes/book_count_test.html diff --git a/.github/workflows/jekyll.yml b/.github/workflows/jekyll.yml index f0cb0631..2fd8435b 100644 --- a/.github/workflows/jekyll.yml +++ b/.github/workflows/jekyll.yml @@ -21,7 +21,7 @@ jobs: run: | cp "./_includes/latest_covers_test.html" "./_includes/latest_covers.html" cp "./_includes/latest_covers_test.html" "./_includes/popular_covers.html" - cp "./_includes/book_count_test.html" "./_includes/book_count.html" + cp "./_includes/ebook_count_test" "./_includes/ebook_count" - name: Install Jekyll run: | diff --git a/.gitignore b/.gitignore index 65f202cd..42077679 100644 --- a/.gitignore +++ b/.gitignore @@ -14,7 +14,7 @@ vendor _includes/latest_covers.html _includes/random_covers.html _includes/popular_covers.html -_includes/book_count.html +_includes/ebook_count # Misc to_delete diff --git a/_includes/book_count_test.html b/_includes/book_count_test.html deleted file mode 100644 index eb89c1ef..00000000 --- a/_includes/book_count_test.html +++ /dev/null @@ -1 +0,0 @@ -78,000 \ No newline at end of file diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index c12ee389..cc52f9dd 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3534,18 +3534,6 @@ top: 14px; text-wrap: pretty; /* avoid a lone word on the last line */ } .pgx .pgx-mission strong { color: var(--pgx-teal-dark); font-weight: 600; } -.pgx-trust { - display: flex; - flex-wrap: wrap; - row-gap: 12px; - list-style: none; - padding: 0; - margin: 0; - color: #3f454b; - font-size: 1.36rem; -} -.pgx-trust li { display: inline-flex; align-items: center; white-space: nowrap; } -.pgx-trust li::before { content: "\2713"; color: var(--pgx-teal); font-weight: 700; margin-right: 10px; font-size: 1.05em; } /* ---------- Buttons ---------- */ .pgx.homepage .pgx-btn { @@ -3908,7 +3896,6 @@ top: 14px; /* ---------- Flex-gap fallback (Safari/iOS <14.1, Chrome <84 ignore flex gap) ---------- */ /* Margins reproduce the spacing; modern browsers render identically. Wrap rows keep row-gap. */ -.pgx-trust > li:not(:last-child) { margin-right: 36px; } .pgx-lead-links > *:not(:last-child) { margin-right: 16px; } .pgx-social-icons > * + * { margin-top: 14px; } .pgx-card--lead > * + * { margin-top: 20px; } @@ -3935,24 +3922,6 @@ top: 14px; .pgx.homepage .pgx-lead-wide .pgx-lead-note { text-align: left; } } -/* trust badges as one inline dot-separated line on narrow screens — font scales - with the viewport so the three stay on a single line at the largest size that fits */ -@media (max-width: 635px) { - .pgx-trust { - flex-wrap: nowrap; - justify-content: flex-start; - gap: 0; - margin-top: 6px; - color: #5b6166; - font-weight: 700; - font-size: clamp(0.8rem, 4vw, 1.45rem); - } - .pgx-trust > li:not(:last-child) { margin-right: 0; } - .pgx-trust li { padding: 0; background: none; border: none; white-space: nowrap; } - .pgx-trust li::before { content: "\00B7"; color: #9aa0a5; font-weight: 700; margin: 0 7px; font-size: 1em; } - .pgx-trust li:first-child::before { content: none; } -} - /* below 410px shrink the slogan with the viewport so it stays on one line; scale the sub-slogan in step so their proportion stays fixed */ @media (max-width: 410px) { diff --git a/site/index.md b/site/index.md index 8ddc699b..546a0cb5 100644 --- a/site/index.md +++ b/site/index.md @@ -8,15 +8,9 @@ permalink: /
-

A library of {% include book_count.html %} free eBooks

+

Project Gutenberg is a library of {% include ebook_count %} free eBooks.

-

Choose free eBooks to download or read online. You will find great literature here with a focus on older works whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized these books for you.

- -
    -
  • 100% free
    • -
  • No registration
    • -
  • Yours to keep
    • -
+

Choose free eBooks to download or read online. You will find the world's great literature here with a focus on older works whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

From f2af376b9658ce77df4ece63333de2ce1d172973 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sun, 2 Aug 2026 17:19:37 +0100 Subject: [PATCH 20/39] README: point count include at dev's ebook_count naming --- README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/README.md b/README.md index 93e55286..0093a9d2 100644 --- a/README.md +++ b/README.md @@ -14,12 +14,12 @@ First, clone the project: git clone https://github.com/gutenbergtools/gutenbergsite.git cd gutenbergsite -In production, `_includes/latest_covers.html` and `_includes/book_count.html` +In production, `_includes/latest_covers.html` and `_includes/ebook_count` are generated by a web query on the prod system. For testing you can `cp "_includes/latest_covers_test.html" "_includes/latest_covers.html"` and -`cp "_includes/book_count_test.html" "_includes/book_count.html"` +`cp "_includes/ebook_count_test" "_includes/ebook_count"` -`latest_covers.html` and `book_count.html` are not tracked by git. There +`latest_covers.html` and `ebook_count` are not tracked by git. There are two ways to run a development environment. In either situation, as you edit files, the server should notice and automatically build the changes into the site without a restart. From 5762c5cb3b9bd22002e61b380974f7a6642cfeb6 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sun, 2 Aug 2026 17:25:28 +0100 Subject: [PATCH 21/39] Homepage: drop trailing period from slogan --- site/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/site/index.md b/site/index.md index 546a0cb5..6a1642a6 100644 --- a/site/index.md +++ b/site/index.md @@ -8,7 +8,7 @@ permalink: /
-

Project Gutenberg is a library of {% include ebook_count %} free eBooks.

+

Project Gutenberg is a library of {% include ebook_count %} free eBooks

Choose free eBooks to download or read online. You will find the world's great literature here with a focus on older works whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

From f8d8a13a88c8a95ad9948efce7db67888b157b16 Mon Sep 17 00:00:00 2001 From: Johannes Date: Sun, 2 Aug 2026 17:52:02 +0100 Subject: [PATCH 22/39] Homepage: add end-of-rail more card to carousels; name Browse all destinations --- gutenberg/gutenberg-globals.css | 37 +++++++++++++++++++++++++++++++++ site/index.md | 8 ++++--- 2 files changed, 42 insertions(+), 3 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index cc52f9dd..9404e525 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3743,6 +3743,43 @@ top: 14px; height: auto; } +/* end-of-rail "more" card: makes the destination reachable by scrolling too */ +.pgx .lib.latest > a.pgx-more-card { + display: flex; + flex-direction: column; + align-items: flex-start; + flex-shrink: 0; + text-decoration: none; + padding-right: 44px; /* keeps the card clear of the .pgx-rail::after fade */ +} +.pgx-more-card-box { + display: flex; + align-items: center; + justify-content: center; + width: 106px; + height: 159px; + border: 1px dashed #b3c3c9; + border-radius: 3px; + background: rgba(255, 255, 255, 0.5); + font-size: 2rem; + line-height: 1; + color: var(--pgx-teal); + transition: transform 0.22s ease, background 0.22s ease, border-color 0.22s ease; +} +.pgx .lib.latest > a.pgx-more-card:hover .pgx-more-card-box { + transform: translateY(-6px); + background: #ffffff; + border-color: var(--pgx-teal); +} +.pgx-more-card-label { + margin-top: 11px; + width: 118px; + font-size: 0.9rem; + font-weight: 600; + line-height: 1.32; + color: var(--pgx-teal); +} + /* ---------- Outro: lead statement + explore ---------- */ .pgx-cards { margin: 6px 0 36px; } .pgx-lead-text { diff --git a/site/index.md b/site/index.md index 6a1642a6..02fdcffe 100644 --- a/site/index.md +++ b/site/index.md @@ -23,11 +23,12 @@ permalink: /
New Releases
- Browse all + All new releases
{% include latest_covers.html %} + All new releases
@@ -39,7 +40,7 @@ permalink: /
Categories
- Browse all + All categories
History @@ -61,11 +62,12 @@ permalink: /
Most Popular
- Browse all + All popular books
{% include popular_covers.html %} + All popular books
From 59eb6c8553a87451825de812a55b7a89429f61d6 Mon Sep 17 00:00:00 2001 From: eric Date: Sun, 2 Aug 2026 21:01:26 -0400 Subject: [PATCH 23/39] fix some conflict --- _includes/ebook_count | 1 + site/index.md | 4 ++++ 2 files changed, 5 insertions(+) create mode 100644 _includes/ebook_count diff --git a/_includes/ebook_count b/_includes/ebook_count new file mode 100644 index 00000000..f9ad9f5f --- /dev/null +++ b/_includes/ebook_count @@ -0,0 +1 @@ +79,007 \ No newline at end of file diff --git a/site/index.md b/site/index.md index 6a1642a6..c3e8c4e4 100644 --- a/site/index.md +++ b/site/index.md @@ -8,7 +8,11 @@ permalink: /
+<<<<<<< Updated upstream

Project Gutenberg is a library of {% include ebook_count %} free eBooks

+======= +

A library of {% include ebook_count %} free eBooks

+>>>>>>> Stashed changes

Choose free eBooks to download or read online. You will find the world's great literature here with a focus on older works whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

From 0aaa863ba0c625a78d751c5f9d416ad441df2103 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 15:21:24 +0100 Subject: [PATCH 24/39] Fix stray conflict markers in hero; untrack generated ebook_count --- _includes/ebook_count | 1 - site/index.md | 4 ---- 2 files changed, 5 deletions(-) delete mode 100644 _includes/ebook_count diff --git a/_includes/ebook_count b/_includes/ebook_count deleted file mode 100644 index f9ad9f5f..00000000 --- a/_includes/ebook_count +++ /dev/null @@ -1 +0,0 @@ -79,007 \ No newline at end of file diff --git a/site/index.md b/site/index.md index 0da2e351..02fdcffe 100644 --- a/site/index.md +++ b/site/index.md @@ -8,11 +8,7 @@ permalink: /
-<<<<<<< Updated upstream

Project Gutenberg is a library of {% include ebook_count %} free eBooks

-======= -

A library of {% include ebook_count %} free eBooks

->>>>>>> Stashed changes

Choose free eBooks to download or read online. You will find the world's great literature here with a focus on older works whose U.S. copyright has expired. Thousands of Project Gutenberg volunteers have digitized and proofread these books for you.

From 766bec3f64f283f339698970930bdbf5adca053d Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 15:34:34 +0100 Subject: [PATCH 25/39] Homepage: hide shelf header more-links below 600px --- gutenberg/gutenberg-globals.css | 4 ++++ 1 file changed, 4 insertions(+) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 9404e525..1432fea5 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3957,6 +3957,10 @@ top: 14px; .pgx-lead-wide .pgx-lead-text { text-align: left; text-wrap: pretty; } .pgx-lead-wide .pgx-lead-links { justify-content: flex-start; } .pgx.homepage .pgx-lead-wide .pgx-lead-note { text-align: left; } + /* the header "all ..." link crowds the shelf title on narrow screens; drop it. + The rails keep their end-of-rail more card, and every category tile already + links to the categories page. */ + .pgx.homepage a.pgx-shelf-more { display: none; } } /* below 410px shrink the slogan with the viewport so it stays on one line; From 07536842156e12f9ab6923aa2efeb4bd52a3db3c Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 15:40:43 +0100 Subject: [PATCH 26/39] Homepage: drop end-of-rail more cards; shorten shelf links to All releases / All categories / All popular --- gutenberg/gutenberg-globals.css | 41 --------------------------------- site/index.md | 6 ++--- 2 files changed, 2 insertions(+), 45 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 1432fea5..cc52f9dd 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3743,43 +3743,6 @@ top: 14px; height: auto; } -/* end-of-rail "more" card: makes the destination reachable by scrolling too */ -.pgx .lib.latest > a.pgx-more-card { - display: flex; - flex-direction: column; - align-items: flex-start; - flex-shrink: 0; - text-decoration: none; - padding-right: 44px; /* keeps the card clear of the .pgx-rail::after fade */ -} -.pgx-more-card-box { - display: flex; - align-items: center; - justify-content: center; - width: 106px; - height: 159px; - border: 1px dashed #b3c3c9; - border-radius: 3px; - background: rgba(255, 255, 255, 0.5); - font-size: 2rem; - line-height: 1; - color: var(--pgx-teal); - transition: transform 0.22s ease, background 0.22s ease, border-color 0.22s ease; -} -.pgx .lib.latest > a.pgx-more-card:hover .pgx-more-card-box { - transform: translateY(-6px); - background: #ffffff; - border-color: var(--pgx-teal); -} -.pgx-more-card-label { - margin-top: 11px; - width: 118px; - font-size: 0.9rem; - font-weight: 600; - line-height: 1.32; - color: var(--pgx-teal); -} - /* ---------- Outro: lead statement + explore ---------- */ .pgx-cards { margin: 6px 0 36px; } .pgx-lead-text { @@ -3957,10 +3920,6 @@ top: 14px; .pgx-lead-wide .pgx-lead-text { text-align: left; text-wrap: pretty; } .pgx-lead-wide .pgx-lead-links { justify-content: flex-start; } .pgx.homepage .pgx-lead-wide .pgx-lead-note { text-align: left; } - /* the header "all ..." link crowds the shelf title on narrow screens; drop it. - The rails keep their end-of-rail more card, and every category tile already - links to the categories page. */ - .pgx.homepage a.pgx-shelf-more { display: none; } } /* below 410px shrink the slogan with the viewport so it stays on one line; diff --git a/site/index.md b/site/index.md index 02fdcffe..a714147f 100644 --- a/site/index.md +++ b/site/index.md @@ -23,12 +23,11 @@ permalink: /
New Releases
- All new releases + All releases
{% include latest_covers.html %} - All new releases
@@ -62,12 +61,11 @@ permalink: /
Most Popular
- All popular books + All popular
{% include popular_covers.html %} - All popular books
From 9de9adb5fae66c9f0ec939c3c524bcd1887beff1 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 15:44:47 +0100 Subject: [PATCH 27/39] Homepage: rename shelf links to All New Releases / All Popular Books --- site/index.md | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/site/index.md b/site/index.md index a714147f..d250dc43 100644 --- a/site/index.md +++ b/site/index.md @@ -23,7 +23,7 @@ permalink: /
New Releases
- All releases + All New Releases
@@ -61,7 +61,7 @@ permalink: /
Most Popular
- All popular + All Popular Books
From a1758e7eb1324c464702c789481525a329999896 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 15:46:19 +0100 Subject: [PATCH 28/39] Homepage: shelf links become "View all" without arrow on narrow screens --- gutenberg/gutenberg-globals.css | 13 ++++++++++--- site/index.md | 6 +++--- 2 files changed, 13 insertions(+), 6 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index cc52f9dd..f89ea9fb 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3619,13 +3619,15 @@ top: 14px; border-radius: 8px; transition: color 0.18s ease, background 0.18s ease; } -.pgx.homepage a.pgx-shelf-more span { +.pgx.homepage a.pgx-shelf-more .pgx-shelf-arrow { font-size: 1.3em; opacity: 0.8; transition: opacity 0.18s ease, transform 0.18s ease; } .pgx.homepage a.pgx-shelf-more:hover { color: var(--pgx-teal); background: #eef1f3; text-decoration: none; } -.pgx.homepage a.pgx-shelf-more:hover span { opacity: 1; transform: translateX(2px); } +.pgx.homepage a.pgx-shelf-more:hover .pgx-shelf-arrow { opacity: 1; transform: translateX(2px); } +/* the short label only appears at the narrow breakpoint below */ +.pgx.homepage a.pgx-shelf-more .pgx-shelf-more-short { display: none; } /* the scrolling track (tint comes from the .box_shadow card above) */ .pgx-rail { position: relative; } @@ -3900,7 +3902,7 @@ top: 14px; .pgx-social-icons > * + * { margin-top: 14px; } .pgx-card--lead > * + * { margin-top: 20px; } .pgx .lib.latest > * + * { margin-left: 22px; } -.pgx.homepage a.pgx-shelf-more span { margin-left: 6px; } +.pgx.homepage a.pgx-shelf-more .pgx-shelf-arrow { margin-left: 6px; } .pgx .category-grid a { gap: 0; } /* override base 12px icon gap; margin below */ .pgx .category-grid .pgx-cat-icon { margin-right: 12px; } /* .category-grid tile gap (30px) left as flex gap: a margin fallback would @@ -3920,6 +3922,11 @@ top: 14px; .pgx-lead-wide .pgx-lead-text { text-align: left; text-wrap: pretty; } .pgx-lead-wide .pgx-lead-links { justify-content: flex-start; } .pgx.homepage .pgx-lead-wide .pgx-lead-note { text-align: left; } + /* narrow shelf heads: the full label crowds the title, so swap in "View all" + and drop the arrow */ + .pgx.homepage a.pgx-shelf-more .pgx-shelf-more-full, + .pgx.homepage a.pgx-shelf-more .pgx-shelf-arrow { display: none; } + .pgx.homepage a.pgx-shelf-more .pgx-shelf-more-short { display: inline; } } /* below 410px shrink the slogan with the viewport so it stays on one line; diff --git a/site/index.md b/site/index.md index d250dc43..7d069fd9 100644 --- a/site/index.md +++ b/site/index.md @@ -23,7 +23,7 @@ permalink: /
New Releases
- All New Releases + All New ReleasesView all
@@ -39,7 +39,7 @@ permalink: /
Categories
- All categories + All categoriesView all
History @@ -61,7 +61,7 @@ permalink: /
Most Popular
- All Popular Books + All Popular BooksView all
From 23bbbc99962fe3e63a4ba02e952dc2ffe5ceaa1e Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 15:47:23 +0100 Subject: [PATCH 29/39] Homepage: covers flex to fill the carousel width on wide screens --- gutenberg/gutenberg-globals.css | 21 ++++++++++++--------- 1 file changed, 12 insertions(+), 9 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index f89ea9fb..b59e581c 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3651,27 +3651,30 @@ top: 14px; .pgx .lib.latest::-webkit-scrollbar-thumb { background-color: #b8b8b8; border-radius: 10px; } .pgx .lib.latest::-webkit-scrollbar-track { background-color: #f1f1f1; border-radius: 10px; } -/* book card */ +/* book card: grows to fill the rail on wide screens, never below 106px */ .pgx .lib.latest > a { position: relative; + flex: 1 0 106px; + max-width: 152px; scroll-snap-align: start; border-radius: 4px; } .pgx .lib.latest .cover_image { - width: 106px; + width: 100%; height: auto; transition: transform 0.22s ease; } .pgx .lib.latest a:hover .cover_image { transform: translateY(-6px); } .pgx .lib.latest .cover_img { position: relative; - width: 106px; - height: 159px; + width: 100%; + aspect-ratio: 2 / 3; border-radius: 3px; } .pgx .lib.latest .cover_img img { - width: 106px; - height: 159px; + width: 100%; + height: 100%; + object-fit: cover; border-radius: 3px 4px 4px 3px; box-shadow: 0 1px 2px rgba(0, 0, 0, 0.16), @@ -3718,14 +3721,14 @@ top: 14px; /* title + author block */ .pgx .lib.latest .cover_title { margin-top: 11px; - width: 118px; - max-width: 118px; + width: 100%; + max-width: none; text-align: left; background: transparent; } .pgx .lib.latest .cover_title h5, .pgx .lib.latest .cover_title .h5 { - width: 118px; + width: 100%; height: auto; font-size: 0.9rem; font-weight: 600; From 183ecc49dff2831cf018a4bae42b9104152760f7 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 15:55:29 +0100 Subject: [PATCH 30/39] Homepage: replace shelf header links with end-of-rail see-more cards --- gutenberg/gutenberg-globals.css | 70 ++++++++++++++++++--------------- site/index.md | 5 +-- 2 files changed, 40 insertions(+), 35 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index b59e581c..17c8f792 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3603,32 +3603,6 @@ top: 14px; color: #1f2428; line-height: 1.05; } -.pgx.homepage a.pgx-shelf-more { - display: inline-flex; - align-items: center; - flex-shrink: 0; - font-size: 0.82rem; - font-weight: 700; - letter-spacing: 0.15em; - text-transform: uppercase; - color: var(--pgx-teal); - text-decoration: none; - white-space: nowrap; - padding: 6px 10px; - margin: -6px -10px; - border-radius: 8px; - transition: color 0.18s ease, background 0.18s ease; -} -.pgx.homepage a.pgx-shelf-more .pgx-shelf-arrow { - font-size: 1.3em; - opacity: 0.8; - transition: opacity 0.18s ease, transform 0.18s ease; -} -.pgx.homepage a.pgx-shelf-more:hover { color: var(--pgx-teal); background: #eef1f3; text-decoration: none; } -.pgx.homepage a.pgx-shelf-more:hover .pgx-shelf-arrow { opacity: 1; transform: translateX(2px); } -/* the short label only appears at the narrow breakpoint below */ -.pgx.homepage a.pgx-shelf-more .pgx-shelf-more-short { display: none; } - /* the scrolling track (tint comes from the .box_shadow card above) */ .pgx-rail { position: relative; } /* right-edge fade: persistent "scroll for more" cue (no JS, all browsers) */ @@ -3748,6 +3722,44 @@ top: 14px; height: auto; } +/* end-of-rail card: the shelf's "see more" destination, reached by scrolling */ +.pgx .lib.latest > a.pgx-more-card { + display: flex; + flex-direction: column; + align-items: flex-start; + flex: 1 0 150px; + max-width: 196px; + padding-right: 44px; /* keeps the card clear of the .pgx-rail::after fade */ + text-decoration: none; +} +.pgx-more-card-box { + display: flex; + align-items: center; + justify-content: center; + width: 100%; + aspect-ratio: 2 / 3; + border: 1px dashed #b3c3c9; + border-radius: 3px; + background: rgba(255, 255, 255, 0.5); + font-size: 2rem; + line-height: 1; + color: var(--pgx-teal); + transition: transform 0.22s ease, background 0.22s ease, border-color 0.22s ease; +} +.pgx .lib.latest > a.pgx-more-card:hover .pgx-more-card-box { + transform: translateY(-6px); + background: #ffffff; + border-color: var(--pgx-teal); +} +.pgx-more-card-label { + margin-top: 11px; + width: 100%; + font-size: 0.9rem; + font-weight: 600; + line-height: 1.32; + color: var(--pgx-teal); +} + /* ---------- Outro: lead statement + explore ---------- */ .pgx-cards { margin: 6px 0 36px; } .pgx-lead-text { @@ -3905,7 +3917,6 @@ top: 14px; .pgx-social-icons > * + * { margin-top: 14px; } .pgx-card--lead > * + * { margin-top: 20px; } .pgx .lib.latest > * + * { margin-left: 22px; } -.pgx.homepage a.pgx-shelf-more .pgx-shelf-arrow { margin-left: 6px; } .pgx .category-grid a { gap: 0; } /* override base 12px icon gap; margin below */ .pgx .category-grid .pgx-cat-icon { margin-right: 12px; } /* .category-grid tile gap (30px) left as flex gap: a margin fallback would @@ -3925,11 +3936,6 @@ top: 14px; .pgx-lead-wide .pgx-lead-text { text-align: left; text-wrap: pretty; } .pgx-lead-wide .pgx-lead-links { justify-content: flex-start; } .pgx.homepage .pgx-lead-wide .pgx-lead-note { text-align: left; } - /* narrow shelf heads: the full label crowds the title, so swap in "View all" - and drop the arrow */ - .pgx.homepage a.pgx-shelf-more .pgx-shelf-more-full, - .pgx.homepage a.pgx-shelf-more .pgx-shelf-arrow { display: none; } - .pgx.homepage a.pgx-shelf-more .pgx-shelf-more-short { display: inline; } } /* below 410px shrink the slogan with the viewport so it stays on one line; diff --git a/site/index.md b/site/index.md index 7d069fd9..523a002f 100644 --- a/site/index.md +++ b/site/index.md @@ -23,11 +23,11 @@ permalink: /
New Releases
- All New ReleasesView all
{% include latest_covers.html %} + All New Releases
@@ -39,7 +39,6 @@ permalink: /
Categories
- All categoriesView all
History @@ -61,11 +60,11 @@ permalink: /
Most Popular
- All Popular BooksView all
{% include popular_covers.html %} + All Popular Books
From f50450bb5fac6886abe36ede95ad0ef436ec4081 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 16:00:10 +0100 Subject: [PATCH 31/39] Homepage: end-of-rail card shows its label in the tile, arrow below --- gutenberg/gutenberg-globals.css | 11 +++++++---- site/index.md | 4 ++-- 2 files changed, 9 insertions(+), 6 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 17c8f792..cfeeee09 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3741,8 +3741,11 @@ top: 14px; border: 1px dashed #b3c3c9; border-radius: 3px; background: rgba(255, 255, 255, 0.5); - font-size: 2rem; - line-height: 1; + padding: 0 14px; + text-align: center; + font-size: 1rem; + font-weight: 600; + line-height: 1.35; color: var(--pgx-teal); transition: transform 0.22s ease, background 0.22s ease, border-color 0.22s ease; } @@ -3754,8 +3757,8 @@ top: 14px; .pgx-more-card-label { margin-top: 11px; width: 100%; - font-size: 0.9rem; - font-weight: 600; + text-align: center; + font-size: 1.5rem; line-height: 1.32; color: var(--pgx-teal); } diff --git a/site/index.md b/site/index.md index 523a002f..b213b88d 100644 --- a/site/index.md +++ b/site/index.md @@ -27,7 +27,7 @@ permalink: /
{% include latest_covers.html %} - All New Releases + All New Releases
@@ -64,7 +64,7 @@ permalink: /
{% include popular_covers.html %} - All Popular Books + All Popular Books
From b3cb123cc0b7cfb4908557875b8da81345bee887 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 16:02:59 +0100 Subject: [PATCH 32/39] Homepage: end-of-rail tile matches cover size; balance its label over lines --- gutenberg/gutenberg-globals.css | 11 ++++++----- 1 file changed, 6 insertions(+), 5 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index cfeeee09..2a2a77a5 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3727,9 +3727,9 @@ top: 14px; display: flex; flex-direction: column; align-items: flex-start; - flex: 1 0 150px; - max-width: 196px; - padding-right: 44px; /* keeps the card clear of the .pgx-rail::after fade */ + flex: 1 0 106px; /* identical sizing to a book card */ + max-width: 152px; + margin-right: 44px; /* trailing space clears the .pgx-rail::after fade */ text-decoration: none; } .pgx-more-card-box { @@ -3741,9 +3741,10 @@ top: 14px; border: 1px dashed #b3c3c9; border-radius: 3px; background: rgba(255, 255, 255, 0.5); - padding: 0 14px; + padding: 0 12px; text-align: center; - font-size: 1rem; + text-wrap: balance; + font-size: 0.95rem; font-weight: 600; line-height: 1.35; color: var(--pgx-teal); From 08c4b2798128130bb973283dcae0c2cd824bdae2 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 16:05:44 +0100 Subject: [PATCH 33/39] Homepage: end-of-rail tile defaults to the outlined look, fills teal on hover --- gutenberg/gutenberg-globals.css | 16 ++++++++++------ 1 file changed, 10 insertions(+), 6 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 2a2a77a5..a5ddf21a 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3738,9 +3738,9 @@ top: 14px; justify-content: center; width: 100%; aspect-ratio: 2 / 3; - border: 1px dashed #b3c3c9; + border: 1px dashed var(--pgx-teal); border-radius: 3px; - background: rgba(255, 255, 255, 0.5); + background: #ffffff; padding: 0 12px; text-align: center; text-wrap: balance; @@ -3748,15 +3748,19 @@ top: 14px; font-weight: 600; line-height: 1.35; color: var(--pgx-teal); - transition: transform 0.22s ease, background 0.22s ease, border-color 0.22s ease; + transition: background 0.22s ease, color 0.22s ease, border-color 0.22s ease; } .pgx .lib.latest > a.pgx-more-card:hover .pgx-more-card-box { - transform: translateY(-6px); - background: #ffffff; - border-color: var(--pgx-teal); + background: var(--pgx-teal); + border-style: solid; + color: #ffffff; +} +.pgx .lib.latest > a.pgx-more-card:hover .pgx-more-card-label { + transform: translateX(4px); } .pgx-more-card-label { margin-top: 11px; + transition: transform 0.22s ease; width: 100%; text-align: center; font-size: 1.5rem; From 8f916bf4f3d7adcc82c9f8497217c9c3ee418051 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 16:07:15 +0100 Subject: [PATCH 34/39] Homepage: tighten and scope the end-of-rail card CSS --- gutenberg/gutenberg-globals.css | 36 +++++++++++++-------------------- 1 file changed, 14 insertions(+), 22 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index a5ddf21a..019b4abd 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3726,47 +3726,39 @@ top: 14px; .pgx .lib.latest > a.pgx-more-card { display: flex; flex-direction: column; - align-items: flex-start; flex: 1 0 106px; /* identical sizing to a book card */ max-width: 152px; margin-right: 44px; /* trailing space clears the .pgx-rail::after fade */ + color: var(--pgx-teal); text-decoration: none; } -.pgx-more-card-box { - display: flex; - align-items: center; - justify-content: center; - width: 100%; +.pgx .pgx-more-card-box { + display: grid; + place-items: center; aspect-ratio: 2 / 3; + padding: 0 12px; border: 1px dashed var(--pgx-teal); border-radius: 3px; background: #ffffff; - padding: 0 12px; text-align: center; text-wrap: balance; font-size: 0.95rem; font-weight: 600; line-height: 1.35; - color: var(--pgx-teal); - transition: background 0.22s ease, color 0.22s ease, border-color 0.22s ease; + transition: background 0.22s ease, color 0.22s ease; } -.pgx .lib.latest > a.pgx-more-card:hover .pgx-more-card-box { - background: var(--pgx-teal); - border-style: solid; - color: #ffffff; -} -.pgx .lib.latest > a.pgx-more-card:hover .pgx-more-card-label { - transform: translateX(4px); -} -.pgx-more-card-label { +.pgx .pgx-more-card-label { margin-top: 11px; - transition: transform 0.22s ease; - width: 100%; text-align: center; font-size: 1.5rem; - line-height: 1.32; - color: var(--pgx-teal); + transition: transform 0.22s ease; +} +.pgx .pgx-more-card:hover .pgx-more-card-box { + border-style: solid; + background: var(--pgx-teal); + color: #ffffff; } +.pgx .pgx-more-card:hover .pgx-more-card-label { transform: translateX(4px); } /* ---------- Outro: lead statement + explore ---------- */ .pgx-cards { margin: 6px 0 36px; } From 9b9ef6d0c29518428bd08fbdfa3e48f46e16ab30 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 16:14:27 +0100 Subject: [PATCH 35/39] Homepage: reduce gap between mission text and the first carousel --- gutenberg/gutenberg-globals.css | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/gutenberg/gutenberg-globals.css b/gutenberg/gutenberg-globals.css index 019b4abd..9381c355 100644 --- a/gutenberg/gutenberg-globals.css +++ b/gutenberg/gutenberg-globals.css @@ -3556,7 +3556,7 @@ top: 14px; /* ---------- Shelf flow ---------- */ .pgx-flow { display: flex; flex-direction: column; } -.pgx-flow-newest { margin-top: 48px; margin-bottom: 62px; } +.pgx-flow-newest { margin-top: 28px; margin-bottom: 62px; } /* inset Categories to align with the carousels' .box_shadow 24px padding */ .pgx .pgx-flow-cats { padding: 0 24px; } @@ -3927,7 +3927,7 @@ top: 14px; @media (max-width: 600px) { .pgx #slogan { font-size: clamp(2.5rem, 7.5vw, 2.6rem); } - .pgx-flow-newest { margin-top: 44px; margin-bottom: 44px; } + .pgx-flow-newest { margin-top: 28px; margin-bottom: 44px; } /* a little more breathing room above Categories on mobile */ .pgx .pgx-flow-cats { margin-top: 16px; } .pgx-card { padding: 28px 22px; } From b6b521baac3d7297d6d3c29c6af7c0370c6bcc40 Mon Sep 17 00:00:00 2001 From: Johannes Date: Mon, 3 Aug 2026 16:38:14 +0100 Subject: [PATCH 36/39] Homepage: document icon sources and move the category grid into an include --- _includes/category_grid.html | 40 ++++++++++++++++++++++++++++++++++++ site/index.md | 14 +++---------- 2 files changed, 43 insertions(+), 11 deletions(-) create mode 100644 _includes/category_grid.html diff --git a/_includes/category_grid.html b/_includes/category_grid.html new file mode 100644 index 00000000..93ccac4f --- /dev/null +++ b/_includes/category_grid.html @@ -0,0 +1,40 @@ + +
+ + + History + + + + Literature + + + + Science & Technology + + + + Social Sciences & Society + + + + Arts & Culture + + + + Religion & Philosophy + + + + Lifestyle & Hobbies + + + + Health & Medicine + + + + Education & Reference + +
diff --git a/site/index.md b/site/index.md index b213b88d..690a24f1 100644 --- a/site/index.md +++ b/site/index.md @@ -40,17 +40,7 @@ permalink: / Categories -
- History - Literature - Science & Technology - Social Sciences & Society - Arts & Culture - Religion & Philosophy - Lifestyle & Hobbies - Health & Medicine - Education & Reference -
+ {% include category_grid.html %}
@@ -174,6 +164,8 @@ permalink: /