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

fix(ui5-messagestrip): Close button now has the correct design #2029

Merged
merged 4 commits into from
Aug 3, 2020

Conversation

vladitasev
Copy link
Contributor

@vladitasev vladitasev commented Jul 29, 2020

Changes to ui5-button to support this change:

  • new property iconSize added, allowing the user control not only over the button size, but over the icon size as well
  • padding removed for iconOnly mode, icon is now centered

Buttons like this are now possible:
image
with the following markup:
image

ui5-messagestrip was refactored:

  • ui5-button used to achieve the desired design and behavior for the close button (kb handling, hover, focus, etc..)
  • CSS simplified (same rules merged, duplicate selectors removed, redundant CSS removed after the close icon removal, etc...)
  • CSS classes renamed and reordered
  • keyboard handling logic and all code that simulates ui5-button behavior deleted
  • onDefine now awaits all resources simultaneously

The close button looks like:
image

closes: #1989

Copy link
Member

@ilhan007 ilhan007 left a comment

Choose a reason for hiding this comment

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

I am personally ok with the change, but the close button should be smaller in width by spec, now it became bigger with the ui5-button

@@ -64,10 +64,6 @@
}

.ui5-button-icon {
font-size: var(--_ui5_button_icon_font_size);
height: 0;
Copy link
Member

Choose a reason for hiding this comment

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

I think @MapTo0 added this css for some IE reasons in the past

@vladitasev vladitasev merged commit 7f99be5 into master Aug 3, 2020
@vladitasev vladitasev deleted the message-strip-refactoring branch August 3, 2020 06:10
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

MessageStrip: close button does not become active on Enter
2 participants