mirror of
https://github.com/Alee14/personal-website.git
synced 2025-01-22 10:51:50 -05:00
Blog changes; Homepage changes; Set locale to en-ca
This commit is contained in:
parent
f38935fe06
commit
ae20d39d4d
8 changed files with 82 additions and 69 deletions
6
.vscode/settings.json
vendored
6
.vscode/settings.json
vendored
|
@ -5,7 +5,11 @@
|
|||
"editor.wordWrap": "wordWrapColumn",
|
||||
"editor.wordWrapColumn": 64,
|
||||
"editor.lineNumbers": "off",
|
||||
"editor.quickSuggestions": false,
|
||||
"editor.quickSuggestions": {
|
||||
"comments": "off",
|
||||
"strings": "off",
|
||||
"other": "off"
|
||||
},
|
||||
"editor.minimap.enabled": false
|
||||
},
|
||||
"frontMatter.content.publicFolder": "public",
|
||||
|
|
|
@ -11,12 +11,12 @@ const date = new Date();
|
|||
---
|
||||
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<html lang="en-ca">
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<meta name="viewport" content="width=device-width" />
|
||||
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS Feed" href="/rss.xml" />
|
||||
<link rel="alternate" type="application/rss+xml" title="RSS Feed" href="/blog/rss.xml" />
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
|
||||
<link href="https://fonts.googleapis.com/css2?family=Exo+2:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap" rel="stylesheet">
|
||||
|
@ -29,7 +29,7 @@ const date = new Date();
|
|||
<!-- Open Graph Metadata -->
|
||||
<meta property="og:title" content={title} />
|
||||
<meta property="og:description" content={description} />
|
||||
<meta property="og:image" content="/profile.png" />
|
||||
<meta property="og:image" content="https://alee14.me/profile.png" />
|
||||
<meta property="og:type" content="website" />
|
||||
|
||||
<meta name="theme-color" content="#1B291F"/>
|
||||
|
|
|
@ -1,6 +1,7 @@
|
|||
---
|
||||
import Layout from './Default.astro';
|
||||
const { title, description } = Astro.props;
|
||||
import '../styles/Page.css';
|
||||
---
|
||||
|
||||
<Layout title=`${title} - Andrew Lee` description={description}>
|
||||
|
@ -12,36 +13,3 @@ const { title, description } = Astro.props;
|
|||
<slot />
|
||||
</div>
|
||||
</Layout>
|
||||
|
||||
<style>
|
||||
header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5em;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
padding: 0 0 1em;
|
||||
}
|
||||
|
||||
.header-text {
|
||||
font-size: 2em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h2.header-text {
|
||||
font-size: 1.5em;
|
||||
font-weight: 300;
|
||||
}
|
||||
.container {
|
||||
margin: 1em 10em 1em 10em;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.container {
|
||||
margin: 10px 20px 10px 20px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
</style>
|
||||
|
|
|
@ -1,33 +1,40 @@
|
|||
---
|
||||
import Page from "../../layouts/Page.astro";
|
||||
import Page from "../../layouts/Default.astro";
|
||||
import { getCollection } from "astro:content";
|
||||
import {formatDate} from "../../util";
|
||||
import '../../styles/Page.css';
|
||||
import "../../styles/cards.css";
|
||||
import {Icon} from "astro-icon/components";
|
||||
|
||||
const allBlogPosts = (await getCollection('blog')).sort((a, b) => b.data.pubDate.valueOf() - a.data.pubDate.valueOf());
|
||||
---
|
||||
<Page title="Blog" description="Where I post can be anything!">
|
||||
<Page title="Blog - Andrew Lee" description="Where I post can be anything!">
|
||||
<main>
|
||||
<div class="header">
|
||||
<a href="/blog/rss.xml">
|
||||
<Icon name="fa6-solid:square-rss" aria-label="RSS" />
|
||||
</a>
|
||||
</div>
|
||||
<div class="grid">
|
||||
{allBlogPosts.map((post) => (
|
||||
<article class="card">
|
||||
<h1><a href={`/blog/${post.slug}`}>{post.data.title}</a></h1>
|
||||
<small>{formatDate(post.data.pubDate)}</small>
|
||||
<p>{post.data.description}</p>
|
||||
<div class="tags">
|
||||
{post.data.tags.map((tag) => (
|
||||
<a href={`/blog/tags/${tag}`}>{tag}</a>
|
||||
))}
|
||||
</div>
|
||||
</article>
|
||||
))
|
||||
}
|
||||
<header>
|
||||
<h1 class="header-text">
|
||||
Blog
|
||||
<a href="/blog/rss.xml">
|
||||
<Icon name="fa6-solid:square-rss" aria-label="RSS" />
|
||||
</a>
|
||||
</h1>
|
||||
<h2 class="header-text">Where I post can be anything!</h2>
|
||||
</header>
|
||||
<div class="container">
|
||||
<div class="grid">
|
||||
{allBlogPosts.map((post) => (
|
||||
<article class="card">
|
||||
<h1><a href={`/blog/${post.slug}`}>{post.data.title}</a></h1>
|
||||
<small>{formatDate(post.data.pubDate)}</small>
|
||||
<p>{post.data.description}</p>
|
||||
<div class="tags">
|
||||
{post.data.tags.map((tag) => (
|
||||
<a href={`/blog/tags/${tag}`}>{tag}</a>
|
||||
))}
|
||||
</div>
|
||||
</article>
|
||||
))
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
</Page>
|
||||
|
@ -38,12 +45,4 @@ const allBlogPosts = (await getCollection('blog')).sort((a, b) => b.data.pubDate
|
|||
gap: 1em;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
gap: 0.5em;
|
||||
font-size: 3em;
|
||||
}
|
||||
</style>
|
||||
|
|
|
@ -25,7 +25,7 @@ export async function GET(context) {
|
|||
link: `/blog/${post.slug}/`,
|
||||
content: sanitizeHtml(parser.render(post.body)),
|
||||
// (optional) inject custom xml
|
||||
customData: `<language>en-us</language>`,
|
||||
customData: `<language>en-ca</language>`,
|
||||
})),
|
||||
});
|
||||
}
|
||||
|
|
|
@ -42,7 +42,18 @@ const allBlogPosts = (await getCollection('blog')).sort((a, b) => b.data.pubDate
|
|||
<div class="information">
|
||||
<div class="box">
|
||||
<h1>About me</h1>
|
||||
<p>I have been into computers since I was a kid, and it has been my passion for a long time. <br>Currently studying “Computing Support” (more preferably IT) at a vocational school.</p>
|
||||
<a href="/history" class="link">History</a>
|
||||
<p>Hey, I am Andrew Lee, a 19 year old who has a passion with computers.
|
||||
I am currently a student at a vocational school in Pearson Electrotechnology Centre.
|
||||
For years, I have been into programming, tinkering with virtual machines, and messing with Linux.</p>
|
||||
</div>
|
||||
<div class="box">
|
||||
<h1>Skills</h1>
|
||||
<ul>
|
||||
<li>Linux</li>
|
||||
<li>Graphic Design</li>
|
||||
<li>Web Development</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="box">
|
||||
<h1>Computer Specs</h1>
|
||||
|
|
27
src/styles/Page.css
Normal file
27
src/styles/Page.css
Normal file
|
@ -0,0 +1,27 @@
|
|||
header {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 0.5em;
|
||||
margin: 0;
|
||||
text-align: center;
|
||||
padding: 0 0 1em;
|
||||
}
|
||||
|
||||
.header-text {
|
||||
font-size: 2em;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
h2.header-text {
|
||||
font-size: 1.5em;
|
||||
font-weight: 300;
|
||||
}
|
||||
.container {
|
||||
margin: 1em 10em 1em 10em;
|
||||
}
|
||||
|
||||
@media (max-width: 992px) {
|
||||
.container {
|
||||
margin: 10px 20px 10px 20px;
|
||||
}
|
||||
}
|
|
@ -55,13 +55,17 @@
|
|||
|
||||
.latest-posts {
|
||||
grid-column: 2;
|
||||
grid-row: 1 / span 2;
|
||||
grid-row: 1 / span 3;
|
||||
}
|
||||
|
||||
.blog-title {
|
||||
margin-bottom: 2px;
|
||||
}
|
||||
|
||||
.link {
|
||||
font-size: 1.2em;
|
||||
}
|
||||
|
||||
/* Mobile view */
|
||||
@media (max-width: 992px) {
|
||||
.social {
|
||||
|
|
Loading…
Reference in a new issue