First Commit
This commit is contained in:
parent
7d124fccbb
commit
15647ede43
17
astro.config.mjs
Normal file
17
astro.config.mjs
Normal file
@ -0,0 +1,17 @@
|
||||
export default {
|
||||
// projectRoot: '.', // Where to resolve all URLs relative to. Useful if you have a monorepo project.
|
||||
// pages: './src/pages', // Path to Astro components, pages, and data
|
||||
// dist: './dist', // When running `astro build`, path to final static output
|
||||
// public: './public', // A folder of static files Astro will copy to the root. Useful for favicons, images, and other files that don’t need processing.
|
||||
buildOptions: {
|
||||
// site: 'http://example.com', // Your public domain, e.g.: https://my-site.dev/. Used to generate sitemaps and canonical URLs.
|
||||
// sitemap: true, // Generate sitemap (set to "false" to disable)
|
||||
},
|
||||
devOptions: {
|
||||
// port: 3000, // The port to run the dev server on.
|
||||
},
|
||||
renderers: [
|
||||
'@astrojs/renderer-react',
|
||||
'@astrojs/renderer-svelte',
|
||||
],
|
||||
};
|
||||
4162
package-lock.json
generated
Normal file
4162
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
34
package.json
Normal file
34
package.json
Normal file
@ -0,0 +1,34 @@
|
||||
{
|
||||
"name": "personal-site",
|
||||
"version": "1.0.0",
|
||||
"description": "Repo for my personal website",
|
||||
"main": "index.js",
|
||||
"scripts": {
|
||||
"start": "astro dev",
|
||||
"build": "astro build"
|
||||
},
|
||||
"repository": {
|
||||
"type": "git",
|
||||
"url": "https://git.thomaspcole.com/thomascole/Personal-Site.git"
|
||||
},
|
||||
"keywords": [],
|
||||
"author": "",
|
||||
"license": "MIT",
|
||||
"dependencies": {
|
||||
"@astrojs/renderer-svelte": "^0.1.1",
|
||||
"@fortawesome/fontawesome-free": "^5.15.3",
|
||||
"@mdi/font": "^5.9.55",
|
||||
"@mdi/js": "^5.9.55",
|
||||
"astro": "^0.17.3",
|
||||
"bootstrap-icons": "^1.5.0",
|
||||
"bulma": "^0.9.3",
|
||||
"bulmaswatch": "^0.8.1",
|
||||
"mdb-ui-kit": "^3.9.0",
|
||||
"open-color": "^1.8.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@astrojs/renderer-react": "^0.1.5",
|
||||
"react": "^17.0.2",
|
||||
"react-dom": "^17.0.2"
|
||||
}
|
||||
}
|
||||
BIN
public/Resume.pdf
Normal file
BIN
public/Resume.pdf
Normal file
Binary file not shown.
BIN
public/img/profile.jpg
Normal file
BIN
public/img/profile.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 607 KiB |
5
public/js/fa-all.min.js
vendored
Normal file
5
public/js/fa-all.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
9
public/js/particles.min.js
vendored
Normal file
9
public/js/particles.min.js
vendored
Normal file
File diff suppressed because one or more lines are too long
102
public/particlesjs-config.json
Normal file
102
public/particlesjs-config.json
Normal file
@ -0,0 +1,102 @@
|
||||
{
|
||||
"particles": {
|
||||
"number": {
|
||||
"value": 80,
|
||||
"density": {
|
||||
"enable": true,
|
||||
"value_area": 800
|
||||
}
|
||||
},
|
||||
"color": {
|
||||
"value": "#ffffff"
|
||||
},
|
||||
"shape": {
|
||||
"type": "circle",
|
||||
"stroke": {
|
||||
"width": 0,
|
||||
"color": "#000000"
|
||||
}
|
||||
},
|
||||
"opacity": {
|
||||
"value": 0.5,
|
||||
"random": false,
|
||||
"anim": {
|
||||
"enable": false,
|
||||
"speed": 1,
|
||||
"opacity_min": 0.1,
|
||||
"sync": false
|
||||
}
|
||||
},
|
||||
"size": {
|
||||
"value": 3,
|
||||
"random": true,
|
||||
"anim": {
|
||||
"enable": false,
|
||||
"speed": 40,
|
||||
"size_min": 0.1,
|
||||
"sync": false
|
||||
}
|
||||
},
|
||||
"line_linked": {
|
||||
"enable": true,
|
||||
"distance": 150,
|
||||
"color": "#ffffff",
|
||||
"opacity": 0.4,
|
||||
"width": 1
|
||||
},
|
||||
"move": {
|
||||
"enable": true,
|
||||
"speed": 1,
|
||||
"direction": "none",
|
||||
"random": false,
|
||||
"straight": false,
|
||||
"out_mode": "out",
|
||||
"bounce": false,
|
||||
"attract": {
|
||||
"enable": false,
|
||||
"rotateX": 600,
|
||||
"rotateY": 1200
|
||||
}
|
||||
}
|
||||
},
|
||||
"interactivity": {
|
||||
"detect_on": "canvas",
|
||||
"events": {
|
||||
"onhover": {
|
||||
"enable": false,
|
||||
"mode": "repulse"
|
||||
},
|
||||
"onclick": {
|
||||
"enable": false,
|
||||
"mode": "push"
|
||||
},
|
||||
"resize": true
|
||||
},
|
||||
"modes": {
|
||||
"grab": {
|
||||
"distance": 400,
|
||||
"line_linked": {
|
||||
"opacity": 1
|
||||
}
|
||||
},
|
||||
"bubble": {
|
||||
"distance": 400,
|
||||
"size": 40,
|
||||
"duration": 2,
|
||||
"opacity": 8,
|
||||
"speed": 3
|
||||
},
|
||||
"repulse": {
|
||||
"distance": 200,
|
||||
"duration": 0.4
|
||||
},
|
||||
"push": {
|
||||
"particles_nb": 4
|
||||
},
|
||||
"remove": {
|
||||
"particles_nb": 2
|
||||
}
|
||||
}
|
||||
},
|
||||
"retina_detect": true
|
||||
}
|
||||
2
public/robot.txt
Normal file
2
public/robot.txt
Normal file
@ -0,0 +1,2 @@
|
||||
User-agent: *
|
||||
Disallow: /
|
||||
8
public/style/global.css
Normal file
8
public/style/global.css
Normal file
@ -0,0 +1,8 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
:root {
|
||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
||||
}
|
||||
20
src/components/Footer.astro
Normal file
20
src/components/Footer.astro
Normal file
@ -0,0 +1,20 @@
|
||||
<style lang="scss">
|
||||
@import 'bulmaswatch/darkly/_variables.scss';
|
||||
@import 'bulma/bulma.sass';
|
||||
@import 'bulmaswatch/darkly/_overrides.scss';
|
||||
|
||||
.footer{
|
||||
padding: 1em !important;
|
||||
max-height: 10vh;
|
||||
background-color: #00000000;
|
||||
font-size: .7em !important;
|
||||
}
|
||||
</style>
|
||||
|
||||
<footer class="footer">
|
||||
<div class="content has-text-centered">
|
||||
<p>Copyright © 2021 Thomas Cole. All source code is licensed
|
||||
<a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
|
||||
</p>
|
||||
</div>
|
||||
</footer>
|
||||
45
src/components/IndexSplash.astro
Normal file
45
src/components/IndexSplash.astro
Normal file
@ -0,0 +1,45 @@
|
||||
---
|
||||
|
||||
---
|
||||
|
||||
<style lang="scss">
|
||||
@import 'bulmaswatch/darkly/_variables.scss';
|
||||
@import 'bulma/bulma.sass';
|
||||
@import 'bulmaswatch/darkly/_overrides.scss';
|
||||
|
||||
.content{
|
||||
height: 80%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.hello{
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
}
|
||||
|
||||
.name-plate{
|
||||
margin: 0 !important;
|
||||
padding: 0 !important;
|
||||
font-weight: bold;
|
||||
font-size: 4em !important;
|
||||
}
|
||||
|
||||
.tag-line-element{
|
||||
margin-left: 4px;
|
||||
margin-right: 4px;
|
||||
font-size: 1.15em;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="content">
|
||||
<h2 class="hello">Hello, World.</h2>
|
||||
<h1 class="name-plate has-text-link">I'm Thomas Cole</h1>
|
||||
<div class="tag-line">
|
||||
<span class="tag-line-element">Developer,</span>
|
||||
<span class="tag-line-element">Linux Enthusiast,</span>
|
||||
<span class="tag-line-element">System Administrator</span>
|
||||
</div>
|
||||
</div>
|
||||
86
src/components/Nav.astro
Normal file
86
src/components/Nav.astro
Normal file
@ -0,0 +1,86 @@
|
||||
<style lang="scss">
|
||||
@import 'bulmaswatch/darkly/_variables.scss';
|
||||
@import 'bulma/bulma.sass';
|
||||
@import 'bulmaswatch/darkly/_overrides.scss';
|
||||
</style>
|
||||
|
||||
<nav class="navbar is-transparent" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-item brand-text">
|
||||
<!-- <img src="https://bulma.io/images/bulma-logo.png" width="112" height="28"> -->
|
||||
<span>thomaspcole.com</span>
|
||||
</a>
|
||||
|
||||
<a role="button" class="navbar-burger" aria-label="menu" aria-expanded="false" data-target="navbarBasicExample">
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
<span aria-hidden="true"></span>
|
||||
</a>
|
||||
</div>
|
||||
|
||||
<div id="navbarBasicExample" class="navbar-menu">
|
||||
<div class="navbar-start">
|
||||
<a class="navbar-item" href="/">
|
||||
<span class="icon-text">
|
||||
<span class="icon">
|
||||
<i class="fas fa-home"></i>
|
||||
</span>
|
||||
<span>Home</span>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<!-- <a class="navbar-item" href="/projects">
|
||||
<span class="icon-text">
|
||||
<span class="icon">
|
||||
<i class="fas fa-project-diagram"></i>
|
||||
</span>
|
||||
<span>Projects</span>
|
||||
</span>
|
||||
</a> -->
|
||||
|
||||
<a class="navbar-item" href="/about">
|
||||
<span class="icon-text">
|
||||
<span class="icon">
|
||||
<i class="fas fa-user"></i>
|
||||
</span>
|
||||
<span>About</span>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<a class="navbar-item" href="https://github.com/thomaspcole">
|
||||
<span class="icon-text">
|
||||
<span class="icon">
|
||||
<i class="fab fa-github"></i>
|
||||
</span>
|
||||
<span>Github</span>
|
||||
</span>
|
||||
</a>
|
||||
|
||||
<a class="navbar-item" href="https://git.thomaspcole.com/thomascole">
|
||||
<span class="icon-text">
|
||||
<span class="icon">
|
||||
<i class="fab fa-git-alt"></i>
|
||||
</span>
|
||||
<span>Gitea</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
|
||||
if ($navbarBurgers.length > 0) {
|
||||
$navbarBurgers.forEach( el => {
|
||||
el.addEventListener('click', () => {
|
||||
const target = el.dataset.target;
|
||||
const $target = document.getElementById(target);
|
||||
el.classList.toggle('is-active');
|
||||
$target.classList.toggle('is-active');
|
||||
});
|
||||
});
|
||||
}
|
||||
});
|
||||
</script>
|
||||
|
||||
19
src/components/Particle.astro
Normal file
19
src/components/Particle.astro
Normal file
@ -0,0 +1,19 @@
|
||||
<style lang="scss">
|
||||
#pjs{
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
z-index: -1;
|
||||
animation: fadein .5s;
|
||||
}
|
||||
|
||||
@keyframes fadein {
|
||||
from { opacity: 0; }
|
||||
to { opacity: 1; }
|
||||
}
|
||||
</style>
|
||||
<script src="/js/particles.min.js"/>
|
||||
<div id="pjs"></div>
|
||||
<script>
|
||||
particlesJS.load('pjs', '/particlesjs-config.json');
|
||||
</script>
|
||||
20
src/components/PostNav.astro
Normal file
20
src/components/PostNav.astro
Normal file
@ -0,0 +1,20 @@
|
||||
<style lang="scss">
|
||||
@import 'bulmaswatch/darkly/_variables.scss';
|
||||
@import 'bulma/bulma.sass';
|
||||
@import 'bulmaswatch/darkly/_overrides.scss';
|
||||
</style>
|
||||
|
||||
<nav class="navbar is-transparent" role="navigation" aria-label="main navigation">
|
||||
<div class="navbar-brand">
|
||||
<a class="navbar-item" href="/projects">
|
||||
<span class="icon-text">
|
||||
<span class="icon">
|
||||
<i class="fas fa-arrow-left"></i>
|
||||
</span>
|
||||
<span>Back</span>
|
||||
</span>
|
||||
</a>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
56
src/components/ProjectPostPreview.astro
Normal file
56
src/components/ProjectPostPreview.astro
Normal file
@ -0,0 +1,56 @@
|
||||
---
|
||||
export interface Props {
|
||||
post: any;
|
||||
}
|
||||
|
||||
const { post } = Astro.props;
|
||||
---
|
||||
|
||||
<style lang="scss">
|
||||
@import 'bulmaswatch/darkly/_variables.scss';
|
||||
@import 'bulma/bulma.sass';
|
||||
@import 'bulmaswatch/darkly/_overrides.scss';
|
||||
|
||||
.card{
|
||||
width: 300px !important;
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
.title {
|
||||
margin-bottom: .5em !important;
|
||||
}
|
||||
|
||||
.tagline{
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
|
||||
.posted-date{
|
||||
font-size: .75em;
|
||||
}
|
||||
|
||||
.post-img{
|
||||
margin: auto;
|
||||
padding-top: 1em;
|
||||
max-width: 280px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-image">
|
||||
<figure class="image">
|
||||
<img src={post.coverImage} alt="CoverImage" class="post-img">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h1 class="title has-text-link">{post.title}</h1>
|
||||
<div class="content">
|
||||
<p class="tagline">{post.description}</p>
|
||||
<a href={post.url}>Read More</a>
|
||||
<hr class="dropdown-divider">
|
||||
<span class="posted-date">Posted: {post.publishDate}</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
50
src/layouts/BaseLayout.astro
Normal file
50
src/layouts/BaseLayout.astro
Normal file
@ -0,0 +1,50 @@
|
||||
---
|
||||
import Nav from '../components/Nav.astro';
|
||||
import Particle from '../components/Particle.astro';
|
||||
import Footer from '../components/Footer.astro';
|
||||
|
||||
const {title} = Astro.props;
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{title}</title>
|
||||
<!-- <link rel="icon" type="image/svg+xml" href="/favicon.svg"> -->
|
||||
<link rel="stylesheet" href="/style/global.css">
|
||||
|
||||
<style lang="scss">
|
||||
@import 'bulmaswatch/darkly/_variables.scss';
|
||||
@import 'bulma/bulma.sass';
|
||||
@import 'bulmaswatch/darkly/_overrides.scss';
|
||||
|
||||
html{
|
||||
overflow: auto;
|
||||
}
|
||||
|
||||
body{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.main{
|
||||
flex: 1 1 auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- Sometimes some js is needed. Load font awesome -->
|
||||
<script src="/js/fa-all.min.js"/>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<Particle/>
|
||||
<Nav/>
|
||||
<main class="main">
|
||||
<slot/>
|
||||
</main>
|
||||
<Footer/>
|
||||
</body>
|
||||
</html>
|
||||
74
src/layouts/ProjectPost.astro
Normal file
74
src/layouts/ProjectPost.astro
Normal file
@ -0,0 +1,74 @@
|
||||
---
|
||||
import PostNav from '../components/PostNav.astro';
|
||||
import Particle from '../components/Particle.astro';
|
||||
import Footer from '../components/Footer.astro';
|
||||
|
||||
const { content } = Astro.props;
|
||||
const { title, description, publishDate} = content;
|
||||
---
|
||||
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<title>{title} - thomaspcole.com</title>
|
||||
<!-- <link rel="icon" type="image/svg+xml" href="/favicon.svg"> -->
|
||||
<link rel="stylesheet" href="/style/global.css">
|
||||
|
||||
<style lang="scss">
|
||||
@import 'bulmaswatch/darkly/_variables.scss';
|
||||
@import 'bulma/bulma.sass';
|
||||
@import 'bulmaswatch/darkly/_overrides.scss';
|
||||
|
||||
html{
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
body{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.main{
|
||||
flex: 1 1 auto;
|
||||
margin: 1em;
|
||||
}
|
||||
|
||||
.card {
|
||||
padding: 1em;
|
||||
}
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
place-content: space-between;
|
||||
}
|
||||
</style>
|
||||
|
||||
<!-- Sometimes some js is needed. Load font awesome -->
|
||||
<script src="/js/fa-all.min.js"/>
|
||||
|
||||
</head>
|
||||
<body>
|
||||
<Particle/>
|
||||
<PostNav/>
|
||||
<main class="main">
|
||||
<div class="card">
|
||||
<div class="header">
|
||||
<div>
|
||||
<h1 class="title">{title}</h1>
|
||||
<p class="subtitle">{description}</p>
|
||||
</div>
|
||||
|
||||
<span>{publishDate}</span>
|
||||
</div>
|
||||
|
||||
<hr class="dropdown-divider">
|
||||
|
||||
<slot/>
|
||||
</div>
|
||||
</main>
|
||||
<Footer/>
|
||||
</body>
|
||||
</html>
|
||||
100
src/pages/about.astro
Normal file
100
src/pages/about.astro
Normal file
@ -0,0 +1,100 @@
|
||||
---
|
||||
import BaseLayout from '../layouts/BaseLayout.astro';
|
||||
import { Markdown } from 'astro/components';
|
||||
|
||||
const resumeLink = 'https://git.thomaspcole.com/thomascole/Resume-MD/raw/branch/master/Resume.md';
|
||||
|
||||
const response = await fetch(resumeLink);
|
||||
const data = await response.text();
|
||||
---
|
||||
<BaseLayout title="About - thomaspcole.com">
|
||||
<style lang="scss">
|
||||
@import 'bulmaswatch/darkly/_variables.scss';
|
||||
@import 'bulma/bulma.sass';
|
||||
@import 'bulmaswatch/darkly/_overrides.scss';
|
||||
|
||||
html{
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
.bio-div {
|
||||
display: flex;
|
||||
min-height: 10em;
|
||||
}
|
||||
|
||||
.md-container{
|
||||
width: 80%;
|
||||
padding-top: 1em;
|
||||
padding-left: 2em;
|
||||
padding-right: 2em;
|
||||
margin-bottom: 2em;
|
||||
}
|
||||
|
||||
.content {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
|
||||
.no-margin{
|
||||
margin: 0 !important;
|
||||
}
|
||||
|
||||
.hidden{
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
@media (max-width: 1024px) {
|
||||
.md-container{
|
||||
width: 95%;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="content">
|
||||
<div class="md-container">
|
||||
<!-- BIO
|
||||
<div class="card">
|
||||
<header class="card-header">
|
||||
<h2 class="card-header-title no-margin">
|
||||
Who Am I?
|
||||
</h2>
|
||||
</header>
|
||||
|
||||
<div class="bio-div">
|
||||
<div class="card-image" style="align-self: end;">
|
||||
<figure class="image is-128x128" style="margin-right: 0;">
|
||||
<img style="border-radius: 0.4em !important;" src="/img/profile.jpg" alt="Profile Picture">
|
||||
</figure>
|
||||
</div>
|
||||
<div class="card-content">
|
||||
<h2>About Me</h2>
|
||||
<span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<br> -->
|
||||
|
||||
<!-- Resume -->
|
||||
<div class="card">
|
||||
<header class="card-header">
|
||||
<h2 class="card-header-title no-margin">
|
||||
Resume
|
||||
</h2>
|
||||
<a class="card-header-icon" download="ThomasCole-Resume.pdf" href="/Resume.pdf">
|
||||
<span class="icon-text">
|
||||
<span class="icon">
|
||||
<i class="fas fa-download" aria-hidden="true"></i>
|
||||
</span>
|
||||
<span>Download</span>
|
||||
</span>
|
||||
</a>
|
||||
</header>
|
||||
<div class="card-content">
|
||||
<Markdown content={data}/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</BaseLayout>
|
||||
9
src/pages/index.astro
Normal file
9
src/pages/index.astro
Normal file
@ -0,0 +1,9 @@
|
||||
---
|
||||
import BaseLayout from '../layouts/BaseLayout.astro';
|
||||
import IndexSplash from '../components/IndexSplash.astro';
|
||||
---
|
||||
|
||||
<BaseLayout title="thomaspcole.com">
|
||||
<IndexSplash/>
|
||||
</BaseLayout>
|
||||
|
||||
9
src/pages/posts/WelcomePost.md
Normal file
9
src/pages/posts/WelcomePost.md
Normal file
@ -0,0 +1,9 @@
|
||||
---
|
||||
title: "Astro.build: It's not Javascript"
|
||||
description: "The new and improved thomaspcole.com. Powered by Astro"
|
||||
publishDate: 'Friday, July 30 2021'
|
||||
layout: '../../layouts/ProjectPost.astro'
|
||||
coverImage: 'https://imgs.xkcd.com/comics/standards.png'
|
||||
---
|
||||
|
||||
# Header
|
||||
27
src/pages/projects.astro
Normal file
27
src/pages/projects.astro
Normal file
@ -0,0 +1,27 @@
|
||||
---
|
||||
import BaseLayout from '../layouts/BaseLayout.astro';
|
||||
import ProjectPostPreview from '../components/ProjectPostPreview.astro';
|
||||
|
||||
let allPosts = Astro.fetchContent('posts/*.md');
|
||||
allPosts.sort((a,b) => new Date(b.publishDate) - new Date(a.publishDate));
|
||||
|
||||
---
|
||||
|
||||
<BaseLayout title="Projects - thomaspcole.com">
|
||||
<style lang="scss">
|
||||
.project-div{
|
||||
width: 100%;
|
||||
display: grid;
|
||||
grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
|
||||
place-items: center;
|
||||
}
|
||||
|
||||
html{
|
||||
overflow: auto;
|
||||
}
|
||||
</style>
|
||||
|
||||
<div class="project-div">
|
||||
{allPosts.map(p => <ProjectPostPreview post={p}/>)}
|
||||
</div>
|
||||
</BaseLayout>
|
||||
Loading…
Reference in New Issue
Block a user