statuspage/ts_web/elements/upl-statuspage-footer.ts
2021-09-27 00:45:17 +02:00

72 lines
1.5 KiB
TypeScript

import { DeesElement, property, html, customElement, TemplateResult, css, cssManager } from '@designestate/dees-element';
import * as domtools from '@designestate/dees-domtools';
declare global {
interface HTMLElementTagNameMap {
'upl-statuspage-footer': UplStatuspageFooter;
}
}
@customElement('upl-statuspage-footer')
export class UplStatuspageFooter extends DeesElement {
// STATIC
public static demo = () => html`
<upl-statuspage-footer></upl-statuspage-footer>
`;
// INSTANCE
@property()
public legalInfo: string = "https://lossless.gmbh";
@property({
type: Boolean
})
public whitelabel = false;
constructor() {
super();
}
public static styles = [
domtools.elementBasic.staticStyles,
css`
:host {
display: block;
background: ${cssManager.bdTheme('#ffffff', '#000000')};
font-family: Roboto Mono;
color: ${cssManager.bdTheme('#333333', '#ffffff')};
}
.mainbox {
max-width: 900px;
margin: auto;
padding-top: 20px;
padding-bottom: 20px;
}
`
]
public render(): TemplateResult {
return html`
${domtools.elementBasic.styles}
<style></style>
<div class="mainbox">
Hi there
</div>
`;
}
public dispatchReportNewIncident() {
this.dispatchEvent(new CustomEvent('reportNewIncident', {
}))
}
public dispatchStatusSubscribe() {
this.dispatchEvent(new CustomEvent('statusSubscribe', {
}))
}
}