aboutsummaryrefslogtreecommitdiff
path: root/src
diff options
context:
space:
mode:
Diffstat (limited to 'src')
-rw-r--r--src/components/contacts.json40
-rw-r--r--src/layouts/Page.astro2
-rw-r--r--src/layouts/PageMarkdown.astro2
-rw-r--r--src/pages/contacts.astro22
-rw-r--r--src/pages/projects.astro49
-rw-r--r--src/styles/index.css13
6 files changed, 74 insertions, 54 deletions
diff --git a/src/components/contacts.json b/src/components/contacts.json
index 6763340..fbad4c0 100644
--- a/src/components/contacts.json
+++ b/src/components/contacts.json
@@ -1,29 +1,23 @@
[
{
- "platform": "GitHub",
- "icon": "github",
- "username": "Alee14",
- "url": "https://github.alee14.me"
- },
- {
"platform": "LinkedIn",
"icon": "linkedin",
"username": "AndrewLeeCAN",
"url": "https://linkedin.alee14.me"
},
{
+ "platform": "GitHub",
+ "icon": "github",
+ "username": "Alee14",
+ "url": "https://github.alee14.me"
+ },
+ {
"platform": "PayPal",
"icon": "paypal",
"username": "alee14498",
"url": "https://paypal.me/alee14498"
},
{
- "platform": "Discord",
- "icon": "discord",
- "username": "Andrew Lee Projects",
- "url": "https://discord.alee14.me"
- },
- {
"platform": "YouTube",
"icon": "youtube",
"username": "AndrewLeeCAN",
@@ -36,13 +30,6 @@
"url": "https://mstdn.ca/@alee"
},
{
- "platform": "X",
- "icon": "x-twitter",
- "username": "Alee14498",
- "url": "https://twitter.alee14.me",
- "mouseover": "yuck."
- },
- {
"platform": "Instagram",
"icon": "instagram",
"username": "alee14498",
@@ -53,5 +40,18 @@
"icon": "reddit",
"username": "alee1449",
"url": "https://reddit.alee14.me"
+ },
+ {
+ "platform": "Discord",
+ "icon": "discord",
+ "username": "Andrew Lee Projects",
+ "url": "https://discord.alee14.me"
+ },
+ {
+ "platform": "X",
+ "icon": "x-twitter",
+ "username": "Alee14498",
+ "url": "https://twitter.alee14.me",
+ "mouseover": "yuck."
}
-] \ No newline at end of file
+]
diff --git a/src/layouts/Page.astro b/src/layouts/Page.astro
index 667f7c3..51ebd6b 100644
--- a/src/layouts/Page.astro
+++ b/src/layouts/Page.astro
@@ -36,7 +36,7 @@ const { title, description } = Astro.props;
margin: 10px 10em 10px 10em;
}
- @media (max-width: 768px) {
+ @media (max-width: 992px) {
.container {
margin: 10px 20px 10px 20px;
}
diff --git a/src/layouts/PageMarkdown.astro b/src/layouts/PageMarkdown.astro
index 1da7491..4675a78 100644
--- a/src/layouts/PageMarkdown.astro
+++ b/src/layouts/PageMarkdown.astro
@@ -37,7 +37,7 @@ const { frontmatter } = Astro.props;
margin: 10px 10em 10px 10em;
}
- @media (max-width: 768px) {
+ @media (max-width: 992px) {
.container {
margin: 10px 20px 10px 20px;
}
diff --git a/src/pages/contacts.astro b/src/pages/contacts.astro
index 908fba8..5123bed 100644
--- a/src/pages/contacts.astro
+++ b/src/pages/contacts.astro
@@ -4,15 +4,17 @@ import { Icon } from 'astro-icon/components';
import contacts from "../components/contacts.json";
---
<Page title="Contacts" description="Follow me on other platforms">
- {contacts.map((contact)=> {
- let icon = "fa6-brands:" + contact.icon;
- return (
- <a href={contact.url} target="_blank" title={contact.mouseover}><div class="contacts-card">
- <Icon name={icon} class="contact-icon" />
- {contact.platform} ({contact.username})
- </div></a>
- )
- })}
+ <main>
+ {contacts.map((contact)=> {
+ let icon = "fa6-brands:" + contact.icon;
+ return (
+ <a href={contact.url} target="_blank" title={contact.mouseover}><div class="contacts-card">
+ <Icon name={icon} class="contact-icon" />
+ {contact.platform} ({contact.username})
+ </div></a>
+ )
+ })}
+ </main>
</Page>
<style>
.contacts-card {
@@ -29,4 +31,4 @@ import contacts from "../components/contacts.json";
margin-right: 0.5em;
font-size: 1.3em;
}
-</style> \ No newline at end of file
+</style>
diff --git a/src/pages/projects.astro b/src/pages/projects.astro
index b6da87a..70eeb08 100644
--- a/src/pages/projects.astro
+++ b/src/pages/projects.astro
@@ -3,31 +3,38 @@ import Page from "../layouts/Page.astro";
import projects from "../components/projects.json";
---
<Page title="Projects" description="Things that I have been working on in the past, and present">
- {
- projects.map((project) => {
- return (
- <div class="cards">
- <h1>{project.name}</h1>
- <p>{project.description}</p>
- {project.links.map((link) => {
- return (
- <a href={link.url}>{link.name}</a>
- )
- })}
- </div>
- )
- })
- }
+ <main>
+ {
+ projects.map((project) => {
+ return (
+ <div class="cards">
+ <h1>{project.name}</h1>
+ <p>{project.description}</p>
+ {project.links.map((link) => {
+ return (
+ <a href={link.url}>{link.name}</a>
+ )
+ })}
+ </div>
+ )
+ })
+ }
+ </main>
</Page>
<style>
+ main {
+ display: grid;
+ grid-template-columns: repeat(2, 1fr);
+ }
+
.cards {
display: flex;
flex-direction: column;
- gap: 1em;
background-color: #3B513B;
padding: 1.2em;
border-radius: 20px;
- margin: 1em;
+ gap: 0.5em;
+ margin: 0.5em;
}
.cards h1 {
@@ -43,7 +50,13 @@ import projects from "../components/projects.json";
.cards a {
text-align: right;
display: inline-block;
+ }
+ /* Mobile view */
+ @media (max-width: 992px) {
+ main {
+ grid-template-columns: 1fr;
+ }
}
-</style> \ No newline at end of file
+</style>
diff --git a/src/styles/index.css b/src/styles/index.css
index 8df217d..33f84ac 100644
--- a/src/styles/index.css
+++ b/src/styles/index.css
@@ -16,8 +16,8 @@ p {
font-size: 1.1em;
}
-.description {
- line-height: 0.4;
+.description h2 {
+ margin: 0.1em 0;
}
.social {
@@ -33,12 +33,16 @@ p {
font-size: 1.2em;
}
+.headline h3 {
+ margin: 0.5em;
+}
+
.information {
display: grid;
grid-template-columns: 1fr 0.7fr;
grid-template-rows: auto auto;
gap: 1em;
- padding: 30px;
+ margin: 2em 10em 2em 10em;
}
.box {
@@ -58,13 +62,14 @@ p {
}
/* Mobile view */
-@media (max-width: 768px) {
+@media (max-width: 992px) {
.social {
font-size: 2.6em;
gap: 1em;
}
.information {
+ margin: 2em;
grid: auto auto auto / 1fr;
}