uptime.link/statuspage
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix(core): update

Browse Source
This commit is contained in:
Philipp Kunz 2021-09-27 00:49:30 +02:00
parent fe38765d2f
commit efb2e53e0c
1 changed files with 41 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

85
ts_web/elements/upl-statuspage-incidents.ts
View File

@ -1,5 +1,13 @@
import * as plugins from '../plugins'; import * as plugins from '../plugins';
import { DeesElement, property, html, customElement, TemplateResult, css, cssManager } from '@designestate/dees-element'; import {
DeesElement,
property,
html,
customElement,
TemplateResult,
css,
cssManager,
} from '@designestate/dees-element';
declare global { declare global {
interface HTMLElementTagNameMap { interface HTMLElementTagNameMap {
@ -10,27 +18,24 @@ declare global {
@customElement('upl-statuspage-incidents') @customElement('upl-statuspage-incidents')
export class UplStatuspageIncidents extends DeesElement { export class UplStatuspageIncidents extends DeesElement {
// STATIC // STATIC
public static demo = () => html` public static demo = () => html` <upl-statuspage-incidents></upl-statuspage-incidents> `;
<upl-statuspage-incidents></upl-statuspage-incidents>
`;
// INSTANCE // INSTANCE
@property({ @property({
type: Array type: Array,
}) })
public currentIncidences: plugins.uplInterfaces.data.IIncident[] = []; public currentIncidences: plugins.uplInterfaces.data.IIncident[] = [];
@property({ @property({
type: Array type: Array,
}) })
public pastIncidences: plugins.uplInterfaces.data.IIncident[] = []; public pastIncidences: plugins.uplInterfaces.data.IIncident[] = [];
@property({ @property({
type: Boolean type: Boolean,
}) })
public whitelabel = false; public whitelabel = false;
constructor() { constructor() {
super(); super();
} }
@ -39,57 +44,47 @@ export class UplStatuspageIncidents extends DeesElement {
plugins.domtools.elementBasic.staticStyles, plugins.domtools.elementBasic.staticStyles,
css` css`
:host { :host {
display: block; display: block;
background: ${cssManager.bdTheme('#eeeeeb', '#222222')}; background: ${cssManager.bdTheme('#eeeeeb', '#222222')};
font-family: Roboto Mono; font-family: Roboto Mono;
color: ${cssManager.bdTheme('#333333', '#ffffff')}; color: ${cssManager.bdTheme('#333333', '#ffffff')};
} }
.mainbox { .mainbox {
max-width: 900px; max-width: 900px;
margin: auto; margin: auto;
} }
.noIncidentBox { .noIncidentBox {
background: #333; background: #333;
padding: 10px; padding: 10px;
margin-bottom: 15px; margin-bottom: 15px;
border-radius: 3px; border-radius: 3px;
}
} `,
];
`
]
public render(): TemplateResult { public render(): TemplateResult {
return html` return html`
<style></style> <style></style>
<div class="mainbox"> <div class="mainbox">
<uplinternal-miniheading> <uplinternal-miniheading> Current Incidents </uplinternal-miniheading>
Current Incidents ${this.currentIncidences.length
</uplinternal-miniheading> ? html``
<div class="noIncidentBox"> : html` <div class="noIncidentBox">No incidents ongoing.</div> `}
No incidents ongoing. <uplinternal-miniheading> Past Incidents </uplinternal-miniheading>
</div> ${this.pastIncidences.length
<uplinternal-miniheading> ? html``
Past Incidents : html` <div class="noIncidentBox">No past incidents in the last 90 days.</div> `}
</uplinternal-miniheading>
<div class="noIncidentBox">
No past incidents in the last 90 days.
</div>
</div> </div>
`; `;
} }
public dispatchReportNewIncident() { public dispatchReportNewIncident() {
this.dispatchEvent(new CustomEvent('reportNewIncident', { this.dispatchEvent(new CustomEvent('reportNewIncident', {}));
}))
} }
public dispatchStatusSubscribe() { public dispatchStatusSubscribe() {
this.dispatchEvent(new CustomEvent('statusSubscribe', { this.dispatchEvent(new CustomEvent('statusSubscribe', {}));
}))
} }
} }