Skip to content

fix: stop home page background gradient from tiling - #85

Merged
Svtter merged 1 commit into
mainfrom
fix/body-gradient-banding
Oct 14, 2026
Merged

Svtter merged 1 commit into
mainfrom
fix/body-gradient-banding

Conversation

@Svtter

@Svtter Svtter commented Oct 14, 2026 •

Copy link
Copy Markdown
Contributor

Problem

The home page background is a gradient on body:

body { background: linear-gradient(180deg, #f6f4ee 0%, #ebe7dc 100%); }

The body background propagates to the canvas, but the gradient is sized to the body box (roughly one screen of content). On pages taller than the content the gradient tiles, producing a visible horizontal banding seam every body-height.

Fix

Anchor the gradient to the viewport and paint it once:

background-color: #ebe7dc;
background-image: linear-gradient(180deg, #f6f4ee 0%, #ebe7dc 100%);
background-attachment: fixed;
background-repeat: no-repeat;

The canvas beyond the first viewport falls back to #ebe7dc (the gradient end color), so scrolling stays seamless.

Verification

  • Reproduced the banding on the old build (headless Chrome screenshot, 1600x2000 viewport); after the fix the background renders as one smooth gradient with no seams.
  • go test ./... passes.

Summary by CodeRabbit

  • Style
    • Updated the home page background to use a solid base color with a fixed, non-repeating gradient. The gradient remains in place as the page is scrolled, while the solid color provides the background beneath it.

The body gradient propagated to the canvas is sized to the body box,
so on pages taller than the content it tiles and shows banding seams.
Pin it to the viewport with background-attachment: fixed, no-repeat,
and fall back to the gradient end color beyond the first screen.
@coderabbitai

coderabbitai Bot commented Oct 14, 2026 •

Copy link
Copy Markdown

Review in Change Stack →

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info
⚙️ Run configuration
  • Configuration used: defaults
  • Review profile: CHILL
  • Plan: Advanced
  • Run ID: 4e4a97cc-0c74-4cae-93dd-8ffb5494db25
📥 Commits

Reviewing files that changed from the base of the PR and between 8aceb86 and 2e051b6.

📒 Files selected for processing: 1
  • internal/server/server.go

Included review availability: This review used your included allowance. Your plan provides up to 1 included review per hour; 0 remain after this review.

📝 Walkthrough

The home page body styling now sets a solid background color and a fixed, non-repeating linear-gradient image.

Changes: Home page styling

Layer / File(s) Summary
Body background declarations
internal/server/server.go
The body styling separates the solid background color from the fixed, non-repeating gradient image.

Priority: ⬇️ Low

Estimated code review effort: 1 (Trivial) | ~5 minutes

Change: Bug fix

Merge Risk: ⚪ Minimal · up to 2e051

The change is limited to the home-page background presentation, with no concrete regression established; it is mergeable subject to normal checks.

### Architecture Summary

Architecture risk: 🔵 Low · up to 2e051

The change affects 1 system.

Changed systems: internal

Architecture concerns
No architecture-level concerns identified.

Review details

Systems and components

  • observed — internal (service) was modified; 1 changed file maps to changed impact.

Before / after behavior

  • observed — Modified behavior in internal/server/server.go: The body background changes from a single background shorthand gradient to a solid background-color with that gradient as a fixed, non-repeating background image.
Pre-merge checks: Passed 5
Passed Passed checks: 5 passed
Check name Status Explanation
Description Check Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title check Passed The title clearly and concisely describes the main change: preventing the home page background gradient from tiling.
Docstring Coverage Passed No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check. Docstring coverage is scoped to functions touched by this diff. Analyzed 0 functions across 1…
Linked Issues check Passed Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check Passed Check skipped because no linked issues were found for this pull request.
✨ Finishing Touches: 💡 1
🛠️ Fix failing CI checks: 💡
  • Commit to this branch
  • Create a new PR
📝 Generate docstrings
  • Commit to this branch
  • Create a new PR
🧪 Generate unit tests (beta)
  • Commit to this branch
  • Create a new PR
  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Comment @coderabbitai help to get the list of available commands.

@Svtter
Svtter merged commit ad77b71 into main Oct 14, 2026
3 of 5 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant