Skip to content

Commit

Permalink
no select scrollbar with dividers
Browse files Browse the repository at this point in the history
  • Loading branch information
Evan Johnson committed May 15, 2024
1 parent e094518 commit b719b7e
Show file tree
Hide file tree
Showing 2 changed files with 14 additions and 3 deletions.
8 changes: 7 additions & 1 deletion packages/core/src/components/menu/_common.scss
Original file line number Diff line number Diff line change
Expand Up @@ -305,9 +305,15 @@ $dark-menu-item-intent-colors: (
@mixin menu-divider() {
border-top: 1px solid $pt-divider-black;
display: block;
// use negative margin to make dividers take up full menu width
// use negative margin to make dividers take up full menu width... (see below)
margin: $half-grid-size (-$half-grid-size);

// ... unless inside a select popover, which needs to provide negative margin on the
// parent menu component to offset padding added inside the select popover
.#{$ns}-select-popover & {
margin: $half-grid-size 0;
}

.#{$ns}-dark & {
border-top-color: $pt-dark-divider-white;
}
Expand Down
9 changes: 7 additions & 2 deletions packages/select/src/components/select/_select.scss
Original file line number Diff line number Diff line change
Expand Up @@ -3,11 +3,13 @@

@import "../../common/variables";

$select-padding: $pt-grid-size * 0.5;

.#{$ns}-select-popover {
.#{$ns}-popover-content {
// use padding on container rather than margin on input group
// because top margin leaves some empty space with no background color.
padding: $pt-grid-size * 0.5;
padding: $select-padding;
}

.#{$ns}-input-group {
Expand All @@ -19,10 +21,13 @@
max-width: $select-popover-max-width;
overflow: auto;
padding: 0;
margin-left: -$select-padding;
margin-right: -$select-padding;
margin-bottom: -$select-padding;

&:not(:first-child) {
// adjust padding to account for that on .#{$ns}-popover-content above
padding-top: $pt-grid-size * 0.5;
padding-top: $select-padding;
}
}

Expand Down

0 comments on commit b719b7e

Please sign in to comment.