PluralKit/dashboard/src/App.svelte

78 lines
2.9 KiB
Svelte
Raw Normal View History

2021-12-09 11:53:54 +00:00
<script lang="ts">
2021-12-12 09:31:08 +00:00
import { Router, Route } from "svelte-navigator";
2021-12-11 11:00:38 +00:00
import Navigation from "./lib/Navigation.svelte";
2021-12-11 11:01:36 +00:00
import Dash from "./pages/Dash.svelte";
import Home from "./pages/Home.svelte";
2021-12-11 14:56:47 +00:00
import Settings from './pages/Settings.svelte';
2021-12-12 09:31:08 +00:00
import Public from "./pages/Public.svelte";
import Main from "./pages/Profile.svelte";
2022-01-12 03:09:50 +00:00
import Status from './pages/status.svelte';
import Member from './pages/Member.svelte';
2022-03-19 12:10:14 +00:00
import Group from './pages/Group.svelte';
2022-04-25 18:44:40 +00:00
import PageNotFound from './pages/PageNotFound.svelte';
2022-03-19 12:10:14 +00:00
import { Alert } from 'sveltestrap';
2022-04-07 13:22:35 +00:00
import DiscordLogin from "./pages/DiscordLogin.svelte";
2022-04-07 17:33:11 +00:00
import { onMount } from 'svelte';
2022-05-09 21:15:00 +00:00
import BulkGroupPrivacy from "./pages/BulkGroupPrivacy.svelte";
import BulkMemberPrivacy from "./pages/BulkMemberPrivacy.svelte";
2021-12-11 10:58:50 +00:00
// theme cdns (I might make some myself too)
2021-12-11 11:00:38 +00:00
// if there's a style already set, retrieve it
let style = localStorage.getItem("pk-style") && localStorage.getItem("pk-style");
2021-12-11 11:00:38 +00:00
// this automatically applies the style every time it is updated
$: setStyle(style);
2021-12-09 11:53:54 +00:00
2021-12-11 11:00:38 +00:00
// not sure if there's a better way to handle this
2021-12-09 11:53:54 +00:00
function setStyle(style) {
switch (style) {
case "light": document.documentElement.className = "light";
2021-12-09 11:53:54 +00:00
localStorage.setItem("pk-style", "light");
break;
case "dark": document.documentElement.className = "dark";
2021-12-09 11:53:54 +00:00
localStorage.setItem("pk-style", "dark");
break;
default: document.documentElement.className = "dark";
2021-12-11 10:58:50 +00:00
localStorage.setItem("pk-style", "dark");
break;
2021-12-09 11:53:54 +00:00
};
};
let falseBool = false;
2022-04-07 17:33:11 +00:00
onMount(() => {
let settings = JSON.parse(localStorage.getItem("pk-settings"));
2022-04-25 17:10:17 +00:00
if (settings && settings.accessibility && settings.accessibility.opendyslexic === true) {
2022-04-07 17:33:11 +00:00
document.getElementById("app").classList.add("dyslexic");
}
});
2021-12-09 11:53:54 +00:00
</script>
<Router>
2021-12-11 11:00:38 +00:00
<Navigation bind:style={style}/>
2021-12-12 09:31:08 +00:00
<Route path="/"><Home /></Route>
2022-04-07 13:22:35 +00:00
<Route path="/login/discord"><DiscordLogin /></Route>
<Route path="dash"><Dash /></Route>
<Route path="dash/m/:id"><Member isPublic={falseBool}/></Route>
2022-03-19 12:10:14 +00:00
<Route path = "dash/g/:id"><Group isPublic={falseBool}/></Route>
2022-05-09 21:15:00 +00:00
<Route path="dash/bulk-member-privacy"><BulkMemberPrivacy/></Route>
<Route path="dash/bulk-group-privacy"><BulkGroupPrivacy/></Route>
<Route path="settings"><Settings /></Route>
<Route path="profile"><Public /></Route>
<Route path = "profile/s/:id"><Main /></Route>
<Route path = "s">
2022-03-19 12:10:14 +00:00
<Alert color="danger">Please provide a system ID in the URL.</Alert>
</Route>
<Route path = "profile/m/:id"><Member/></Route>
<Route path = "profile/m">
2022-03-19 12:10:14 +00:00
<Alert color="danger">Please provide a member ID in the URL.</Alert>
</Route>
2022-03-19 12:10:14 +00:00
<Route path = "profile/g/:id"><Group/></Route>
<Route path = "profile/g">
2022-03-19 12:10:14 +00:00
<Alert color="danger">Please provide a group ID in the URL.</Alert>
2021-12-11 14:56:47 +00:00
</Route>
2022-01-12 03:09:50 +00:00
<Route path="status"><Status /></Route>
2022-04-25 18:44:40 +00:00
<Route component={PageNotFound}/>
2021-12-09 11:53:54 +00:00
</Router>