Feat: Frontend
This commit is contained in:
@@ -2,14 +2,22 @@
|
||||
import '$styles/tailwind.css';
|
||||
|
||||
const pages = [
|
||||
{ name: 'Home', icon: 'home', path: '/attendee' },
|
||||
{ name: 'Chat', icon: 'chat', path: '/attendee/chat' },
|
||||
{ name: 'Networking', icon: 'social', path: '/attendee/networking' },
|
||||
{ name: 'Calendar', icon: 'calendar', path: '/attendee/calendar' }
|
||||
{ name: 'Dashboard', path: '/' },
|
||||
{ name: 'Settings', path: '/settings' },
|
||||
{ name: 'About', path: '/about' },
|
||||
{ name: 'Docs', path: '/docs' },
|
||||
{ name: 'Contact', path: '/contact' }
|
||||
] as const;
|
||||
</script>
|
||||
|
||||
<div class="bg-[#0B2A37] h-screen w-screen">
|
||||
<div />
|
||||
<div class="flex flex-row items-center px-20">
|
||||
<img class="w-40" src="/icons/Logo.svg" alt="Logo" />
|
||||
<div class="w-full justify-between flex px-5 lg:px-40 text-lg text-white">
|
||||
{#each pages as link}
|
||||
<a href={link.path}>{link.name}</a>
|
||||
{/each}
|
||||
</div>
|
||||
</div>
|
||||
<slot />
|
||||
</div>
|
||||
|
||||
@@ -0,0 +1,24 @@
|
||||
<script lang="ts">
|
||||
let numberOfAccessPoints = 0;
|
||||
let numberOfAccessPointsUp = 0;
|
||||
</script>
|
||||
|
||||
<div class="height">
|
||||
<div class="bg-[#05171E] rounded-lg w-3/4 h-full mx-auto mt-20 py-4 px-20">
|
||||
<div class="text-white text-center text-3xl">Dashboard</div>
|
||||
<div class="flex flex-row text-white mt-20 text-xl">
|
||||
<div class="pr-2">Access point amount :</div>
|
||||
<div>{numberOfAccessPoints}</div>
|
||||
</div>
|
||||
<div class="flex flex-row text-white mt-20 text-xl">
|
||||
<div class="pr-2">Access points up :</div>
|
||||
<div>{numberOfAccessPointsUp}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.height {
|
||||
height: calc(100vh - 14rem);
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,17 @@
|
||||
<div class="height">
|
||||
<div class="bg-[#05171E] rounded-lg w-3/4 h-full mx-auto mt-20 py-4 px-20">
|
||||
<div class="text-white text-center text-3xl">About</div>
|
||||
<div class="flex flex-row text-white mt-20 text-xl">
|
||||
This project was made by the Pátek team during the 2023 Junior AT&T Hackathon.
|
||||
</div>
|
||||
<div class="flex flex-row text-white mt-20 text-xl">
|
||||
It’s an open-source management tool for access points with
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.height {
|
||||
height: calc(100vh - 14rem);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,12 @@
|
||||
<div class="height">
|
||||
<div class="bg-[#05171E] rounded-lg w-3/4 h-full mx-auto mt-20 py-4 px-20">
|
||||
<div class="text-white text-center text-3xl">Contact</div>
|
||||
<div class="flex flex-row text-white mt-20 text-xl">patek@gbl.cz</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.height {
|
||||
height: calc(100vh - 14rem);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,19 @@
|
||||
<div class="height">
|
||||
<div class="bg-[#05171E] rounded-lg w-3/4 h-full mx-auto mt-20 py-4 px-20">
|
||||
<div class="text-white text-center text-3xl">Docs</div>
|
||||
<div class="flex flex-row text-white mt-20 text-xl">
|
||||
dummy text dummy text dummy text dummy text dummy text dummy text dummy text dummy text dummy
|
||||
text dummy text dummy text dummy text dummy text dummy text dummy text dummy text dummy text
|
||||
dummy text dummy text dummy text dummy text dummy text dummy text dummy text dummy text dummy
|
||||
text dummy text dummy text dummy text dummy text dummy text dummy text dummy text dummy text
|
||||
dummy text dummy text dummy text dummy text dummy text dummy text dummy text dummy text dummy
|
||||
text dummy text
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.height {
|
||||
height: calc(100vh - 14rem);
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,26 @@
|
||||
<div class="height">
|
||||
<div class="bg-[#05171E] rounded-lg w-3/4 h-full mx-auto mt-20 py-4 px-20">
|
||||
<div class="text-white text-center text-3xl">Settings</div>
|
||||
<table class="text-white border mx-auto mt-10">
|
||||
<tr>
|
||||
<th class="title">ID</th>
|
||||
<th class="title">Name</th>
|
||||
<th class="title">Type</th>
|
||||
<th class="title">Location</th>
|
||||
<th class="title">IP address</th>
|
||||
</tr>
|
||||
</table>
|
||||
<div class="flex justify-center mt-10">
|
||||
<button class="text-white py-2 px-10 bg-[#1D3920] rounded-xl"> Add access point </button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
.height {
|
||||
height: calc(100vh - 14rem);
|
||||
}
|
||||
.title {
|
||||
@apply py-2 px-10 bg-[#5B5B5B] border;
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user