Spinner web component
yarn add @conectate/ct-spinner
#or
npm i @conectate/ct-spinner
On HTML
<!-- Active -->
<ct-spinner active="true"></ct-spinner>
<!-- Inactive -->
<ct-spinner active="false"></ct-spinner>
On LitElement
with typescript
import { LitElement, css, customElement, html, property } from "lit";
@customElement("ct-main")
export class CtMain extends LitElement {
@property({ type: Boolean, reflect: true }) active = true;
static styles = css`
:host {
display: block;
}
`;
render() {
return html`<ct-spinner></ct-spinner>`;
}
}
<ct-spinner></ct-spinner>
Property | Attribute | Type | Default |
---|---|---|---|
active |
active |
boolean |
true |
Property | Description |
---|---|
--ct-spinner-1 |
Spinner Color 1 |
--ct-spinner-2 |
Spinner Color 2 |