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 cropped message reaction icons #5174
Fix cropped message reaction icons #5174
Conversation
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I'll test this soon, but left a question before I do so.
stylesheets/_modules.scss
Outdated
@@ -11476,15 +11476,15 @@ $contact-modal-padding: 18px; | |||
} | |||
|
|||
/* Spec: container < 437px */ | |||
@media (min-width: 0px) and (max-width: 799px) { | |||
@media (min-width: 0px) and (max-width: 834px) { | |||
.module-message { | |||
// Add 2px for 1px border | |||
max-width: 302px; | |||
} | |||
} | |||
|
|||
/* Spec: container > 438px and container < 593px */ |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Do these comments need to change?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Perhaps they do have to change. I don't understand what they're referring to. If that Spec: container < 437 px
refers to the module-timeline__message-container
, then they're not up to date.
Should I update them?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Yes, I think so.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Just pulled down the changes which look good—all that's needed is updates to those comments and then we should be good to go. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks great! Thanks for doing this.
Contributor checklist:
development
branchyarn ready
run passes successfully (more about tests here)Description
Reduced the min-width/increased the max-width of media queries to switch sooner from reaction icons for messages to a "more" menu.
Smallest media query
next smallest media query