diff --git a/res/css/views/rooms/_EditMessageComposer.scss b/res/css/views/rooms/_EditMessageComposer.scss index 23fb3a1f9b..cc5a3c7a48 100644 --- a/res/css/views/rooms/_EditMessageComposer.scss +++ b/res/css/views/rooms/_EditMessageComposer.scss @@ -18,12 +18,11 @@ limitations under the License. .mx_EditMessageComposer { display: flex; flex-direction: column; + max-width: 100%; // disable overflow + width: auto; gap: 5px; padding: 3px; - // Make sure the formatting bar is visible - overflow: visible !important; // override mx_EventTile_content - .mx_BasicMessageComposer_input { border-radius: 4px; border: solid 1px $primary-hairline-color; @@ -38,12 +37,15 @@ limitations under the License. .mx_EditMessageComposer_buttons { display: flex; - flex-direction: row; + flex-flow: row wrap-reverse; // display "Save" over "Cancel" justify-content: flex-end; gap: 5px; + margin-inline-start: auto; .mx_AccessibleButton { - padding: 5px 40px; + flex: 1; + box-sizing: border-box; + min-width: 100px; // magic number to align the edge of the button with the input area } } } diff --git a/res/css/views/rooms/_EventTile.scss b/res/css/views/rooms/_EventTile.scss index 1491631059..9f398c5594 100644 --- a/res/css/views/rooms/_EventTile.scss +++ b/res/css/views/rooms/_EventTile.scss @@ -51,6 +51,13 @@ $threadInfoLineHeight: calc(2 * $font-12px); // See: _commons.scss mask-image: url('$(res)/img/element-icons/circle-sending.svg'); } + .mx_EventTile_content { + &.mx_EditMessageComposer { + // Make sure the formatting bar is visible + overflow: visible; + } + } + &[data-layout=group] { .mx_EventTile_line { line-height: var(--GroupLayout-EventTile-line-height);