Repository: Hestenb62/_legacy_backup
Author: Hesten Berger
Commit Message: updated reader
URL: https://github.com/Hestenb62/_legacy_backup/commit/07fc4b5a37f95244b4d63652071c51954ff26fe9
Code Changes:
diff --git a/assets/css/reader-main.css b/assets/css/reader-main.css
index 5b57f66..d35e89d 100644
--- a/assets/css/reader-main.css
+++ b/assets/css/reader-main.css
@@ -105,7 +105,7 @@
}
/* ==========================================================================
- Top Running Book Header (Styled, Unified, and Responsive)
+ Top Running Book Header (Integrated Seamlessly at Top of Chapter Box)
========================================================================== */
.book-running-header {
display: flex !important;
@@ -114,20 +114,21 @@
flex-wrap: wrap !important;
gap: 0.75rem 1.25rem !important;
width: 100% !important;
- padding: 0.85rem 1.5rem !important;
- margin-bottom: 1.25rem !important;
- background: var(--reader-surface, var(--color-content-bg, rgba(30, 41, 59, 0.7))) !important;
- backdrop-filter: blur(14px) !important;
- -webkit-backdrop-filter: blur(14px) !important;
- border: 1px solid var(--reader-border, var(--color-border, rgba(255, 255, 255, 0.1))) !important;
- border-radius: 9999px !important;
- box-shadow: var(--reader-card-shadow, 0 4px 20px rgba(0, 0, 0, 0.08)) !important;
+ padding: 0 0 1.25rem 0 !important;
+ margin-bottom: 2rem !important;
+ background: transparent !important;
+ backdrop-filter: none !important;
+ -webkit-backdrop-filter: none !important;
+ border: none !important;
+ border-bottom: 1px solid var(--reader-border, rgba(255, 255, 255, 0.12)) !important;
+ border-radius: 0 !important;
+ box-shadow: none !important;
box-sizing: border-box !important;
- font-size: 0.86rem !important;
+ font-size: 0.88rem !important;
letter-spacing: 0.02em !important;
color: var(--reader-muted, var(--color-text-secondary, #94a3b8)) !important;
user-select: none !important;
- transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease !important;
+ transition: border-color 0.3s ease, color 0.3s ease !important;
}
.book-header-left {
@@ -165,11 +166,11 @@
display: inline-flex !important;
align-items: center !important;
gap: 0.4rem !important;
- padding: 0.25rem 0.8rem !important;
- border-radius: 9999px !important;
- background: var(--color-bg-subtle, rgba(255, 255, 255, 0.06)) !important;
- border: 1px solid var(--reader-border, rgba(255, 255, 255, 0.08)) !important;
- font-size: 0.8rem !important;
+ padding: 0 !important;
+ border-radius: 0 !important;
+ background: transparent !important;
+ border: none !important;
+ font-size: 0.84rem !important;
font-weight: 600 !important;
color: var(--reader-muted, #94a3b8) !important;
}
@@ -248,11 +249,12 @@
}
.book-running-header {
- border-radius: 1.25rem !important;
- padding: 0.85rem 1rem !important;
- flex-direction: column !important;
- text-align: center !important;
- justify-content: center !important;
+ border-radius: 0 !important;
+ padding: 0 0 1rem 0 !important;
+ margin-bottom: 1.5rem !important;
+ flex-direction: row !important;
+ text-align: left !important;
+ justify-content: space-between !important;
gap: 0.5rem !important;
}
diff --git a/library/read/reader_template.php b/library/read/reader_template.php
index c96db6d..f422c9d 100644
--- a/library/read/reader_template.php
+++ b/library/read/reader_template.php
@@ -392,28 +392,28 @@ body.zen-mode {
<div id="book-stage" class="single-book-stage">
<!-- Single Book Page Frame -->
<div id="book-frame" class="single-book-frame">
- <!-- Top Running Book Header -->
- <header class="book-running-header" aria-label="Book and Chapter Details">
- <div class="book-header-left">
- <span class="book-header-title">
- <i class="fas fa-book-open"></i> <?php echo htmlspecialchars($bookTitle); ?>
- </span>
- <span class="book-header-dot" aria-hidden="true">•</span>
- <span class="book-header-chapter">
- <?php echo htmlspecialchars($currentChapterTitle); ?>
- </span>
- </div>
- <div class="book-header-right">
- <span class="book-header-readtime" title="<?php echo number_format($wordCount); ?> words (~180 WPM)">
- <i class="far fa-clock"></i> ~<?php echo $estMinutes; ?> min read
- </span>
- </div>
- </header>
-
<!-- Content Viewport -->
<div id="book-page-viewport" class="book-page-viewport">
<!-- Main Reader Reading Container -->
<article id="book-content" class="reader-main-content font-sans prose-lg lh-wide">
+ <!-- Top Running Book Header integrated at top of chapter box -->
+ <header class="book-running-header" aria-label="Book and Chapter Details">
+ <div class="book-header-left">
+ <span class="book-header-title">
+ <i class="fas fa-book-open"></i> <?php echo htmlspecialchars($bookTitle); ?>
+ </span>
+ <span class="book-header-dot" aria-hidden="true">•</span>
+ <span class="book-header-chapter">
+ <?php echo htmlspecialchars($currentChapterTitle); ?>
+ </span>
+ </div>
+ <div class="book-header-right">
+ <span class="book-header-readtime" title="<?php echo number_format($wordCount); ?> words (~180 WPM)">
+ <i class="far fa-clock"></i> ~<?php echo $estMinutes; ?> min read
+ </span>
+ </div>
+ </header>
+
<?php if ($isTeacherPage && !$isTeacherUnlocked): ?>
<!-- Protected Teacher Resources Screen -->
<div class="teacher-gate-card">
diff --git a/updates/docs/2026-09-10-math-reference-styling-walkthrough.md b/updates/docs/2026-09-10-math-reference-styling-walkthrough.md
index fcd94ee..c633e87 100644
--- a/updates/docs/2026-09-10-math-reference-styling-walkthrough.md
+++ b/updates/docs/2026-09-10-math-reference-styling-walkthrough.md
@@ -32,8 +32,9 @@ The digital **Mathematical Facts, Constants & Formulas Compendium** (`math-facts
- `.ref-table-wrap` & `.ref-table`: Publication-grade tables with sticky headers, zebra stripes, and responsive touch scroll.
### 2. Digital Reader Interface & Top Navigation Streamlining
-- **File**: `library/read/reader_template.php`.
-- **Streamlined Top Bar**: Removed the redundant middle title badge between the `← Catalog` return button and the reading tracker/session tools, creating a cleaner, uncluttered top navigation bar.
+- **File**: `library/read/reader_template.php`, `assets/css/reader-main.css`.
+- **Streamlined Top Bar**: Removed the redundant middle title badge between the `← Catalog` return button and the reading tracker/session tools.
+- **Seamless Running Header Integration**: Moved the secondary running header directly inside the main chapter reading card (`#book-content`) as a clean, integrated top bar with a subtle bottom divider line, removing the floating pill containers and pill borders around the reading time.
### 3. MathJax Typography & Dynamic Page Font Adaptation
- **Files**: `assets/css/reader/read-reader-typography.css`, `assets/js/reader/read-typography.js`, `library/read/reader_template.php`.