shivannakarthik opened a new pull request, #1571:
URL: https://github.com/apache/airflow-site/pull/1571
## Summary
The "Suggest a change on this page" button on Sphinx docs pages rendered
~60px tall × ~280px wide, crowding the right margin and competing with body
content (apache/airflow#16654). This PR redesigns it as a compact circular
GitHub-icon button with a hover tooltip.
## Changes
- `landing-pages/site/assets/scss/_suggest-change.scss`:
Override base `.btn-with-icon` styles for `.suggest-change-link` to render
as a 50×50 circular icon-only button.
- Label is visually hidden but kept in the accessibility tree (screen
readers still announce "Suggest a change on this page").
- Hover tooltip uses `var(--bs-emphasis-color)` / `var(--bs-body-bg)` so
it auto-inverts between light and dark themes, with rgba fallbacks for safety.
## Scope
- Affects Sphinx-built docs pages only (`.suggest-change-link`)
- Hugo landing pages (`.base-layout--suggestButton`) unaffected
- Already hidden below the tablet breakpoint — desktop/wide only
## Out of scope
A pre-existing duplicate screen-reader announcement on this same affordance
(caused by nested \`<a><button>\` markup in \`suggest_change_button.html\`) was
identified during testing. It is unrelated to the button-size redesign and will
be addressed in a follow-up PR.
## Test plan
- [x] Stylelint passes locally
- [x] Sphinx demo renders the compact circle + tooltip
- [x] Hover tooltip uses theme-appropriate colours in both light and dark
mode
- [ ] CI green on PR
Refs: apache/airflow#16654
---
##### Was generative AI tooling used to co-author this PR?
- [X] Yes — Cursor with Claude Opus 4.7
Generated-by: Cursor with Claude Opus 4.7
Made with [Cursor](https://cursor.com)
--
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.
To unsubscribe, e-mail: [email protected]
For queries about this service, please contact Infrastructure at:
[email protected]
