30 lines
607 B
TypeScript
30 lines
607 B
TypeScript
import { LitElement, html, css } from "lit";
|
|
import { customElement, property } from "lit/decorators.js";
|
|
|
|
@customElement("hsl-calculator")
|
|
export class HslCalculator extends LitElement {
|
|
static styles = css`
|
|
:host {
|
|
display: block;
|
|
border: 1px solid gray;
|
|
padding: 16px;
|
|
max-width: 800px;
|
|
}
|
|
`;
|
|
|
|
@property()
|
|
name = "World";
|
|
|
|
render() {
|
|
return html`
|
|
<h1>Hello, ${this.name}!</h1>
|
|
`;
|
|
}
|
|
}
|
|
|
|
declare global {
|
|
interface HTMLElementTagNameMap {
|
|
"hsl-calculator": HslCalculator;
|
|
}
|
|
}
|