partey_workadventure/desktop/local-app/src/App.svelte

56 lines
1.8 KiB
Svelte
Raw Normal View History

2022-02-20 20:30:53 +01:00
<script lang="ts">
import { Router, Route } from "svelte-navigator";
2022-02-22 10:05:21 +01:00
import Sidebar from "~/lib/Sidebar.svelte";
import LazyRoute from "~/lib/LazyRoute.svelte";
2022-02-22 12:02:56 +01:00
import { api } from "~/lib/ipc";
2022-02-20 20:30:53 +01:00
2022-02-22 10:05:21 +01:00
const Home = () => import("~/views/Home.svelte");
const AddServer = () => import("~/views/AddServer.svelte");
const Settings = () => import("~/views/Settings.svelte");
2022-02-22 16:57:56 +01:00
const Server = () => import("~/views/Server.svelte");
2022-02-20 20:30:53 +01:00
2022-02-22 12:02:56 +01:00
let insideElectron = api.desktop;
2022-02-20 20:30:53 +01:00
</script>
{#if insideElectron}
<Router>
<Sidebar />
<main class="flex flex-grow">
<LazyRoute path="/" component={Home} delayMs={500}>Loading ...</LazyRoute>
<LazyRoute path="/server/add" component={AddServer} delayMs={500}>Loading ...</LazyRoute>
2022-02-22 10:05:21 +01:00
<LazyRoute path="/settings" component={Settings} delayMs={500}>Loading ...</LazyRoute>
2022-02-22 16:57:56 +01:00
<LazyRoute path="/server/:id" component={Server} delayMs={500}>Loading ...</LazyRoute>
2022-02-20 20:30:53 +01:00
<Route>
<h3>404</h3>
<p>No Route could be matched.</p>
</Route>
</main>
</Router>
{:else}
<main class="flex flex-grow justify-center items-center">Please open the app inside of Electron.</main>
{/if}
<style>
2022-02-22 10:05:21 +01:00
@import "@fontsource/press-start-2p/index.css";
@import "@16bits/nes.css/css/nes.min.css";
2022-02-20 20:30:53 +01:00
:root {
2022-02-22 10:05:21 +01:00
font-family: "Press Start 2P", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell,
"Open Sans", "Helvetica Neue", sans-serif;
2022-02-20 20:30:53 +01:00
}
main {
2022-02-20 21:06:27 +01:00
/* TODO */
2022-02-20 20:30:53 +01:00
background-color: #30343d;
2022-02-20 21:06:27 +01:00
/* background-color: #2b2f37; */
/* color: #62727c;
border: 1px solid #62727c; */
/* border-color: #e1e4e8;
color: #e1e4e8; */
2022-02-20 20:30:53 +01:00
}
</style>