imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Update style of composer format bar to match message action bar (#6351)

Browse source 
Signed-off-by: Robin Townsend <robin@robin.town>
This commit is contained in:
Robin Townsend 2021-10-20 11:19:54 -04:00 • committed by GitHub
parent 4b903b9fbd
commit 2ee732b84d
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
2 changed files with 17 additions and 27 deletions
Download patch file Download diff file Expand all files Collapse all files

38
res/css/views/rooms/_MessageComposerFormatBar.scss
View file

@ -16,12 +16,13 @@ limitations under the License.
.mx_MessageComposerFormatBar {
display: none;
width: calc(26px * 5);
height: 24px;
width: calc(32px * 5);
height: 32px;
position: absolute;
cursor: pointer;
border-radius: 4px;
background-color: $message-action-bar-bg-color;
border-radius: 8px;
background-color: $primary-bg-color;
border: 1px solid $input-border-color;
user-select: none;
// equal to z-index of mx_ReplyPreview and mx_RoomView_statusArea (1000)
// but as it appears after them in the DOM, will appear on top.
@ -35,32 +36,19 @@ limitations under the License.
white-space: nowrap;
display: inline-block;
position: relative;
border: 1px solid $message-action-bar-border-color;
margin-left: -1px;
margin: 2px;
&:hover {
border-color: $message-action-bar-hover-border-color;
background: $roomlist-button-bg-color;
border-radius: 6px;
z-index: 1;
}
&:first-child {
border-radius: 3px 0 0 3px;
}
&:last-child {
border-radius: 0 3px 3px 0;
}
&:only-child {
border-radius: 3px;
}
}
.mx_MessageComposerFormatBar_button {
width: 27px;
height: 24px;
width: 28px;
height: 28px;
box-sizing: border-box;
background: none;
vertical-align: middle;
}
@ -73,7 +61,11 @@ limitations under the License.
width: 100%;
mask-repeat: no-repeat;
mask-position: center;
background-color: $message-action-bar-fg-color;
background-color: $secondary-fg-color;
}
.mx_MessageComposerFormatBar_button:hover::after {
background-color: $primary-fg-color;
}
.mx_MessageComposerFormatBar_buttonIconBold::after {