piwalker/FCLauncher
1
0
Fork 0
Code Issues 1 Pull Requests Projects Releases 5 Wiki Activity

Started Navbar

Browse Source
This commit is contained in:
cuptain 2024-10-31 13:38:56 +11:00
parent 25426e749b
commit ca21acf6b1
2 changed files with 59 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
fclauncher/frontend/src/App.svelte
View File

@ -6,6 +6,7 @@
import { onMount } from 'svelte' import { onMount } from 'svelte'
import { loading } from './global.ts' import { loading } from './global.ts'
import { slide } from 'svelte/transition' import { slide } from 'svelte/transition'
import Navbar from './Navbar.svelte';
let width: int = 10 let width: int = 10
@ -17,7 +18,11 @@
</script> </script>
<main> <main>
<img alt="Wails logo" id="logo" src="{logo}"> <div>
<Navbar />
</div>
<body>
<img alt="Wails logo" id="logo" src="{logo}">
{#if $loading} {#if $loading}
<div transition:slide="{{duration:100}}"> <div transition:slide="{{duration:100}}">
<Loading /> <Loading />
@ -27,9 +32,17 @@
<Instances /> <Instances />
</div> </div>
{/if} {/if}
</body>
</main> </main>
<style> <style>
:root{
font-size: 16px;
--text-primary: #b6b6b6;
--text-secondary: #ececec;
--bg-primary: #23232e;
--bg-secondary: #141418;
}
#logo { #logo {
display: block; display: block;
@ -43,4 +56,14 @@
background-origin: content-box; background-origin: content-box;
} }
body{
margin-left: 5rem;
}
main{
}
</style> </style>

35
fclauncher/frontend/src/Navbar.svelte
View File

@ -0,0 +1,35 @@
<script>
</script>
<main>
<nav class="navbar">
<ul class="navbar-nav">
<li class="nav-item">
<a href="#" class="nav-link">
<span class="link-text">Test</span>
</a>
</li>
</ul>
</nav>
</main>
<style>
:root{
font-size: 16px;
--text-primary: #b6b6b6;
--text-secondary: #ececec;
--bg-primary: #23232e;
--bg-secondary: #141418;
}
.navbar {
width: 5rem;
height: 100vh;
position: fixed;
background-color: var(--bg-primary);
}
</style>