update

ts_web/elements/upl-statuspage-statusdetails.ts

@@ -114,20 +114,10 @@ export class UplStatuspageStatusdetails extends DeesElement {
       }
 
       .mainbox .barContainer .bar.no-data {
-        background: ${colors.border.muted};
-        opacity: 0.3;
+        background: ${cssManager.bdTheme('#d1d5db', '#52525b')};
+        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 {
         display: flex;
@@ -258,8 +248,6 @@ export class UplStatuspageStatusdetails extends DeesElement {
   ];
 
   public render(): TemplateResult {
-    const timeIndicatorPosition = this.calculateTimeIndicatorPosition();
-
     return html`
       <div class="container">
         <uplinternal-miniheading>${this.serviceName} - Last ${this.hoursToShow} Hours</uplinternal-miniheading>
@@ -271,7 +259,6 @@ export class UplStatuspageStatusdetails extends DeesElement {
         ` : html`
           <div class="barContainer" @mouseleave=${this.hideTooltip}>
             ${this.renderBars()}
-            <div class="timeIndicator" style="left: ${timeIndicatorPosition}px"></div>
           </div>
           <div class="time-labels">
             <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 {
     const date = new Date(Date.now() - (hoursAgo * 60 * 60 * 1000));