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

update

Browse Source
This commit is contained in:
Jürgen Kunz
2025-06-29 22:46:29 +00:00
parent f7d3709dac
commit f2ed469dbd
1 changed files with 2 additions and 23 deletions
Download Patch File Download Diff File Expand all files Collapse all files

25
ts_web/elements/upl-statuspage-statusdetails.ts
View File

@@ -114,20 +114,10 @@ export class UplStatuspageStatusdetails extends DeesElement {
} }
.mainbox .barContainer .bar.no-data { .mainbox .barContainer .bar.no-data {
background: ${colors.border.muted}; background: ${cssManager.bdTheme('#d1d5db', '#52525b')};
opacity: 0.3; opacity: ${cssManager.bdTheme('0.5', '0.35')};
} }
.timeIndicator {
position: absolute;
width: 2px;
height: calc(100% - ${unsafeCSS(spacing.md)});
background: ${colors.text.primary};
top: ${unsafeCSS(spacing.sm)};
transition: left 0.3s;
opacity: 0.5;
pointer-events: none;
}
.time-labels { .time-labels {
display: flex; display: flex;
@@ -258,8 +248,6 @@ export class UplStatuspageStatusdetails extends DeesElement {
]; ];
public render(): TemplateResult { public render(): TemplateResult {
const timeIndicatorPosition = this.calculateTimeIndicatorPosition();
return html` return html`
<div class="container"> <div class="container">
<uplinternal-miniheading>${this.serviceName} - Last ${this.hoursToShow} Hours</uplinternal-miniheading> <uplinternal-miniheading>${this.serviceName} - Last ${this.hoursToShow} Hours</uplinternal-miniheading>
@@ -271,7 +259,6 @@ export class UplStatuspageStatusdetails extends DeesElement {
` : html` ` : html`
<div class="barContainer" @mouseleave=${this.hideTooltip}> <div class="barContainer" @mouseleave=${this.hideTooltip}>
${this.renderBars()} ${this.renderBars()}
<div class="timeIndicator" style="left: ${timeIndicatorPosition}px"></div>
</div> </div>
<div class="time-labels"> <div class="time-labels">
<span>${this.getTimeLabel(0)}</span> <span>${this.getTimeLabel(0)}</span>
@@ -349,14 +336,6 @@ export class UplStatuspageStatusdetails extends DeesElement {
}); });
} }
private calculateTimeIndicatorPosition(): number {
const containerWidth = 888; // Approximate width minus padding
const barWidth = 19; // Width + margin
const totalBars = this.hoursToShow;
const currentMinutes = new Date().getMinutes();
const currentPosition = (totalBars - 1 + currentMinutes / 60) * barWidth + 6;
return Math.min(currentPosition, containerWidth - 11);
}
private getTimeLabel(hoursAgo: number): string { private getTimeLabel(hoursAgo: number): string {
const date = new Date(Date.now() - (hoursAgo * 60 * 60 * 1000)); const date = new Date(Date.now() - (hoursAgo * 60 * 60 * 1000));