diff options
| author | Andrew Lee <alee14498@protonmail.com> | 2024-02-04 00:09:03 -0500 |
|---|---|---|
| committer | Andrew Lee <alee14498@protonmail.com> | 2024-02-04 00:12:44 -0500 |
| commit | 27153476429c4a85630dedcf940a50089ea02151 (patch) | |
| tree | 0ff21d13a79c5b73dad90caa9bbfe161cd132b07 /src/pages/projects.astro | |
| parent | 4c84e203859be34da582f51371adc6eeb370b518 (diff) | |
| download | personal-website-27153476429c4a85630dedcf940a50089ea02151.tar.gz personal-website-27153476429c4a85630dedcf940a50089ea02151.tar.bz2 personal-website-27153476429c4a85630dedcf940a50089ea02151.zip | |
Made card more consistent; Guestbook submits; Web analytics
Diffstat (limited to 'src/pages/projects.astro')
| -rw-r--r-- | src/pages/projects.astro | 42 |
1 files changed, 4 insertions, 38 deletions
diff --git a/src/pages/projects.astro b/src/pages/projects.astro index d609211..37cec1a 100644 --- a/src/pages/projects.astro +++ b/src/pages/projects.astro @@ -1,13 +1,14 @@ --- import Page from "../layouts/Page.astro"; import projects from "../data/projects.json"; +import "../styles/cards.css"; --- <Page title="Projects" description="Things that I have been working on in the past, and present"> - <main> + <main class="grid"> { projects.map((project) => { return ( - <div class="cards"> + <article class="card"> <h1>{project.name}</h1> <p>{project.description}</p> <div class="row"> @@ -17,51 +18,16 @@ import projects from "../data/projects.json"; ) })} </div> - </div> + </article> ) }) } </main> </Page> <style> - main { - display: grid; - grid-template-columns: repeat(2, 1fr); - } - - .cards { - display: flex; - flex-direction: column; - background-color: #3B513B; - padding: 1.2em; - border-radius: 20px; - gap: 0.5em; - margin: 0.5em; - } - - .cards h1 { - padding: 0; - margin: 0; - font-size: 1.8em; - } - - .cards p { - padding: 0; - margin: 0; - } - .row { - margin-top: 0.3em; display: flex; flex-direction: row; gap: 1em; } - - /* Mobile view */ - @media (max-width: 992px) { - main { - grid-template-columns: 1fr; - } - } - </style> |
