Working on new layout. Tailwindcss added and daisyui for theme.
Some checks failed
continuous-integration/drone/push Build is failing
Some checks failed
continuous-integration/drone/push Build is failing
This commit is contained in:
parent
280ec6d153
commit
5d9a07f6a7
125
.gitignore
vendored
125
.gitignore
vendored
@ -1,119 +1,20 @@
|
|||||||
# ---> Node
|
# build output
|
||||||
# Logs
|
dist/
|
||||||
logs
|
.output/
|
||||||
*.log
|
|
||||||
|
# dependencies
|
||||||
|
node_modules/
|
||||||
|
|
||||||
|
# logs
|
||||||
npm-debug.log*
|
npm-debug.log*
|
||||||
yarn-debug.log*
|
yarn-debug.log*
|
||||||
yarn-error.log*
|
yarn-error.log*
|
||||||
lerna-debug.log*
|
pnpm-debug.log*
|
||||||
|
|
||||||
# Diagnostic reports (https://nodejs.org/api/report.html)
|
|
||||||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json
|
|
||||||
|
|
||||||
# Runtime data
|
# environment variables
|
||||||
pids
|
|
||||||
*.pid
|
|
||||||
*.seed
|
|
||||||
*.pid.lock
|
|
||||||
|
|
||||||
# Directory for instrumented libs generated by jscoverage/JSCover
|
|
||||||
lib-cov
|
|
||||||
|
|
||||||
# Coverage directory used by tools like istanbul
|
|
||||||
coverage
|
|
||||||
*.lcov
|
|
||||||
|
|
||||||
# nyc test coverage
|
|
||||||
.nyc_output
|
|
||||||
|
|
||||||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files)
|
|
||||||
.grunt
|
|
||||||
|
|
||||||
# Bower dependency directory (https://bower.io/)
|
|
||||||
bower_components
|
|
||||||
|
|
||||||
# node-waf configuration
|
|
||||||
.lock-wscript
|
|
||||||
|
|
||||||
# Compiled binary addons (https://nodejs.org/api/addons.html)
|
|
||||||
build/Release
|
|
||||||
|
|
||||||
# Dependency directories
|
|
||||||
node_modules/
|
|
||||||
jspm_packages/
|
|
||||||
|
|
||||||
# Snowpack dependency directory (https://snowpack.dev/)
|
|
||||||
web_modules/
|
|
||||||
|
|
||||||
# TypeScript cache
|
|
||||||
*.tsbuildinfo
|
|
||||||
|
|
||||||
# Optional npm cache directory
|
|
||||||
.npm
|
|
||||||
|
|
||||||
# Optional eslint cache
|
|
||||||
.eslintcache
|
|
||||||
|
|
||||||
# Microbundle cache
|
|
||||||
.rpt2_cache/
|
|
||||||
.rts2_cache_cjs/
|
|
||||||
.rts2_cache_es/
|
|
||||||
.rts2_cache_umd/
|
|
||||||
|
|
||||||
# Optional REPL history
|
|
||||||
.node_repl_history
|
|
||||||
|
|
||||||
# Output of 'npm pack'
|
|
||||||
*.tgz
|
|
||||||
|
|
||||||
# Yarn Integrity file
|
|
||||||
.yarn-integrity
|
|
||||||
|
|
||||||
# dotenv environment variables file
|
|
||||||
.env
|
.env
|
||||||
.env.test
|
.env.production
|
||||||
|
|
||||||
# parcel-bundler cache (https://parceljs.org/)
|
# macOS-specific files
|
||||||
.cache
|
.DS_Store
|
||||||
.parcel-cache
|
|
||||||
|
|
||||||
# Next.js build output
|
|
||||||
.next
|
|
||||||
out
|
|
||||||
|
|
||||||
# Nuxt.js build / generate output
|
|
||||||
.nuxt
|
|
||||||
dist
|
|
||||||
|
|
||||||
# Gatsby files
|
|
||||||
.cache/
|
|
||||||
# Comment in the public line in if your project uses Gatsby and not Next.js
|
|
||||||
# https://nextjs.org/blog/next-9-1#public-directory-support
|
|
||||||
# public
|
|
||||||
|
|
||||||
# vuepress build output
|
|
||||||
.vuepress/dist
|
|
||||||
|
|
||||||
# Serverless directories
|
|
||||||
.serverless/
|
|
||||||
|
|
||||||
# FuseBox cache
|
|
||||||
.fusebox/
|
|
||||||
|
|
||||||
# DynamoDB Local files
|
|
||||||
.dynamodb/
|
|
||||||
|
|
||||||
# TernJS port file
|
|
||||||
.tern-port
|
|
||||||
|
|
||||||
# Stores VSCode versions used for testing VSCode extensions
|
|
||||||
.vscode-test
|
|
||||||
|
|
||||||
# yarn v2
|
|
||||||
.yarn/cache
|
|
||||||
.yarn/unplugged
|
|
||||||
.yarn/build-state.yml
|
|
||||||
.yarn/install-state.gz
|
|
||||||
.pnp.*
|
|
||||||
|
|
||||||
package-lock.json
|
|
||||||
|
|||||||
4
.vscode/extensions.json
vendored
Normal file
4
.vscode/extensions.json
vendored
Normal file
@ -0,0 +1,4 @@
|
|||||||
|
{
|
||||||
|
"recommendations": ["astro-build.astro-vscode"],
|
||||||
|
"unwantedRecommendations": []
|
||||||
|
}
|
||||||
11
.vscode/launch.json
vendored
Normal file
11
.vscode/launch.json
vendored
Normal file
@ -0,0 +1,11 @@
|
|||||||
|
{
|
||||||
|
"version": "0.2.0",
|
||||||
|
"configurations": [
|
||||||
|
{
|
||||||
|
"command": "./node_modules/.bin/astro dev",
|
||||||
|
"name": "Development server",
|
||||||
|
"request": "launch",
|
||||||
|
"type": "node-terminal"
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
51
README.md
51
README.md
@ -1,3 +1,50 @@
|
|||||||
# Personal-Site
|
# Welcome to [Astro](https://astro.build)
|
||||||
|
|
||||||
Repo for my personal website. Updates to README on the way.
|
[](https://stackblitz.com/github/withastro/astro/tree/latest/examples/basics)
|
||||||
|
[](https://codesandbox.io/s/github/withastro/astro/tree/latest/examples/basics)
|
||||||
|
|
||||||
|
> 🧑🚀 **Seasoned astronaut?** Delete this file. Have fun!
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
## 🚀 Project Structure
|
||||||
|
|
||||||
|
Inside of your Astro project, you'll see the following folders and files:
|
||||||
|
|
||||||
|
```
|
||||||
|
/
|
||||||
|
├── public/
|
||||||
|
│ └── favicon.svg
|
||||||
|
├── src/
|
||||||
|
│ ├── components/
|
||||||
|
│ │ └── Card.astro
|
||||||
|
│ ├── layouts/
|
||||||
|
│ │ └── Layout.astro
|
||||||
|
│ └── pages/
|
||||||
|
│ └── index.astro
|
||||||
|
└── package.json
|
||||||
|
```
|
||||||
|
|
||||||
|
Astro looks for `.astro` or `.md` files in the `src/pages/` directory. Each page is exposed as a route based on its file name.
|
||||||
|
|
||||||
|
There's nothing special about `src/components/`, but that's where we like to put any Astro/React/Vue/Svelte/Preact components.
|
||||||
|
|
||||||
|
Any static assets, like images, can be placed in the `public/` directory.
|
||||||
|
|
||||||
|
## 🧞 Commands
|
||||||
|
|
||||||
|
All commands are run from the root of the project, from a terminal:
|
||||||
|
|
||||||
|
| Command | Action |
|
||||||
|
| :--------------------- | :------------------------------------------------- |
|
||||||
|
| `npm install` | Installs dependencies |
|
||||||
|
| `npm run dev` | Starts local dev server at `localhost:3000` |
|
||||||
|
| `npm run build` | Build your production site to `./dist/` |
|
||||||
|
| `npm run preview` | Preview your build locally, before deploying |
|
||||||
|
| `npm run astro ...` | Run CLI commands like `astro add`, `astro preview` |
|
||||||
|
| `npm run astro --help` | Get help using the Astro CLI |
|
||||||
|
|
||||||
|
## 👀 Want to learn more?
|
||||||
|
|
||||||
|
Feel free to check [our documentation](https://docs.astro.build) or jump into our [Discord server](https://astro.build/chat).
|
||||||
|
|||||||
@ -1,9 +1,12 @@
|
|||||||
import { defineConfig } from 'astro/config'
|
import { defineConfig } from 'astro/config';
|
||||||
import svelte from '@astrojs/svelte';
|
|
||||||
|
|
||||||
|
// https://astro.build/config
|
||||||
|
import tailwind from "@astrojs/tailwind";
|
||||||
|
|
||||||
|
// https://astro.build/config
|
||||||
|
import svelte from "@astrojs/svelte";
|
||||||
|
|
||||||
|
// https://astro.build/config
|
||||||
export default defineConfig({
|
export default defineConfig({
|
||||||
integrations: [
|
integrations: [tailwind(), svelte()]
|
||||||
svelte(),
|
});
|
||||||
],
|
|
||||||
|
|
||||||
});
|
|
||||||
10927
package-lock.json
generated
Normal file
10927
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
42
package.json
42
package.json
@ -1,34 +1,22 @@
|
|||||||
{
|
{
|
||||||
"name": "personal-site",
|
"name": "@example/basics",
|
||||||
"version": "1.0.0",
|
"type": "module",
|
||||||
"description": "Repo for my personal website",
|
"version": "0.0.1",
|
||||||
"main": "index.js",
|
"private": true,
|
||||||
"scripts": {
|
"scripts": {
|
||||||
"dev": "astro dev",
|
"dev": "astro dev",
|
||||||
"build": "astro build"
|
"start": "astro dev",
|
||||||
|
"build": "astro build",
|
||||||
|
"preview": "astro preview",
|
||||||
|
"astro": "astro"
|
||||||
},
|
},
|
||||||
"repository": {
|
|
||||||
"type": "git",
|
|
||||||
"url": "https://git.thomaspcole.com/thomascole/Personal-Site.git"
|
|
||||||
},
|
|
||||||
"keywords": [],
|
|
||||||
"author": "",
|
|
||||||
"license": "MIT",
|
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@astrojs/renderer-svelte": "^0.1.1",
|
"@astrojs/svelte": "^1.0.2",
|
||||||
"@astrojs/svelte": "^0.1.4",
|
"@astrojs/tailwind": "^2.1.3",
|
||||||
"@fortawesome/fontawesome-free": "^5.15.3",
|
"astro": "^1.6.15",
|
||||||
"@mdi/font": "^5.9.55",
|
"daisyui": "^2.45.0",
|
||||||
"@mdi/js": "^5.9.55",
|
"svelte": "^3.55.0",
|
||||||
"astro": "^1.0.0-beta.38",
|
"tailwindcss": "^3.2.4",
|
||||||
"bootstrap-icons": "^1.5.0",
|
"theme-change": "^2.2.0"
|
||||||
"bulma": "^0.9.3",
|
|
||||||
"bulmaswatch": "^0.8.1",
|
|
||||||
"sass": "1.52.1"
|
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@astrojs/renderer-react": "^0.1.5",
|
|
||||||
"react": "^17.0.2",
|
|
||||||
"react-dom": "^17.0.2"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
13
public/favicon.svg
Normal file
13
public/favicon.svg
Normal file
@ -0,0 +1,13 @@
|
|||||||
|
<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 36 36">
|
||||||
|
<path fill="#000" d="M22.25 4h-8.5a1 1 0 0 0-.96.73l-5.54 19.4a.5.5 0 0 0 .62.62l5.05-1.44a2 2 0 0 0 1.38-1.4l3.22-11.66a.5.5 0 0 1 .96 0l3.22 11.67a2 2 0 0 0 1.38 1.39l5.05 1.44a.5.5 0 0 0 .62-.62l-5.54-19.4a1 1 0 0 0-.96-.73Z"/>
|
||||||
|
<path fill="url(#gradient)" d="M18 28a7.63 7.63 0 0 1-5-2c-1.4 2.1-.35 4.35.6 5.55.14.17.41.07.47-.15.44-1.8 2.93-1.22 2.93.6 0 2.28.87 3.4 1.72 3.81.34.16.59-.2.49-.56-.31-1.05-.29-2.46 1.29-3.25 3-1.5 3.17-4.83 2.5-6-.67.67-2.6 2-5 2Z"/>
|
||||||
|
<defs>
|
||||||
|
<linearGradient id="gradient" x1="16" x2="16" y1="32" y2="24" gradientUnits="userSpaceOnUse">
|
||||||
|
<stop stop-color="#000"/>
|
||||||
|
<stop offset="1" stop-color="#000" stop-opacity="0"/>
|
||||||
|
</linearGradient>
|
||||||
|
</defs>
|
||||||
|
<style>
|
||||||
|
@media (prefers-color-scheme:dark){:root{filter:invert(100%)}}
|
||||||
|
</style>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 873 B |
Binary file not shown.
|
Before Width: | Height: | Size: 37 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 38 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 176 KiB |
5
public/js/fa-all.min.js
vendored
5
public/js/fa-all.min.js
vendored
File diff suppressed because one or more lines are too long
9
public/js/particles.min.js
vendored
9
public/js/particles.min.js
vendored
File diff suppressed because one or more lines are too long
@ -1,102 +0,0 @@
|
|||||||
{
|
|
||||||
"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
|
|
||||||
}
|
|
||||||
@ -1,2 +0,0 @@
|
|||||||
User-agent: *
|
|
||||||
Disallow: /
|
|
||||||
@ -1,8 +0,0 @@
|
|||||||
* {
|
|
||||||
box-sizing: border-box;
|
|
||||||
margin: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
:root {
|
|
||||||
font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
|
|
||||||
}
|
|
||||||
5
src/components/Divider.astro
Normal file
5
src/components/Divider.astro
Normal file
@ -0,0 +1,5 @@
|
|||||||
|
---
|
||||||
|
|
||||||
|
---
|
||||||
|
|
||||||
|
<div class="w-full h-0.5 bg-base-100 rounded"></div>
|
||||||
@ -1,20 +0,0 @@
|
|||||||
<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 © 2022 Thomas Cole. All source code is licensed
|
|
||||||
<a href="http://opensource.org/licenses/mit-license.php">MIT</a>.
|
|
||||||
</p>
|
|
||||||
</div>
|
|
||||||
</footer>
|
|
||||||
@ -1,46 +0,0 @@
|
|||||||
---
|
|
||||||
|
|
||||||
---
|
|
||||||
|
|
||||||
<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;
|
|
||||||
text-align: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.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>
|
|
||||||
@ -1,85 +1,40 @@
|
|||||||
<style lang="scss">
|
---
|
||||||
@import 'bulmaswatch/darkly/_variables.scss';
|
import Divider from "./Divider.astro";
|
||||||
@import 'bulma/bulma.sass';
|
---
|
||||||
@import 'bulmaswatch/darkly/_overrides.scss';
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<nav class="navbar is-transparent" role="navigation" aria-label="main navigation">
|
<div class="fixed top-0 left-0 w-72 h-screen p-4 flex flex-col bg-base-200">
|
||||||
<div class="navbar-brand">
|
|
||||||
<span class="navbar-item brand-text">
|
<a href="/">
|
||||||
thomaspcole.com
|
<div class="transition ease-in-out w-1/2 hover:scale-105 block mx-auto mt-3 mb-6">
|
||||||
</span>
|
<img class="rounded-full aspect-square object-cover" src="/img/profile.jpg" alt="">
|
||||||
|
</div>
|
||||||
<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>
|
</a>
|
||||||
</div>
|
|
||||||
|
|
||||||
<div id="navbarBasicExample" class="navbar-menu">
|
<p class="text-2xl">Thomas Cole</p>
|
||||||
<div class="navbar-start">
|
<p>Some flavor text</p>
|
||||||
<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">
|
<Divider/>
|
||||||
<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">
|
<ul>
|
||||||
<span class="icon-text">
|
<li class="flex">
|
||||||
<span class="icon">
|
<a href="/" class="w-full hover:bg-base-100 rounded transation ease-in-out duration-300">
|
||||||
<i class="fas fa-user"></i>
|
<button class="p-2">Home</button>
|
||||||
</span>
|
</a>
|
||||||
<span>About</span>
|
</li>
|
||||||
</span>
|
<li class="flex">
|
||||||
</a>
|
<a href="/" class="w-full hover:bg-base-100 rounded transation ease-in-out duration-300">
|
||||||
|
<button class="p-2">Projects</button>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
<li class="flex">
|
||||||
|
<a href="/" class="w-full hover:bg-base-100 rounded transation ease-in-out duration-300">
|
||||||
|
<button class="p-2">Home</button>
|
||||||
|
</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
|
||||||
<a class="navbar-item" href="https://github.com/thomaspcole">
|
<button data-set-theme="corprate">Light</button>
|
||||||
<span class="icon-text">
|
<button data-set-theme="business">Dark</button>
|
||||||
<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>
|
|
||||||
|
|
||||||
|
</div>
|
||||||
@ -1,19 +0,0 @@
|
|||||||
<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 is:inline src="/js/particles.min.js"/>
|
|
||||||
<div id="pjs"></div>
|
|
||||||
<script>
|
|
||||||
particlesJS.load('pjs', '/particlesjs-config.json');
|
|
||||||
</script>
|
|
||||||
@ -1,20 +0,0 @@
|
|||||||
<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>
|
|
||||||
|
|
||||||
|
|
||||||
@ -1,56 +0,0 @@
|
|||||||
---
|
|
||||||
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>
|
|
||||||
1
src/env.d.ts
vendored
Normal file
1
src/env.d.ts
vendored
Normal file
@ -0,0 +1 @@
|
|||||||
|
/// <reference types="astro/client" />
|
||||||
@ -1,50 +0,0 @@
|
|||||||
---
|
|
||||||
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 is:inline src="/js/fa-all.min.js"/>
|
|
||||||
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
<Particle/>
|
|
||||||
<Nav/>
|
|
||||||
<main class="main">
|
|
||||||
<slot/>
|
|
||||||
</main>
|
|
||||||
<Footer/>
|
|
||||||
</body>
|
|
||||||
</html>
|
|
||||||
57
src/layouts/Layout.astro
Normal file
57
src/layouts/Layout.astro
Normal file
@ -0,0 +1,57 @@
|
|||||||
|
---
|
||||||
|
export interface Props {
|
||||||
|
title: string;
|
||||||
|
}
|
||||||
|
|
||||||
|
import Nav from '../components/Nav.astro'
|
||||||
|
|
||||||
|
const { title } = Astro.props;
|
||||||
|
---
|
||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width" />
|
||||||
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
||||||
|
<meta name="generator" content={Astro.generator} />
|
||||||
|
<title>{title}</title>
|
||||||
|
|
||||||
|
<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=Open+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;1,300;1,400;1,500;1,600;1,700;1,800&display=swap"
|
||||||
|
rel="stylesheet">
|
||||||
|
<link rel="stylesheet"
|
||||||
|
href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
|
||||||
|
<style>
|
||||||
|
.material-symbols-outlined {
|
||||||
|
font-variation-settings:
|
||||||
|
'FILL' 0,
|
||||||
|
'wght' 400,
|
||||||
|
'GRAD' 0,
|
||||||
|
'opsz' 48
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<script is:inline>
|
||||||
|
if (localStorage.getItem("theme") === null) {
|
||||||
|
document.documentElement.setAttribute("data-theme", "corprate");
|
||||||
|
} else {
|
||||||
|
document.documentElement.setAttribute("data-theme", localStorage.getItem("theme"));
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<script>
|
||||||
|
import { themeChange } from 'theme-change';
|
||||||
|
themeChange();
|
||||||
|
</script>
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body class="">
|
||||||
|
<Nav />
|
||||||
|
<div class="ml-72">
|
||||||
|
<slot />
|
||||||
|
</div>
|
||||||
|
</body>
|
||||||
|
|
||||||
|
</html>
|
||||||
@ -1,74 +0,0 @@
|
|||||||
---
|
|
||||||
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 is:inline 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>
|
|
||||||
@ -1,112 +0,0 @@
|
|||||||
---
|
|
||||||
import BaseLayout from '../layouts/BaseLayout.astro';
|
|
||||||
import { Markdown } from 'astro/components';
|
|
||||||
|
|
||||||
const resumeLink = 'https://git.thomaspcole.com/thomascole/Resume-MD/raw/branch/master/src/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;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cert-seal{
|
|
||||||
width: auto;
|
|
||||||
height: 200px;
|
|
||||||
padding: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
.cert-grid{
|
|
||||||
display: flex;
|
|
||||||
place-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
// Hack to adjust some of the markdown content
|
|
||||||
#thomaspatrickcolegmailcom--704-771-2453{
|
|
||||||
font-size: 1em;
|
|
||||||
}
|
|
||||||
|
|
||||||
#work-experience{
|
|
||||||
margin-top: 8px;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 1024px) {
|
|
||||||
.md-container{
|
|
||||||
width: 95%;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<div class="content">
|
|
||||||
<div class="md-container">
|
|
||||||
<!-- 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>
|
|
||||||
|
|
||||||
<br>
|
|
||||||
|
|
||||||
<div class="card">
|
|
||||||
<header class="card-header">
|
|
||||||
<h2 class="card-header-title no-margin">
|
|
||||||
Certifications
|
|
||||||
</h2>
|
|
||||||
</header>
|
|
||||||
<div class="cert-grid">
|
|
||||||
<img class="cert-seal" src="/img/dante_certified_logo_level1.png" alt="dante_cert_level3.png">
|
|
||||||
<img class="cert-seal" src="/img/dante_certified_logo_level2.png" alt="dante_cert_level3.png">
|
|
||||||
<img class="cert-seal" src="/img/dante_certified_seal_level3.png" alt="dante_cert_level3.png">
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</BaseLayout>
|
|
||||||
@ -1,9 +1,9 @@
|
|||||||
---
|
---
|
||||||
import BaseLayout from '../layouts/BaseLayout.astro';
|
import Layout from '../layouts/Layout.astro';
|
||||||
import IndexSplash from '../components/IndexSplash.astro';
|
|
||||||
---
|
---
|
||||||
|
|
||||||
<BaseLayout title="thomaspcole.com">
|
<Layout title="Thomas Cole">
|
||||||
<IndexSplash/>
|
<main class="flex flex-col m-4">
|
||||||
</BaseLayout>
|
<p class="text-white">Hello world</p>
|
||||||
|
</main>
|
||||||
|
</Layout>
|
||||||
|
|||||||
@ -1,9 +0,0 @@
|
|||||||
---
|
|
||||||
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
|
|
||||||
@ -1,27 +0,0 @@
|
|||||||
---
|
|
||||||
import BaseLayout from '../layouts/BaseLayout.astro';
|
|
||||||
import ProjectPostPreview from '../components/ProjectPostPreview.astro';
|
|
||||||
|
|
||||||
let allPosts = await Astro.glob('./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>
|
|
||||||
18
tailwind.config.cjs
Normal file
18
tailwind.config.cjs
Normal file
@ -0,0 +1,18 @@
|
|||||||
|
/** @type {import('tailwindcss').Config} */
|
||||||
|
module.exports = {
|
||||||
|
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
|
||||||
|
darkMode: ["class", "[data-theme]=business"],
|
||||||
|
theme: {
|
||||||
|
fontFamily: {
|
||||||
|
'sans': ['Open Sans', 'ui-sans-serif, system-ui', '-apple-system', 'BlinkMacSystemFont', "Segoe UI", 'Roboto', "Helvetica Neue", 'Arial', "Noto Sans", 'sans-serif', "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"],
|
||||||
|
'serif': ['ui-serif', 'Georgia', 'Cambria', "Times New Roman", 'Times', 'serif'],
|
||||||
|
'mono': ['ui-monospace', 'SFMono-Regular', 'Menlo', 'Monaco', 'Consolas', "Liberation Mono", "Courier New", 'monospace'],
|
||||||
|
'code': [],
|
||||||
|
},
|
||||||
|
extend: {},
|
||||||
|
},
|
||||||
|
plugins: [require("daisyui"), require("@tailwindcss/typography")],
|
||||||
|
daisyui: {
|
||||||
|
themes: ["corporate", "business"],
|
||||||
|
},
|
||||||
|
}
|
||||||
3
tsconfig.json
Normal file
3
tsconfig.json
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
{
|
||||||
|
"extends": "astro/tsconfigs/strict"
|
||||||
|
}
|
||||||
Loading…
Reference in New Issue
Block a user