:lipsticks: menu action
This commit is contained in:
parent
1e665b8c46
commit
e304199b6f
3 changed files with 15 additions and 6 deletions
|
@ -226,6 +226,7 @@
|
|||
padding: 0 4px;
|
||||
margin-left: 4px;
|
||||
display: flex;
|
||||
translate: var(--b3-transition);
|
||||
|
||||
svg {
|
||||
height: 14px;
|
||||
|
|
|
@ -214,7 +214,7 @@
|
|||
background-color: var(--b3-list-hover);
|
||||
|
||||
& > .b3-menu__action {
|
||||
opacity: .68;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
|
@ -236,15 +236,23 @@
|
|||
|
||||
&__action {
|
||||
opacity: 0;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
width: 22px;
|
||||
height: 22px;
|
||||
align-self: center;
|
||||
margin-left: 8px;
|
||||
color: var(--b3-theme-on-surface);
|
||||
color: var(--b3-theme-on-surface-light);
|
||||
border-radius: var(--b3-border-radius);
|
||||
padding: 4px;
|
||||
box-sizing: border-box;
|
||||
translate: var(--b3-transition);
|
||||
|
||||
&:hover {
|
||||
opacity: 1;
|
||||
color: var(--b3-theme-on-background);
|
||||
background-color: var(--b3-list-icon-hover);
|
||||
}
|
||||
|
||||
&--close:hover {
|
||||
background-color: transparent;
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
@ -222,7 +222,7 @@ export class MenuItem {
|
|||
html += `<span class="b3-menu__accelerator">${updateHotkeyTip(options.accelerator)}</span>`;
|
||||
}
|
||||
if (options.action) {
|
||||
html += `<svg class="b3-menu__action"><use xlink:href="#${options.action}"></use></svg>`;
|
||||
html += `<svg class="b3-menu__action${options.action === "iconCloseRound" ? " b3-menu__action--close" : ""}"><use xlink:href="#${options.action}"></use></svg>`;
|
||||
}
|
||||
this.element.innerHTML = html;
|
||||
}
|
||||
|
|
Loading…
Add table
Reference in a new issue