blob: eaea191a2c36b1e32277ba87dcd03bcb61a5adb7 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
|
<script>
import DarkModeSwitch from "./components/DarkModeSwitch.svelte";
let active_section : undefined;
let sections = [
'File Uploads',
'Peer Teachers',
'Labs',
'Active Peer Teachers',
'Stats',
'TAMU html output'
]
let sections2 = [
{name: 'File Uploads', file: null, isActive: 'active'},
{name: 'Peer Teachers', file: null, isActive: 'active'}
]
function chooseSection(sec) {
active_section = sec;
console.log('Chose section', active_section)
}
</script>
<!-- Entire Page -->
<div class="flex flex-row h-screen">
<!-- SIDEBAR -->
<div class="w-2/12 flex flex-col border-r">
<!-- Header for sidebar sections -->
<div
class="font-serif flex-none text-center text-2xl text-neutral-900 p-4 border-b font-black"
>
<!-- Text -->
<div>Peer Teacher Manager</div>
<div>
<DarkModeSwitch />
</div>
</div>
<!-- Sidebar sections -->
<div class="flex-col overflow-y-auto">
<ul class="menu bg-base-100 w-full text-xl">
{#each sections as sec, i}
<li><div class=""> {sec} </div></li>
{/each}
{#each sections2 as sec, i}
<li><div class="" on:click={() => chooseSection(sec)}> {sec.name} </div></li>
{/each}
</ul>
</div>
</div>
<!-- Main content -->
<div class="flex-auto">Content</div>
</div>
|
