Include mx_MessageActionBar_maskButton in mx_MessageActionBar (#8792)

* Include mx_MessageActionBar_maskButton in mx_MessageActionBar

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>

* yarn run lint:style --fix

Signed-off-by: Suguru Hirahara <luixxiul@users.noreply.github.com>
pull/28217/head
Suguru Hirahara 2022-06-16 13:34:56 +00:00 committed by GitHub
parent fe8c267a14
commit 3b28b1100f
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
1 changed files with 78 additions and 78 deletions

View File

@ -67,96 +67,96 @@ limitations under the License.
z-index: var(--MessageActionBar-item-hover-zIndex); z-index: var(--MessageActionBar-item-hover-zIndex);
} }
} }
}
.mx_MessageActionBar_maskButton { .mx_MessageActionBar_maskButton {
width: var(--MessageActionBar-size-button); width: var(--MessageActionBar-size-button);
height: var(--MessageActionBar-size-button); height: var(--MessageActionBar-size-button);
&:disabled, &:disabled,
&[disabled] { &[disabled] {
cursor: not-allowed; cursor: not-allowed;
opacity: .75; opacity: .75;
} }
&::after {
content: '';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
mask-size: 18px;
mask-repeat: no-repeat;
mask-position: center;
background-color: $secondary-content;
}
&:hover::after {
background-color: $primary-content;
}
&.mx_MessageActionBar_reactButton::after {
mask-image: url('$(res)/img/element-icons/room/message-bar/emoji.svg');
}
&.mx_MessageActionBar_replyButton::after {
mask-image: url('$(res)/img/element-icons/room/message-bar/reply.svg');
}
&.mx_MessageActionBar_threadButton {
&::after { &::after {
mask-image: url('$(res)/img/element-icons/message/thread.svg'); content: '';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
mask-size: 18px;
mask-repeat: no-repeat;
mask-position: center;
background-color: $secondary-content;
} }
.mx_Indicator { &:hover::after {
background: $links; background-color: $primary-content;
animation-iteration-count: infinite;
}
}
&.mx_MessageActionBar_editButton::after {
mask-image: url('$(res)/img/element-icons/room/message-bar/edit.svg');
}
&.mx_MessageActionBar_optionsButton::after {
mask-image: url('$(res)/img/element-icons/context-menu.svg');
}
&.mx_MessageActionBar_resendButton::after {
mask-image: url('$(res)/img/element-icons/retry.svg');
}
&.mx_MessageActionBar_cancelButton::after {
mask-image: url('$(res)/img/element-icons/trashcan.svg');
}
&.mx_MessageActionBar_downloadButton {
&::after {
mask-size: 14px;
mask-image: url('$(res)/img/download.svg');
} }
&.mx_MessageActionBar_downloadSpinnerButton::after { &.mx_MessageActionBar_reactButton::after {
background-color: transparent; // hide the download icon mask mask-image: url('$(res)/img/element-icons/room/message-bar/emoji.svg');
} }
}
&.mx_MessageActionBar_expandMessageButton::after { &.mx_MessageActionBar_replyButton::after {
mask-size: 12px; mask-image: url('$(res)/img/element-icons/room/message-bar/reply.svg');
mask-image: url('$(res)/img/element-icons/expand-message.svg'); }
}
&.mx_MessageActionBar_collapseMessageButton::after { &.mx_MessageActionBar_threadButton {
mask-size: 12px; &::after {
mask-image: url('$(res)/img/element-icons/collapse-message.svg'); mask-image: url('$(res)/img/element-icons/message/thread.svg');
} }
&.mx_MessageActionBar_viewInRoomButton::after { .mx_Indicator {
mask-image: url('$(res)/img/element-icons/view-in-room.svg'); background: $links;
} animation-iteration-count: infinite;
}
}
&.mx_MessageActionBar_copyLinkButton::after { &.mx_MessageActionBar_editButton::after {
mask-image: url('$(res)/img/element-icons/link.svg'); mask-image: url('$(res)/img/element-icons/room/message-bar/edit.svg');
}
&.mx_MessageActionBar_optionsButton::after {
mask-image: url('$(res)/img/element-icons/context-menu.svg');
}
&.mx_MessageActionBar_resendButton::after {
mask-image: url('$(res)/img/element-icons/retry.svg');
}
&.mx_MessageActionBar_cancelButton::after {
mask-image: url('$(res)/img/element-icons/trashcan.svg');
}
&.mx_MessageActionBar_downloadButton {
&::after {
mask-size: 14px;
mask-image: url('$(res)/img/download.svg');
}
&.mx_MessageActionBar_downloadSpinnerButton::after {
background-color: transparent; // hide the download icon mask
}
}
&.mx_MessageActionBar_expandMessageButton::after {
mask-size: 12px;
mask-image: url('$(res)/img/element-icons/expand-message.svg');
}
&.mx_MessageActionBar_collapseMessageButton::after {
mask-size: 12px;
mask-image: url('$(res)/img/element-icons/collapse-message.svg');
}
&.mx_MessageActionBar_viewInRoomButton::after {
mask-image: url('$(res)/img/element-icons/view-in-room.svg');
}
&.mx_MessageActionBar_copyLinkButton::after {
mask-image: url('$(res)/img/element-icons/link.svg');
}
} }
} }