make tag panel context menu icons follow text color

This commit is contained in:
Bruno Windels 2020-07-10 10:20:26 +02:00
parent c2d4e45495
commit f2f813c43c
2 changed files with 16 additions and 19 deletions

View file

@ -15,9 +15,8 @@ limitations under the License.
*/
.mx_TagTileContextMenu_item {
padding-top: 8px;
padding: 8px;
padding-right: 20px;
padding-bottom: 8px;
cursor: pointer;
white-space: nowrap;
display: flex;
@ -25,15 +24,22 @@ limitations under the License.
line-height: $font-16px;
}
.mx_TagTileContextMenu_item object {
pointer-events: none;
.mx_TagTileContextMenu_item::before {
content: '';
height: 15px;
width: 15px;
background-color: currentColor;
mask-repeat: no-repeat;
mask-size: contain;
margin-right: 8px;
}
.mx_TagTileContextMenu_viewCommunity::before {
mask-image: url('$(res)/img/element-icons/view-community.svg');
}
.mx_TagTileContextMenu_item_icon {
padding-right: 8px;
padding-left: 4px;
display: inline-block;
.mx_TagTileContextMenu_hideCommunity::before {
mask-image: url('$(res)/img/element-icons/hide.svg');
}
.mx_TagTileContextMenu_separator {

View file

@ -54,21 +54,12 @@ export default class TagTileContextMenu extends React.Component {
}
render() {
const TintableSvg = sdk.getComponent("elements.TintableSvg");
return <div>
<MenuItem className="mx_TagTileContextMenu_item" onClick={this._onViewCommunityClick}>
<TintableSvg
className="mx_TagTileContextMenu_item_icon"
src={require("../../../../res/img/element-icons/view-community.svg")}
width="15"
height="15"
/>
<MenuItem className="mx_TagTileContextMenu_item mx_TagTileContextMenu_viewCommunity" onClick={this._onViewCommunityClick}>
{ _t('View Community') }
</MenuItem>
<hr className="mx_TagTileContextMenu_separator" role="separator" />
<MenuItem className="mx_TagTileContextMenu_item" onClick={this._onRemoveClick}>
<img className="mx_TagTileContextMenu_item_icon" src={require("../../../../res/img/element-icons/hide.svg")} width="15" height="15" alt="" />
<MenuItem className="mx_TagTileContextMenu_item mx_TagTileContextMenu_hideCommunity" onClick={this._onRemoveClick}>
{ _t('Hide') }
</MenuItem>
</div>;