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

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

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