Dialog wrap title instead of taking same space as the close/cancel button

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2020-05-28 16:48:50 +01:00
parent 0fd5714e21
commit 03058bacbd
2 changed files with 4 additions and 0 deletions

View file

@ -335,6 +335,9 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus {
.mx_Dialog_header.mx_Dialog_headerWithButton > .mx_Dialog_title { .mx_Dialog_header.mx_Dialog_headerWithButton > .mx_Dialog_title {
text-align: center; text-align: center;
} }
.mx_Dialog_header.mx_Dialog_headerWithCancel > .mx_Dialog_title {
margin-right: 20px; // leave space for the 'X' cancel button
}
.mx_Dialog_title.danger { .mx_Dialog_title.danger {
color: $warning-color; color: $warning-color;

View file

@ -144,6 +144,7 @@ export default createReactClass({
> >
<div className={classNames('mx_Dialog_header', { <div className={classNames('mx_Dialog_header', {
'mx_Dialog_headerWithButton': !!this.props.headerButton, 'mx_Dialog_headerWithButton': !!this.props.headerButton,
'mx_Dialog_headerWithCancel': !!cancelButton,
})}> })}>
<div className={classNames('mx_Dialog_title', this.props.titleClass)} id='mx_BaseDialog_title'> <div className={classNames('mx_Dialog_title', this.props.titleClass)} id='mx_BaseDialog_title'>
{headerImage} {headerImage}