Improve main menu design

master
mathieucura 2021-01-10 22:47:09 +01:00
parent 49751674a1
commit 9d3ca4786a
2 changed files with 12 additions and 10 deletions

View File

@ -9,13 +9,15 @@ template.innerHTML = `
padding: 0px;
}
elix-menu-button::part(menu) {
background-color: #eee !important;
background-color: var(--icon-bg-color) !important;
color: #fff;
}
elix-menu-button::part(popup-toggle) {
padding: 0.25em 0.60em !important
}
:host ::slotted([current]){
background-color: #F4E284 !important;
background-color: var(--icon-bg-color-hover) !important;
color: #fff;
}
:host ::slotted(*){
padding: 0.25em 1.25em 0.25em 0.25em !important;
@ -64,8 +66,8 @@ export class SeMenu extends HTMLElement {
switch (name) {
case 'src':
image.src = newValue;
image.width = 18;
image.height = 18;
image.width = 24;
image.height = 24;
this.$label.prepend(image);
break;
case 'label':

View File

@ -8,8 +8,8 @@ template.innerHTML = `
</style>
<elix-menu-item>
<div style="display:flex; align-items: center;">
<img src="./images/logo.svg" alt="icon" style="display:none;" />
<span style="margin-left: 3px;"></span>
<img src="./images/logo.svg" alt="icon" style="display:none;" width="24"/>
<span style="margin-left: 7px;"></span>
</div>
</elix-menu-item>
`;