diff options
Diffstat (limited to 'src/routes/projects')
| -rw-r--r-- | src/routes/projects/+page.svelte | 35 |
1 files changed, 33 insertions, 2 deletions
diff --git a/src/routes/projects/+page.svelte b/src/routes/projects/+page.svelte index 5a074b6..8b64856 100644 --- a/src/routes/projects/+page.svelte +++ b/src/routes/projects/+page.svelte @@ -1,7 +1,38 @@ <script lang="ts"> + import '$lib/assets/css/projects.scss' + import { base } from "$app/paths" + import { projects } from '$lib/projects.json' + + type Project = { + iconLink: string, + link: string, + title: string, + description: string + } + + const projectsList: Project[] = projects </script> -<div class="home"> - ⮜ Take me back <a href={base + '/'}><b>home</b></a> +<svelte:head> + <title>Projects</title> +</svelte:head> + +<div class="spacer"> + <div class="home"> + Take me back <a href={base + '/'}><b>home</b></a> + </div> +</div> +<div class="project-container"> + {#each projectsList as {iconLink, link, title, description}} + <a href={link} target="_blank"> + <div class="project"> + <img src={iconLink} alt={title + ' icon'} class="project-icon"> + <div class="content"> + <h3>{title}</h3> + <p>{description}</p> + </div> + </div> + </a> + {/each} </div> |