8000 fix(nav): updates to horizontal subnav by mcoker · Pull Request #6302 · patternfly/patternfly · GitHub
[go: up one dir, main page]

Skip to content

fix(nav): updates to horizontal subnav#6302

Merged
mcoker merged 14 commits intopatternfly:v6from
mcoker:issue-6299
Mar 6, 2024
Merged

fix(nav): updates to horizontal subnav#6302
mcoker merged 14 commits intopatternfly:v6from
mcoker:issue-6299

Conversation

@mcoker
Copy link
Contributor
@mcoker mcoker commented Feb 10, 2024

fixes #6299

@patternfly-build
Copy link
Collaborator
patternfly-build commented Feb 10, 2024

--#{$page}__sidebar--main__main-subnav--BorderLeftWidth: var(--pf-t--global--border--width--divider--default);
--#{$page}__sidebar--m-collapsed--main__main-subnav--BorderLeftWidth: 0;

--#{$page}__main-subnav--BackgroundColor: var(--pf-t--global--background--color--primary--default);;
Copy link
Member

Choose a reason for hiding this comment

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

semisemi :)

@tlabaj
Copy link
Contributor
tlabaj commented Feb 13, 2024

Should the button have the pf-m-disabled modifier? It does in react hen isDisabled is applied.

image

@mcoker
Copy link
Contributor Author
mcoker commented Feb 13, 2024

@tlabaj only when the button isn't a <button> element. For <button> elements, we can just style via the disabled attribute (:disabled { ... }). But when the element is an <a> (https://www.patternfly.org/components/button#links-as-buttons) or <span> (https://www.patternfly.org/components/button#inline-link-as-span), the disabled attribute isn't valid, so we style it to look disabled via the class pf-m-disabled

@wise-king-sullyman wise-king-sullyman linked an issue Feb 15, 2024 that may be closed by this pull request
@mcoker mcoker force-pushed the issue-6299 branch 2 times, most recently from 58e8186 to dd448b5 Compare February 21, 2024 16:02
Comment on lines +74 to +79
.#{$toolbar} {
--#{$toolbar}--Width: var(--#{$masthead}--#{$toolbar}--Width);
--#{$toolbar}__content--PaddingBlock: var(--#{$masthead}--#{$toolbar}--PaddingBlock);
--#{$toolbar}__content--PaddingInline: var(--#{$masthead}--#{$toolbar}--PaddingInline);
--#{$toolbar}__content--MinWidth: 0;
}
Copy link
Member

Choose a reason for hiding this comment

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

Aren't these going to include --pf-v5- twice - do we want that? Maybe a cut/paste or merge error?

@srambach
Copy link
Member

One other comment - the focus rings on the scroll buttons are a bit cut off and weird, but that's definitely fine for a follow up issue.

@mcoker mcoker requested a review from srambach March 6, 2024 00:28
@mcoker
Copy link
Contributor Author
mcoker commented Mar 6, 2024

Screenshots of a nav demo with horizontal subnav with scrollbars

Screenshot 2024-03-05 at 6 26 53 PM Screenshot 2024-03-05 at 6 26 43 PM

Copy link
Member
@srambach srambach left a comment

Choose a reason for hiding this comment

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

Looks fabulous! Love the focus 💍

@mcoker mcoker merged commit f35a89c into patternfly:v6 Mar 6, 2024
@mcoker mcoker mentioned this pull request Mar 6, 2024
@patternfly-build
Copy link
Collaborator

🎉 This PR is included in version 6.0.0-alpha.99 🎉

The release is available on:

Your semantic-release bot 📦🚀

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Nav - horizontal updates

4 participants

0