Skip to content

Commit

Permalink
chore(sticky-header): port refactor to v2 (carbon-design-system#11773)
Browse files Browse the repository at this point in the history
### Description
Ports changes made to feat/masthead-v2-dev branch in carbon-design-system#11734 to v2 branch.

In order to adequately test the new Sticky Header Sandbox story, I had to clean up the Dotcom Shell stories. The `mock` secret menu item works again now, and I've reduced a good amount of bloat in the stories' markup. While I was at it, I noticed I never updated Dotcom Shell's `navLinks` prop for L0 items to Masthead's new `l0Data` prop, so I added support for that as well.

### Testing
The code changes here are mostly identical to the aforementioned PR, with the only divergences being changes necessary for v2. Please verify each of the Dotcom Shell stories works as expected, taking particular care to test the sticky elements behaviors on both desktop and mobile.
  • Loading branch information
jkaeser authored May 28, 2024
1 parent 666acd0 commit 365c9b6
Show file tree
Hide file tree
Showing 7 changed files with 805 additions and 816 deletions.
18 changes: 18 additions & 0 deletions packages/styles/scss/components/masthead/_masthead-l1.scss
Original file line number Diff line number Diff line change
Expand Up @@ -141,10 +141,27 @@ $search-transition-timing: 95ms;
}

.#{$prefix}--masthead__l1-dropdown {
position: absolute;
background-color: $background;
color: $text-secondary;
inset-block-start: 100%;
inset-inline: 0;

&.is-open {
box-shadow: 0 2px 6px 0 $shadow;
}

&:not(.is-open) {
display: none;
}

&:last-child {
> a,
> button {
border-block-end: initial;
}
}

// Height of viewport, minus the L0/L1 combo, minus additional space to match L0 megapanels
max-block-size: calc(100vh - 98px - #{$spacing-10} - #{$spacing-09});
overflow-y: auto;
Expand Down Expand Up @@ -343,6 +360,7 @@ $search-transition-timing: 95ms;
@include type-style(body-short-01);

background-color: $background-brand;
border-block-end: initial;
color: $layer-02;

svg {
Expand Down
Loading

0 comments on commit 365c9b6

Please sign in to comment.