liz/PluralKit
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: a whole lot of stuff

Browse Source
This commit is contained in:
Spectralitree
2021-12-11 12:01:36 +01:00
parent a2f22843ee
commit eba1a4543f
10 changed files with 428 additions and 36 deletions
Download Patch File Download Diff File Expand all files Collapse all files

79
src/lib/Navigation.svelte
View File

@@ -1,42 +1,51 @@
<script lang="ts">
import {Navbar, NavbarBrand, Nav, NavItem, NavLink, Collapse, NavbarToggler, Dropdown, DropdownItem, DropdownMenu, DropdownToggle} from 'sveltestrap';
import { createEventDispatcher } from 'svelte';
import { loggedIn } from '../stores';
import { Link } from 'svelte-navigator';
const dispatch = createEventDispatcher();
function changeStyle(style: string) {
dispatch('styleChange', style.toLowerCase());
}
export let style: string;
let isOpen = false;
const toggle = () => (isOpen = !isOpen);
</script>
<Navbar color="transparent" light expand="lg">
<NavbarBrand>pk-webs</NavbarBrand>
<NavbarToggler on:click={toggle}></NavbarToggler>
<Collapse {isOpen} navbar expand="lg">
<Nav class="ms-auto" navbar>
<Dropdown nav inNavbar>
<DropdownToggle>Styles</DropdownToggle>
<DropdownMenu end>
<DropdownItem on:click={() => changeStyle("light")}>Light</DropdownItem>
<DropdownItem on:click={() => changeStyle("dark")}>Dark</DropdownItem>
</DropdownMenu>
</Dropdown>
<NavItem>
<NavLink href="/dash">Dash</NavLink>
</NavItem>
<NavItem>
<NavLink href="/settings">Settings</NavLink>
</NavItem>
<NavItem>
<NavLink href="/templates">templates</NavLink>
</NavItem>
<NavItem>
<NavLink href="/public">Public</NavLink>
</NavItem>
</Nav>
</Collapse>
</Navbar>
let loggedIn_value: boolean;
loggedIn.subscribe(value => {
loggedIn_value = value;
});
</script>
<div style="background-color: #292929">
<Navbar color="light" light expand="lg" class="mb-4">
<NavbarBrand>pk-webs</NavbarBrand>
<NavbarToggler on:click={toggle}></NavbarToggler>
<Collapse {isOpen} navbar expand="lg">
<Nav class="ms-auto" navbar>
<Dropdown nav inNavbar>
<DropdownToggle color="transparent">Styles</DropdownToggle>
<DropdownMenu end>
<DropdownItem on:click={() => style = "light"}>Light</DropdownItem>
<DropdownItem on:click={() => style = "dark"}>Dark</DropdownItem>
</DropdownMenu>
</Dropdown>
{#if loggedIn_value || localStorage.getItem("pk-token")}
<Dropdown nav inNavbar>
<DropdownToggle color="transparent">Dash</DropdownToggle>
<DropdownMenu end>
<Link to="/dash" state={{tab: "system"}}><DropdownItem>System</DropdownItem></Link>
<Link to="/dash" state={{tab: "members"}}><DropdownItem>Members</DropdownItem></Link>
</DropdownMenu>
</Dropdown>
{/if}
<NavItem>
<NavLink href="/settings">Settings</NavLink>
</NavItem>
<NavItem>
<NavLink href="/templates">Templates</NavLink>
</NavItem>
<NavItem>
<NavLink href="/public">Public</NavLink>
</NavItem>
</Nav>
</Collapse>
</Navbar>
</div>