⚡ Adds routing
Squashed commit of the following: commitd26bffc33aAuthor: Jan Andrle <andrle.jan@centrum.cz> Date: Tue Jun 9 10:35:14 2026 +0200 ⚡ ups versions commit8bb12aaac1Author: Jan Andrle <andrle.jan@centrum.cz> Date: Fri May 22 15:56:44 2026 +0200 ⚡ 📺 finlizes routing and improves bs commitc3782509e8Author: Jan Andrle <andrle.jan@centrum.cz> Date: Wed May 20 16:10:51 2026 +0200 ⚡ first steps (footer) commit7c925d1fdbAuthor: Jan Andrle <andrle.jan@centrum.cz> Date: Wed May 20 15:24:20 2026 +0200 ⚡ 📺 tsc-alias commite4e41197b9Author: Jan Andrle <andrle.jan@centrum.cz> Date: Wed May 20 14:40:47 2026 +0200 🐛 fixes routing commit7d6240e28aAuthor: Jan Andrle <andrle.jan@centrum.cz> Date: Wed May 20 14:40:00 2026 +0200 🐛 📺 fixes dev server commit139b1590ceAuthor: Jan Andrle <andrle.jan@centrum.cz> Date: Wed Apr 29 13:40:40 2026 +0200 ⚡ Uses original router - it has benefits to use hash properly commit3cc11b68deAuthor: Jan Andrle <andrle.jan@centrum.cz> Date: Tue Apr 28 17:16:00 2026 +0200 🎉
This commit is contained in:
@@ -0,0 +1,39 @@
|
||||
import { LitElement, html } from "lit";
|
||||
import { customElement } from "lit/decorators.js";
|
||||
import { styles } from "./index.css.js";
|
||||
import { Router } from "@lit-labs/router";
|
||||
|
||||
import * as routeHome from "./app-home/routes.js";
|
||||
import * as routeEpisodes from "./app-episodes/routes.js";
|
||||
|
||||
import "./components/c-sronly.js";
|
||||
const logo = new URL("./assets/logo.svg", import.meta.url);
|
||||
|
||||
@customElement("app-cfpodcasts")
|
||||
export class AppCfpodcasts extends LitElement {
|
||||
static override styles = styles;
|
||||
private _routes = new Router(this, [
|
||||
...routeHome.routes,
|
||||
...routeEpisodes.routes,
|
||||
]);
|
||||
override render() {
|
||||
console.log(this._routes); // TODO
|
||||
return html`
|
||||
<main>${this._routes.outlet()}</main>
|
||||
<nav>
|
||||
<a
|
||||
href="${this._routes.link("/")}"
|
||||
title="Home"
|
||||
>
|
||||
<img alt="" src=${logo} />
|
||||
<c-sronly>Home</c-sronly>
|
||||
</a>
|
||||
<a
|
||||
href="${this._routes.link(routeEpisodes.path)}"
|
||||
>
|
||||
Episodes
|
||||
</a>
|
||||
</nav>
|
||||
`;
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user