You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

64 lines
1.7 KiB

<script lang="ts">
import "bootstrap/dist/css/bootstrap.min.css";
import Tailwind from "./Tailwind.svelte";
import type { SvelteComponent } from "svelte";
import { Router, Route } from "svelte-routing";
import {
faChartLine,
faClipboardList,
faCloudUploadAlt,
faTrafficLight,
} from "@fortawesome/free-solid-svg-icons";
import type { IconDefinition } from "@fortawesome/free-solid-svg-icons";
import Home from "./routes/Home.svelte";
import Navbar from "./components/Navbar.svelte";
import Rules from "./routes/Rules.svelte";
import RuleLists from "./routes/RuleLists.svelte";
import Recursors from "./routes/Recursors.svelte";
export let url = "";
interface NavLink {
label: string;
to: string;
icon: IconDefinition;
Component: typeof SvelteComponent;
}
const links: NavLink[] = [
{ label: "Stats", to: "/", icon: faChartLine, Component: Home },
{
label: "Rules",
to: "/rules",
icon: faTrafficLight,
Component: Rules,
},
{
label: "Rule Lists",
to: "/rulelists",
icon: faClipboardList,
Component: RuleLists,
},
{
label: "Recursors",
to: "/recursors",
icon: faCloudUploadAlt,
Component: Recursors,
},
];
</script>
<Tailwind />
<main class="flex w-full h-full">
<Router {url}>
<Navbar {links} />
<div class="flex-column py-5 px-5 w-full h-full overflow-y-auto">
{#each links as link}
<Route path={link.to} component={link.Component} />
{/each}
</div>
</Router>
</main>