72 lines
		
	
	
		
			1.5 KiB
		
	
	
	
		
			TypeScript
		
	
	
	
	
	
			
		
		
	
	
			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', {
 | |
|       
 | |
|     }))
 | |
|   }
 | |
| } |