diff --git a/src/components/AppRoot.ts b/src/components/AppRoot.ts index c60c622..9cf7b17 100644 --- a/src/components/AppRoot.ts +++ b/src/components/AppRoot.ts @@ -66,11 +66,23 @@ export class AppRoot extends Component { } private setupRouter() { + let initial = true; this.router .on("/", () => { this.home = true; this.page = new HomePage(this.api, this.services); }) + .on("*", () => { + this.router.navigate("/"); + }) + .hooks({ + after: () => { + if (!initial) { + this.page.focus(); + } + initial = false; + }, + }) .resolve(); } diff --git a/src/components/ServiceDayTooltip.ts b/src/components/ServiceDayTooltip.ts index 8206884..f2b6c39 100644 --- a/src/components/ServiceDayTooltip.ts +++ b/src/components/ServiceDayTooltip.ts @@ -76,7 +76,7 @@ export class ServiceDayTooltip extends Component {
- +
${this.notices.length > 0 @@ -124,21 +125,22 @@ export class ServiceDayTooltip extends Component { >${style.label} ${n - .name} + > + ${n.name} + +

${n.ended === null || - n.started.getTime() > now.getTime() + n.started.getTime() > now.getTime() || + n.ended.getTime() > now.getTime() ? ServiceDayTooltip.STATUS_NAMES[n.status] : html` - Resolved after + Resolved after `}

`; diff --git a/src/components/ServiceRow.ts b/src/components/ServiceRow.ts index 08c032f..72c2218 100644 --- a/src/components/ServiceRow.ts +++ b/src/components/ServiceRow.ts @@ -210,19 +210,20 @@ export class ServiceRow extends Component { ${this.service.description === null ? nothing : html`
- + + + +
${unsafeHTML( ServiceRow.MD.render(this.service.description), diff --git a/src/components/StatusOverview.ts b/src/components/StatusOverview.ts index cf97a4a..38d2684 100644 --- a/src/components/StatusOverview.ts +++ b/src/components/StatusOverview.ts @@ -1,4 +1,4 @@ -import { html } from "lit"; +import { html, nothing } from "lit"; import { customElement, property, state } from "lit/decorators.js"; import { Component } from "./Component"; import { MainStatus } from "../models/MainStatus"; @@ -169,9 +169,13 @@ export class StatusOverview extends Component { const status = StatusOverview.parseMainStatus(this.mainStatus); const style = StatusOverview.STYLES[status]; const message = typeof style.message === "function" - ? (this.resolvedService ? style.message(this.resolvedService) : "") + ? (this.resolvedService ? style.message(this.resolvedService) : null) : style.message; + if (message === null) { + return nothing; + } + return html`
diff --git a/src/components/pages/Page.ts b/src/components/pages/Page.ts index 4e593ee..b3002bd 100644 --- a/src/components/pages/Page.ts +++ b/src/components/pages/Page.ts @@ -1,4 +1,15 @@ import { Component } from "../Component"; export abstract class Page extends Component { + public override connectedCallback() { + super.connectedCallback(); + this.tabIndex = -1; + this.classList.add("focus:outline-none"); + } + + public focus() { + this.updateComplete.then(() => { + super.focus(); + }); + } }