fix(panel, docked nav): borders#8443
Conversation
|
Note Currently processing new changes in this PR. This may take a few minutes, please wait... ⚙️ Run configurationConfiguration used: Repository UI (base), Organization UI (inherited) Review profile: CHILL Plan: Pro Run ID: 📒 Files selected for processing (1)
WalkthroughPage dock-main desktop border-inline-end width and color are defined using regular and subtle border tokens at root and wired in the desktop media query. Panel’s before pseudo-element border width default is changed to the high-contrast regular token; the pf-m-secondary modifier no longer overrides that width. ChangesPage and Panel Border Fixes
Estimated code review effort🎯 3 (Moderate) | ⏱️ ~20 minutes Possibly related PRs
Suggested labels
Suggested reviewers
🚥 Pre-merge checks | ✅ 4✅ Passed checks (4 passed)
✏️ Tip: You can configure your own custom pre-merge checks in the settings. 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 |
|
Preview: https://pf-pr-8443.surge.sh A11y report: https://pf-pr-8443-a11y.surge.sh |
9a690d3 to
61e60ed
Compare
There was a problem hiding this comment.
Actionable comments posted: 2
🤖 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.
Inline comments:
In `@src/patternfly/components/Avatar/examples/Avatar.md`:
- Around line 88-89: Update the Usage docs to reference the correct modifier
used in the implementation: replace the incorrect `.pf-v6-c-avatar--colorful`
entry with the `.pf-m-colorful` modifier (applied to the `.pf-v6-c-avatar`
element, e.g. `.pf-v6-c-avatar.pf-m-colorful`), so the table matches the actual
classes used in avatar--colorful.hbs and avatar.scss and documents a working
class name.
In `@src/patternfly/components/Page/page.scss`:
- Around line 39-40: The custom-property name is mis-cased: replace the
incorrect --#{$page}__dock-main--desktop--BorderInlineEndwidth with the
correctly cased --#{$page}__dock-main--desktop--BorderInlineEndWidth wherever it
appears (including the duplicate occurrence currently around line 476) so it
matches the established naming used elsewhere and allows overrides to work as
expected.
🪄 Autofix (Beta)
Fix all unresolved CodeRabbit comments on this PR:
- Push a commit to this branch (recommended)
- Create a new PR with the fixes
ℹ️ Review info
⚙️ Run configuration
Configuration used: Repository UI (base), Organization UI (inherited)
Review profile: CHILL
Plan: Pro
Run ID: 19939d5d-ce44-40db-9ff9-2ebfdcd25481
⛔ Files ignored due to path filters (1)
src/patternfly/assets/images/img_avatar-rhds.svgis excluded by!**/*.svg
📒 Files selected for processing (6)
src/patternfly/components/Avatar/avatar--colorful.hbssrc/patternfly/components/Avatar/avatar.hbssrc/patternfly/components/Avatar/avatar.scsssrc/patternfly/components/Avatar/examples/Avatar.mdsrc/patternfly/components/Page/page.scsssrc/patternfly/components/Panel/panel.scss
mcoker
left a comment
There was a problem hiding this comment.
Want to confirm one thing with design (@andrew-ronaldson @lboehling). Right now there is a subtle right border when expanded on mobile in non-glass theme. In glass theme, we're using the glass border, which isn't really visible. Since the docked nav on mobile uses the floating background color in glass and non-glass, should we use a subtle border on mobile in glass, too?
That would mean that docked nav has a subtle right border all of the time, except in glass on desktop - then it uses the glass border.
Attached a video of the border in glass on mobile. It's toggling between the subtle border and glass border that it uses now.
dock-borders.mov
|
Caution Failed to replace (edit) comment. This is likely due to insufficient permissions or the comment being deleted. Error details |
26946e0 to
c597ba8
Compare
| } | ||
| } | ||
| } | ||
| } No newline at end of file |
There was a problem hiding this comment.
Looks like we need a newline here
|
🎉 This PR is included in version 6.6.0-prerelease.12 🎉 The release is available on: Your semantic-release bot 📦🚀 |
fixes: #8399
Adds hc border to panel and a border to the __dock-main for the docked nav.
Summary by CodeRabbit