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

Make member device info buttons fluid and stackable with flexbox #4776

Merged
merged 2 commits into from
Aug 10, 2017

Conversation

shvchk
Copy link
Contributor

@shvchk shvchk commented Aug 10, 2017

Buttons with short text stay as they are, buttons with long text don't get overflowed, but just grow and wrap on a new line if needed, still remaining aligned with others (helpful for translations that don't have short enough equivalent for button labels)

Screenshot (short English labels, longer Russian labels):
Screenshot

It would be nice to get those into a device context menu eventually, the same as message actions are now under the message context menu.

Same as the #4703 but based on develop branch as @t3chguy and @lukebarnard1 suggested.

Signed-off-by: Andrei Shevchuk andrei@shevchuk.co

Buttons with short text stay as they are, buttons with long text don't get overflowed, but just grow and wrap on a new line if needed, still remaining aligned with others (see screenshot in PR comments)

Signed-off-by: Andrei Shevchuk <andrei@shevchuk.co>
@@ -18,6 +18,13 @@ limitations under the License.
padding: 10px 0px;
}

.mx_MemberDeviceInfo.mx_DeviceVerifyButtons {
width: 100%;
Copy link
Contributor

Choose a reason for hiding this comment

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

I'm not convinced this is necessary

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Yeah, no need in this as div has 100% width by default, I will remove this

Copy link
Contributor

@lukebarnard1 lukebarnard1 left a comment

Choose a reason for hiding this comment

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

LGTM, thanks @shvchk !

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.

None yet

2 participants