fix(docs): consistent hover styling for inline-code links#2213
Conversation
…provider, context, hooks, and query utilities are now exported from `@namehash/namehash-ui`.
|
|
The latest updates on your projects. Learn more about Vercel for GitHub.
2 Skipped Deployments
|
|
Warning Review limit reached
More reviews will be available in 54 minutes and 55 seconds. Learn how PR review limits work. Your organization has run out of usage credits. Purchase more in the billing tab. ⌛ How to resolve this issue?After more reviews become available, a review can be triggered using the We recommend that you space out your commits to avoid hitting the rate limit. 🚦 How do rate limits work?CodeRabbit enforces hourly rate limits for each developer per organization. Our paid plans include higher PR review limits than trial, open-source, and free plans. In all cases, reviews become available again over time. During sustained high-volume PR review activity, CodeRabbit may temporarily slow when the next review becomes available. Please see our Fair Usage Limits Policy for further information. ℹ️ Review info⚙️ Run configurationConfiguration used: Organization UI Review profile: ASSERTIVE Plan: Pro Run ID: 📒 Files selected for processing (4)
📝 WalkthroughWalkthroughThis PR refines link hover and underline animation behavior across the ENSNode documentation site. Component back-navigation and hosted links simplify their hover styling by removing accent-color changes and narrowing transitions to text-underline-offset. Global Starlight CSS updates align markdown link hover colors and refine underline animation mechanics to support the component-level changes. ChangesLink hover and underline animation refinement
Estimated code review effort🎯 2 (Simple) | ⏱️ ~8 minutes Possibly related PRs
Suggested labels
Poem
🚥 Pre-merge checks | ✅ 4 | ❌ 1❌ Failed checks (1 warning)
✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. ✨ Finishing Touches🧪 Generate unit tests (beta)
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. Comment |
There was a problem hiding this comment.
Pull request overview
Small CSS-only tweak in the docs site to make link hover styling consistent, particularly for inline-code links inside markdown paragraphs and lists, plus minor trailing-whitespace cleanups in comments.
Changes:
- Add underline-offset hover transition for
a:has(code)links in markdown paragraphs/list items. - Switch hover color tokens from
--sl-color-accent/--sl-color-accent-highto--sl-color-text-accent, and add a heading-link hover color rule. - Clean up trailing whitespace in several CSS comments.
💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.
Greptile SummaryThis PR standardizes hover styling across inline-code links and plain-text links in the documentation site, ensuring that only
Confidence Score: 5/5Pure documentation-site CSS and template changes with no logic, data, or API impact — safe to merge. All changes are scoped to styling: CSS selector additions in No files require special attention. Important Files Changed
Flowchart%%{init: {'theme': 'neutral'}}%%
flowchart TD
A[Link hovered] --> B{Is link in\n.sl-markdown-content?}
B -- No --> C[Tailwind classes only\ne.g. HostedEnsNodeInstance\ntransition-text-underline-offset]
B -- Yes --> D{Is it a heading\nanchor link?}
D -- Yes --> E[color: --sl-color-white\nno underline-offset transition]
D -- No --> F{Does link contain\na code element?}
F -- Yes --> G[a:has code rule\ncolor + text-underline-offset\nboth transition 0.2s]
F -- No --> H[Plain link rule\ntext-underline-offset only\ntransition 0.2s]
G --> I[Hover color set by broad\na:hover rule to --sl-color-text-accent]
H --> I
Reviews (2): Last reviewed commit: "Merge branch 'main' into fix/docs-inline..." | Re-trigger Greptile |
…ode-link-styling Brings in PR #2208 component-level hover cleanups (HostedEnsNodeInstance, OmnigraphStaticExampleSet, enskit/example.mdx, enssdk/example.mdx) and the broader `a:hover` override in starlight.css. Conflict in starlight.css resolved by: - Keeping #2208's broader `.sl-markdown-content a:hover` override. - Dropping our narrower `> p a` / `li a` hover rule (redundant under #2208's selector). - Keeping the code-link underline-offset rule from this branch.
There was a problem hiding this comment.
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
docs/ensnode.io/src/styles/starlight.css (1)
218-241:⚠️ Potential issue | 🟡 Minor | ⚡ Quick winRemove empty lines before declarations to satisfy stylelint.
The stylelint rule
declaration-empty-line-beforeflags the empty lines at lines 224 and 236. Remove them for consistency with the project's CSS formatting rules.🧹 Proposed fix
.sl-markdown-content > p a:not(:has(code), [role="tab"]), .sl-markdown-content :is(ul, ol) > li a:not(:has(code), [role="tab"]), .starlight-aside__content a { text-decoration: underline; text-underline-offset: 4px; - transition: text-underline-offset 0.2s ease-in-out; - &:hover { text-underline-offset: 2px; } } .sl-markdown-content > p a:has(code):not([role="tab"]), .sl-markdown-content :is(ul, ol) > li a:has(code):not([role="tab"]) { text-decoration: underline; text-underline-offset: 4px; - transition: text-underline-offset 0.2s ease-in-out; &:hover { text-underline-offset: 2px; } }🤖 Prompt for AI Agents
Verify each finding against current code. Fix only still-valid issues, skip the rest with a brief reason, keep changes minimal, and validate. In `@docs/ensnode.io/src/styles/starlight.css` around lines 218 - 241, Remove the blank lines that precede declarations inside the rule blocks for the selectors ".sl-markdown-content > p a:not(:has(code), [role="tab"]), .sl-markdown-content :is(ul, ol) > li a:not(:has(code), [role="tab"]), .starlight-aside__content a" and ".sl-markdown-content > p a:has(code):not([role="tab"]), .sl-markdown-content :is(ul, ol) > li a:has(code):not([role="tab"])" so there are no empty lines immediately before properties like "text-decoration" and "text-underline-offset" (remove the blank lines currently above those declarations to satisfy the declaration-empty-line-before stylelint rule).
🤖 Prompt for all review comments with AI agents
Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.
Outside diff comments:
In `@docs/ensnode.io/src/styles/starlight.css`:
- Around line 218-241: Remove the blank lines that precede declarations inside
the rule blocks for the selectors ".sl-markdown-content > p a:not(:has(code),
[role="tab"]), .sl-markdown-content :is(ul, ol) > li a:not(:has(code),
[role="tab"]), .starlight-aside__content a" and ".sl-markdown-content > p
a:has(code):not([role="tab"]), .sl-markdown-content :is(ul, ol) > li
a:has(code):not([role="tab"])" so there are no empty lines immediately before
properties like "text-decoration" and "text-underline-offset" (remove the blank
lines currently above those declarations to satisfy the
declaration-empty-line-before stylelint rule).
ℹ️ Review info
⚙️ Run configuration
Configuration used: Organization UI
Review profile: ASSERTIVE
Plan: Pro
Run ID: d6d887eb-1be4-4c5f-a317-6d99d7ec7f7e
📒 Files selected for processing (5)
docs/ensnode.io/src/components/molecules/HostedEnsNodeInstance.astrodocs/ensnode.io/src/components/organisms/OmnigraphStaticExampleSet.astrodocs/ensnode.io/src/content/docs/docs/integrate/integration-options/enskit/example.mdxdocs/ensnode.io/src/content/docs/docs/integrate/integration-options/enssdk/example.mdxdocs/ensnode.io/src/styles/starlight.css
Lite PR
Tip: Review docs on the ENSNode PR process
Summary
Why
Testing
Notes for Reviewer (Optional)
Pre-Review Checklist (Blocking)