61 lines
No EOL
1.5 KiB
Text
61 lines
No EOL
1.5 KiB
Text
---
|
|
const {Page, Service} = Astro.props
|
|
|
|
const StatusResponse = await fetch("https://" + Page + "/json",).then((response) => response.json());
|
|
|
|
if (Service) {
|
|
var IsStatus = StatusResponse.services[Service].status
|
|
} else {
|
|
var IsStatus = StatusResponse.status
|
|
}
|
|
|
|
var OnlineColor = "#0e9f6e"
|
|
var MinorColor = "#c27803"
|
|
var MajorColor = "#f05252"
|
|
|
|
if (IsStatus === "major_outage") {
|
|
var Status = "Major Outage"
|
|
var StatusColor = MajorColor
|
|
} else if (IsStatus === "minor_outage") {
|
|
var Status = "Minor Outage"
|
|
var StatusColor = MinorColor
|
|
} else if (IsStatus === "operational") {
|
|
var Status = "Operational"
|
|
var StatusColor = OnlineColor
|
|
} else if (IsStatus === "online") {
|
|
var Status = "Online"
|
|
var StatusColor = OnlineColor
|
|
} else if (IsStatus === "offline") {
|
|
var Status = "Offline"
|
|
var StatusColor = MajorColor
|
|
}
|
|
---
|
|
|
|
<a href={'https://' + Page} target="_blank" class="nw-status"><span/> {Status}</a>
|
|
|
|
<style define:vars={{StatusColor}}>
|
|
.nw-status {
|
|
background: #1e1e1e;
|
|
height: min-content;
|
|
border-radius: 6px;
|
|
color: white;
|
|
padding: 2px 10px;
|
|
text-decoration: none;
|
|
cursor: pointer;
|
|
font-size: 14px;
|
|
display: flex;
|
|
gap: 6px;
|
|
align-items: center;
|
|
margin: 0px;
|
|
text-transform: capitalize;
|
|
max-width: max-content;
|
|
span {
|
|
background: var(--StatusColor);
|
|
aspect-ratio: 1;
|
|
width: 12px;
|
|
height: 12px;
|
|
display: block;
|
|
border-radius: 1rem;
|
|
}
|
|
}
|
|
</style> |