[sulimanbenhalim]

Closes #816

Summary

• opening a settings link with an anchor like /settings/profile#pasteis-mode-label scrolls the section under the sticky Settings bar so its heading is hidden
• now anchors on settings pages stop just below the bar on desktop and phone

Changes

• the settings layout gives every element with an id a scroll-mt-28 (the 56px title plus the tabs) through [&_[id]]:scroll-mt-28 on its content wrapper
• same idea as fix: offset scroll margin for settings anchors beneath sticky headers #948 which its author closed over conflicts but in one place instead of four

Validation

• lint types JS tests and build pass locally plus the full pest suite with 100% coverage (4529 tests)
• opened /settings/profile#pasteis-mode-label signed in at 1440x900 and 390x844 in light and dark and the heading went from 0px to 112px from the top

Visual evidence

before	after

Device verification

• desktop chrome at 1440x900 and chrome emulating a 390x844 phone (no hardware) since it is a scroll offset and not a touch interaction

Independent review

• read-only Claude agent: CODE PASS and VISUAL PASS on base 75c969e1 head 95b63801

Limitations

• None

Summary by CodeRabbit

• Bug Fixes
  • Improved scrolling to elements within settings pages so their headings have more space above them when brought into view.

[coderabbitai]

No actionable comments were generated in the recent review.

Recent review info

Run configuration

• Source mode: Auto
• Repository: Unavailable
• Branch: Unavailable
• File: No configuration file from this repository applied
• Commit: Unavailable
• Layers: defaults
• Review profile: CHILL
• Plan: Advanced
• Run ID: ff50cc22-77ca-45f8-a90b-3a283f94503b

Commits

Reviewing files that changed from the base of the PR and between 80cca8f and 95b6380.

Files selected for processing: 1

• resources/js/layouts/settings/layout.tsx

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

Walkthrough

The settings content container now applies scroll-mt-28 to descendant elements with an id.

Changes: Settings anchor positioning

Layer / File(s)	Summary
Apply scroll margin to settings anchors resources/js/layouts/settings/layout.tsx	The settings content container applies scroll-mt-28 to descendant elements with an id.

Priority: Low

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

Change: Bug fix · Severity of issue fixed: Low

Suggested reviewers: vtlxx

Merge Risk: Minimal · up to 95b63

No actionable merge-blocking risk was identified in the settings anchor positioning change.

Pre-merge checks: 4 · 1

Failed checks: 1 warning

Check name	Status	Explanation	Resolution
Docstring Coverage		Docstring coverage is 0.00% which is insufficient. The required threshold is 80.00%. Docstring coverage is scoped to functions touched by this diff. Analyzed 1 functions across 1 files.	Write docstrings for the functions missing them to satisfy the coverage threshold.

Passed checks: 4 passed

Check name	Status	Explanation
Description Check		Check skipped - CodeRabbit’s high-level summary is enabled.
Title check		The title clearly and concisely describes the main change: keeping settings-page anchors visible below the sticky header.
Linked Issues check		Issue #816 requires settings-page anchors to remain visible below the sticky bar. The pull request adds [&_[id]]:scroll-mt-28 to the settings content wrapper in `resources/js/layouts/settings/layout…
Out of Scope Changes check		The whole pull request changes only the settings content wrapper class in resources/js/layouts/settings/layout.tsx. The change directly supports issue #816 and contains no demonstrated unrelated imp…

Full details: Linked Issues check

Explanation

Issue #816 requires settings-page anchors to remain visible below the sticky bar. The pull request adds [&_[id]]:scroll-mt-28 to the settings content wrapper in resources/js/layouts/settings/layout.tsx. This applies a scroll margin to descendant elements with an id, including the reported anchor target.

Full details: Out of Scope Changes check

Explanation

The whole pull request changes only the settings content wrapper class in resources/js/layouts/settings/layout.tsx. The change directly supports issue #816 and contains no demonstrated unrelated implementation.

Finishing Touches

🧪 Generate unit tests (beta)

• 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.}