Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Modal: Add small top padding to the content so that avoid cutting off the visible outline when hovering items #51829

Merged
merged 13 commits into from
Jun 27, 2023
1 change: 1 addition & 0 deletions packages/components/CHANGELOG.md
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
- `Button`: Remove unnecessary margin from dashicon ([#51395](https://github.com/WordPress/gutenberg/pull/51395)).
- `Autocomplete`: Announce how many results are available to screen readers when suggestions list first renders ([#51018](https://github.com/WordPress/gutenberg/pull/51018)).
- `ConfirmDialog`: Ensure onConfirm isn't called an extra time when submitting one of the buttons using the keyboard ([#51730](https://github.com/WordPress/gutenberg/pull/51730)).
- `Modal`: Add small top padding to the content so that avoid cutting off the visible outline when hovering items ([#51829](https://github.com/WordPress/gutenberg/pull/51829)).

### Internal

Expand Down
2 changes: 1 addition & 1 deletion packages/components/src/modal/style.scss
Original file line number Diff line number Diff line change
Expand Up @@ -130,7 +130,7 @@
.components-modal__content {
flex: 1;
margin-top: $header-height + $grid-unit-15;
padding: 0 $grid-unit-40 $grid-unit-40;
padding: $border-width-focus-fallback $grid-unit-40 $grid-unit-40;
Copy link
Contributor

Choose a reason for hiding this comment

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

It may be worth to add a short inline comment explaining the reason for the top padding

overflow: auto;

&.hide-header {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,3 @@
}
}
}

.sidebar-navigation__rename-modal-form {
// Fix for input focus style being cut off by the modal.
padding-top: 1px;
}
Loading