2022-08-02 18:30:40 +02:00
|
|
|
import {Et2Widget} from "../../Et2Widget/Et2Widget";
|
|
|
|
import {SlTab} from "@shoelace-style/shoelace";
|
2022-08-04 16:19:30 +02:00
|
|
|
import shoelace from "../../Styles/shoelace";
|
|
|
|
import {css} from "@lion/core";
|
2022-08-02 18:30:40 +02:00
|
|
|
|
|
|
|
export class Et2Tab extends Et2Widget(SlTab)
|
|
|
|
{
|
2022-08-04 16:19:30 +02:00
|
|
|
static get styles()
|
|
|
|
{
|
|
|
|
return [
|
|
|
|
...super.styles,
|
|
|
|
...shoelace,
|
|
|
|
css`
|
|
|
|
.tab {
|
|
|
|
font-size: var(--sl-size-x-small);
|
2022-08-30 07:50:43 +02:00
|
|
|
}
|
|
|
|
.tab.tab--active:not(.tab--disabled) {color:var(--sl-color-gray-800)}
|
|
|
|
.tab:hover:not(.tab--disabled) {color:var(--sl-color-gray-800)}
|
2022-08-04 16:19:30 +02:00
|
|
|
`
|
|
|
|
];
|
|
|
|
}
|
2022-08-02 18:30:40 +02:00
|
|
|
|
|
|
|
static get properties()
|
|
|
|
{
|
|
|
|
return {
|
|
|
|
...super.properties,
|
|
|
|
|
|
|
|
hidden: {type: Boolean, reflect: true}
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
constructor()
|
|
|
|
{
|
|
|
|
super();
|
|
|
|
this.hidden = false;
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
customElements.define("et2-tab", Et2Tab);
|