Skip to content

Improve CSS contrast, responsive layout, and reduced motion support - #8

Merged
dieghernan merged 3 commits into
mainfrom
fix/css-accessibility-layout
Oct 19, 2026
Merged

dieghernan merged 3 commits into
mainfrom
fix/css-accessibility-layout

Conversation

@dieghernan

@dieghernan dieghernan commented Oct 19, 2026 •

Copy link
Copy Markdown
Owner

Navigation states used dark palette colors in light mode, linked syntax tokens could lose their underline, and mobile code blocks relied on negative margins. This change makes navigation theme-aware, restores code-link underlines and visible keyboard focus, and keeps long code inside its container.

Dark button states now derive from semantic colors, and the CSS compression script regenerates Bootstrap RGB companions from the brand palette. Small adjustments to GitHub comments and One Dark comments/names bring all syntax foregrounds to at least 4.5:1 contrast. Page transitions and callout toggle animations are enabled only when reduced motion is not requested.

The footer CSS is restored exactly to its pre-PR version. Callout SVG icons and image brightness rules are unchanged.

Validation:

  • Package suite: 86 checks passed, without failures, warnings, or skips.
  • Built the pkgdown homepage and checked navigation, code links and mobile code containers in both themes in Chromium at seven viewport widths.
  • Verified contrast for 12 dark button variants in normal, hover, active, and focus states, plus reduced-motion behavior.
  • Changed the palette in an isolated copy and confirmed RGB companions regenerate correctly.
  • Confirmed the restored footer CSS matches the pre-PR version exactly; CSS minification and formatting checks passed.

@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Oct 19, 2026 •

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review ✅ Completed 2026-10-19T21:03:34.122647Z eb34bbc New commits
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

Comment thread tests/testthat/test-template-css.R Fixed

@chatgpt-codex-connector chatgpt-codex-connector Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

💡 Codex Review

Here are some automated review suggestions for this pull request.

Reviewed commit: f52dde1956

ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review".

If Codex has suggestions, it will comment; otherwise it will react with 👍.

Codex can also answer questions or update the PR. Try commenting "@codex address that feedback".

Comment thread inst/pkgdown/assets/BS5/gitdevr.css Outdated
border-image: linear-gradient(
var(--gitdevr-footer-bg),
var(--gitdevr-footer-bg)
) fill 0 / 0 / 0 100vw;

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

P2 Badge Preserve the border-image shorthand during minification

The Sass compressor interprets the unquoted 0 / 0 in this shorthand as division and emits border-image: ... fill NaN/0 100vw in gitdevr.min.css. Because the template links that minified stylesheet, browsers discard the invalid declaration, so the footer background no longer extends across the viewport. Rewrite the shorthand so Sass preserves the slash-separated border-image values.

Useful? React with 👍 / 👎.

@coveralls

coveralls commented Oct 19, 2026 •

Copy link
Copy Markdown

Coverage Report for CI Build 39324136678

Coverage remained the same at 100.0%

Details

  • Coverage remained the same as the base build.
  • Patch coverage: No coverable lines changed in this PR.
  • No coverage regressions found.

Uncovered Changes

No uncovered changes found.

Coverage Regressions

No coverage regressions found.


Coverage Stats

Coverage Status
Relevant Lines: 7
Covered Lines: 7
Line Coverage: 100.0%
Coverage Strength: 4.0 hits per line

💛 - Coveralls

@codecov

codecov Bot commented Oct 19, 2026 •

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 100.00%. Comparing base (74840e4) to head (eb34bbc).
✅ All tests successful. No failed tests found.

Additional details and impacted files
@@            Coverage Diff            @@
##              main        #8   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files            2         2           
  Lines            7         7           
=========================================
  Hits             7         7           

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

@dieghernan dieghernan added ai-assisted 🤖 changes include AI-assisted development or review bug an unexpected problem or unintended behavior labels Oct 19, 2026 — with ChatGPT Codex Connector
@dieghernan
dieghernan merged commit 24ebd9b into main Oct 19, 2026
11 checks passed
@dieghernan
dieghernan deleted the fix/css-accessibility-layout branch October 19, 2026 21:08
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

ai-assisted 🤖 changes include AI-assisted development or review bug an unexpected problem or unintended behavior

Projects

None yet

Development

Successfully merging this pull request may close these issues.

3 participants