aboutsummaryrefslogtreecommitdiff
path: root/src/pages/projects.astro
diff options
context:
space:
mode:
authorAndrew Lee <alee14498@protonmail.com>2024-02-04 00:09:03 -0500
committerAndrew Lee <alee14498@protonmail.com>2024-02-04 00:12:44 -0500
commit27153476429c4a85630dedcf940a50089ea02151 (patch)
tree0ff21d13a79c5b73dad90caa9bbfe161cd132b07 /src/pages/projects.astro
parent4c84e203859be34da582f51371adc6eeb370b518 (diff)
downloadpersonal-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.astro42
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>