diff options
Diffstat (limited to 'src/components')
| -rw-r--r-- | src/components/Sidebar.svelte | 21 | ||||
| -rw-r--r-- | src/components/helpers/Icon.svelte | 5 |
2 files changed, 19 insertions, 7 deletions
diff --git a/src/components/Sidebar.svelte b/src/components/Sidebar.svelte index 39c005e..53f9f05 100644 --- a/src/components/Sidebar.svelte +++ b/src/components/Sidebar.svelte @@ -7,15 +7,15 @@ import TamuOutput from "./TamuOutput.svelte"; import { onMount } from "svelte"; import { parseDatabaseLocalStorage } from "../util/parser"; - + import Icon from "../components/helpers/Icon.svelte"; let sections = [ - { name: "File Uploads", component: FileUploads }, - { name: "Peer Teachers", component: PeerTeachers }, - { name: "Assign Labs", component: AssignLabs }, - { name: "Labs", component: Labs }, + { name: "File Uploads", component: FileUploads, icon: "checkmark" }, + { name: "Peer Teachers", component: PeerTeachers, icon: "checkmark" }, + { name: "Assign Labs", component: AssignLabs, icon: "checkmark" }, + { name: "Labs", component: Labs, icon: "checkmark" }, { name: "Active Peer Teachers", component: null }, // TODO { name: "Stats", component: null }, // TODO - { name: "TAMU HTML Output", component: TamuOutput }, + { name: "TAMU HTML Output", component: TamuOutput, icon: "checkmark" }, ]; let selected = sections[0]; @@ -30,6 +30,8 @@ console.log("No database found in local storage"); } }); + + $: console.log(selected.icon); </script> <!-- Entire Page --> @@ -62,7 +64,12 @@ selected = sec; }} > - {sec.name} + <div> + {sec.name} + </div> + <div> + <Icon name={sec.icon} /> + </div> </div> </li> {/each} diff --git a/src/components/helpers/Icon.svelte b/src/components/helpers/Icon.svelte index 75ee3f4..1d1a03e 100644 --- a/src/components/helpers/Icon.svelte +++ b/src/components/helpers/Icon.svelte @@ -32,6 +32,11 @@ box: 24, path: `<path stroke-linecap="round" stroke-linejoin="round" d="M8 5H6a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2v-1M8 5a2 2 0 002 2h2a2 2 0 002-2M8 5a2 2 0 012-2h2a2 2 0 012 2m0 0h2a2 2 0 012 2v3m2 4H10m0 0l3-3m-3 3l3 3" />`, }, + { + name: "checkmark", + box: 20, + path: `<path stroke-linecap="round" stroke-linejoin="round" d="M5 13l4 4L19 7" />`, + }, ]; let displayIcon = icons.find((e) => e.name === name); </script> |