Change Et2SwitchIcon style in toolbar

This commit is contained in:
nathan 2024-10-21 11:46:35 -06:00
parent 405fe13242
commit c2f3203c68
2 changed files with 16 additions and 5 deletions

View File

@ -64,11 +64,18 @@ export class Et2SwitchIcon extends Et2InputWidget(LitElement)
color: var(--sl-color-neutral-400); color: var(--sl-color-neutral-400);
} }
sl-switch {
display: flex;
align-items: center;
}
sl-switch[checked] slot[name="on"], sl-switch:not([checked]) slot[name="off"] { sl-switch[checked] slot[name="on"], sl-switch:not([checked]) slot[name="off"] {
color: var(--indicator-color, inherit); color: var(--indicator-color, inherit);
} }
sl-switch::part(label) { sl-switch::part(label), sl-switch::part(form-control) {
display: flex;
align-items: center;
margin-inline-start: 0px; margin-inline-start: 0px;
} }

View File

@ -2619,8 +2619,12 @@ table.egwGridView_outer thead tr th.noResize:hover {
} }
.et2_toolbar et2-switch-icon { .et2_toolbar et2-switch-icon {
font-size: 2.4em; font-size: 20px;
height: 1em; border-radius: var(--sl-border-radius-medium);
border-color: var(--sl-input-border-color);
border-width: var(--sl-input-border-width);
border-style: solid;
padding: 0px var(--sl-spacing-medium);
} }
.et2_toolbar et2-switch-icon::part(form-control-label) { .et2_toolbar et2-switch-icon::part(form-control-label) {
@ -2630,10 +2634,10 @@ table.egwGridView_outer thead tr th.noResize:hover {
} }
.et2_toolbar et2-switch-icon::part(switch-label) { .et2_toolbar et2-switch-icon::part(switch-label) {
top: calc(-1.1 * var(--sl-spacing-medium)); top: calc(-0.3 * var(--sl-spacing-medium));
} }
et2-switch-icon:hover:not([disabled])::part(control) { et2-switch-icon:hover:not([disabled]), et2-switch-icon:hover:not([disabled])::part(control) {
background-color: var(--sl-color-gray-150); background-color: var(--sl-color-gray-150);
border-color: var(--sl-input-border-color-hover); border-color: var(--sl-input-border-color-hover);
color: var(--sl-input-color-hover); color: var(--sl-input-color-hover);