## Implementation Plan: Independent Card Column Scrolling ### Objective Add `max-height` and `overflow-y: auto` to `.sidebar-card` and `.feed-right` so each column becomes an independent scroll container. Wheel events over either column will scroll that column only, without moving the main feed. ### Changes Required **File 1: `devplacepy/static/css/sidebar.css`** Locate the `.sidebar-card` rule block (currently lines 3–11). After the `padding: 1rem;` line, insert: ```css max-height: calc(100vh - var(--nav-height) - 2rem); overflow-y: auto; ``` **File 2: `devplacepy/static/css/feed.css`** Locate the `.feed-right` rule block (currently lines 219–225). After the `gap: 1rem;` line, insert: ```css max-height: calc(100vh - var(--nav-height) - 2rem); overflow-y: auto; ``` No other files (templates, JavaScript, backend) require changes. The browser’s native wheel dispatch handles the rest. ### Rationale - `max-height: calc(100vh - var(--nav-height) - 2rem)` constrains the column to viewport height minus the top offset (`top: calc(var(--nav-height) + 1rem)`) plus 1rem bottom gap. - `overflow-y: auto` creates a scroll container only when content exceeds that height. - The fix is desktop-only (both columns are hidden at ≤1024px breakpoints). All 12 affected templates benefit automatically. ### Definition of Done - [ ] **CSS changes applied** – The two property additions above are present in `sidebar.css` (within the `.sidebar-card` block) and `feed.css` (within the `.feed-right` block), on the correct selectors. - [ ] **Local visual test passes** – On any page that uses the three‑column layout (e.g., feed, gists, projects), hovering over the left or right sidebar and scrolling moves only that sidebar’s content. The main feed does not scroll while the pointer is over a sidebar. - [ ] **No regressions on mobile** – Verify at viewport width ≤1024px that both sidebars are hidden (confirm no visual regression from the `display: none` rules already in place). - [ ] **Unit test suite passes** – Run `pip install -e '.[dev]' -q && make test-unit` with exit code 0. - [ ] **Lint check passes** – Run `pip install -q ruff && ruff check .` with zero new warnings or errors. - [ ] **No unintended scroll‑bar appearance** – If sidebar content fits within the viewport, no scroll bar is visible. Only when content overflows does the scroll bar appear.