diff options
| -rw-r--r-- | src/components/projects.json | 10 | ||||
| -rw-r--r-- | src/layouts/Page.astro | 1 | ||||
| -rw-r--r-- | src/pages/projects.astro | 30 |
3 files changed, 40 insertions, 1 deletions
diff --git a/src/components/projects.json b/src/components/projects.json index 95ddaab..1639297 100644 --- a/src/components/projects.json +++ b/src/components/projects.json @@ -18,5 +18,15 @@ "url": "https://github.com/Alee14/DLAP" } ] + }, + { + "name": "Snug Cup", + "description": "Snug Cup was a school project that I made with my classmates back in 2021.", + "links": [ + { + "name": "Website", + "url": "https://snug-cup.alee14.me" + } + ] } ] diff --git a/src/layouts/Page.astro b/src/layouts/Page.astro index b506628..91ef798 100644 --- a/src/layouts/Page.astro +++ b/src/layouts/Page.astro @@ -19,6 +19,7 @@ const { title, description } = Astro.props; margin: 0; padding: 0; text-align: center; + padding-bottom: 1em; } .header-text { diff --git a/src/pages/projects.astro b/src/pages/projects.astro index b381bf3..b6da87a 100644 --- a/src/pages/projects.astro +++ b/src/pages/projects.astro @@ -6,7 +6,7 @@ import projects from "../components/projects.json"; { projects.map((project) => { return ( - <div class="projects"> + <div class="cards"> <h1>{project.name}</h1> <p>{project.description}</p> {project.links.map((link) => { @@ -19,3 +19,31 @@ import projects from "../components/projects.json"; }) } </Page> +<style> + .cards { + display: flex; + flex-direction: column; + gap: 1em; + background-color: #3B513B; + padding: 1.2em; + border-radius: 20px; + margin: 1em; + } + + .cards h1 { + padding: 0; + margin: 0; + } + + .cards p { + padding: 0; + margin: 0; + } + + .cards a { + text-align: right; + display: inline-block; + + } + +</style>
\ No newline at end of file |