bugfix: reader nav sticks under the app header instead of behind it (0.21.1)

$(top offset was 44px (header's 60px minus var(--space-4)), placing the bar inside the layout header. Now sticks at var(--app-header-h).)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
MechaCat02
2026-05-17 20:42:38 +02:00
parent 7aa6e7e6d9
commit 215325ad2f
4 changed files with 9 additions and 9 deletions

2
backend/Cargo.lock generated
View File

@@ -1033,7 +1033,7 @@ checksum = "5e5032e24019045c762d3c0f28f5b6b8bbf38563a65908389bf7978758920897"
[[package]] [[package]]
name = "mangalord" name = "mangalord"
version = "0.21.0" version = "0.21.1"
dependencies = [ dependencies = [
"anyhow", "anyhow",
"argon2", "argon2",

View File

@@ -1,6 +1,6 @@
[package] [package]
name = "mangalord" name = "mangalord"
version = "0.21.0" version = "0.21.1"
edition = "2021" edition = "2021"
[lib] [lib]

View File

@@ -1,6 +1,6 @@
{ {
"name": "mangalord-frontend", "name": "mangalord-frontend",
"version": "0.21.0", "version": "0.21.1",
"private": true, "private": true,
"type": "module", "type": "module",
"scripts": { "scripts": {

View File

@@ -574,14 +574,14 @@
{/if} {/if}
<style> <style>
/* Sticky under the fixed layout header. The bar takes its natural /* Sticky directly under the fixed layout header. `top: var(--app-header-h)`
box at the top of `main`; once the reader scrolls past, it pins the bar's top edge to the bottom edge of the layout
sticks just below where the layout header sits in the viewport. header so it never slides under it. Focus mode slides it up
Focus mode slides it up off-screen via a transform AND clips its off-screen via a transform AND clips its height to 0 so the
height to 0 so the chapter pages get the full top of the viewport. */ chapter pages get the full top of the viewport. */
.reader-nav { .reader-nav {
position: sticky; position: sticky;
top: calc(var(--app-header-h, 60px) - var(--space-4)); top: var(--app-header-h);
z-index: 10; z-index: 10;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;