Skip to content

Commit

Permalink
Styling updates
Browse files Browse the repository at this point in the history
  • Loading branch information
emgardner committed Sep 20, 2023
1 parent fa0454a commit d9aad29
Show file tree
Hide file tree
Showing 10 changed files with 3,723 additions and 3,573 deletions.
7,062 changes: 3,650 additions & 3,412 deletions package-lock.json

Large diffs are not rendered by default.

9 changes: 5 additions & 4 deletions package.json
Original file line number Diff line number Diff line change
Expand Up @@ -11,12 +11,13 @@
"astro": "astro"
},
"dependencies": {
"@astrojs/cloudflare": "^5.0.0",
"@astrojs/mdx": "^0.14.0",
"@astrojs/cloudflare": "^7.0.1",
"@astrojs/mdx": "^1.0.0",
"@astrojs/react": "^3.0.0",
"@astrojs/sitemap": "^1.0.0",
"@astrojs/tailwind": "^2.1.3",
"@astrojs/tailwind": "^5.0.0",
"@tailwindcss/typography": "^0.5.8",
"astro": "^1.9.1",
"astro": "^3.0.8",
"jsonresume-theme-caffeine": "^1.2.3",
"normalize.css": "^8.0.1",
"tailwindcss": "^3.2.4"
Expand Down
Empty file removed src/components/CaptionImage.astro
Empty file.
44 changes: 8 additions & 36 deletions src/components/Nav.astro
Original file line number Diff line number Diff line change
@@ -1,36 +1,8 @@
<nav>
<a href="/">POSTS</a>
<a href="/about">ABOUT</a>
<a href="/resume">RESUME</a>
<div class="bg-fixed bg-zinc-900"></div>
</nav>
<style>
nav {
position: relative;
display: flex;
width: 100%;
justify-content: center;
align-items: center;
margin-bottom: 12px;
}

a {
text-decoration: none;
color: white;
margin: 12px 20px;
}


a:hover {
color: #AAAAAA;
}
nav > div {
width: 100%;
height: 2px;
/*
background-color: #202020;
*/
position: absolute;
bottom: 0px;
}
</style>
<nav
class="flex relative w-full justify-center items-center pt-8 pb-4 mb-8"
>
<a class="text-white mx-4 hover:text-slate-200" href="/">Posts</a>
<a class="text-white mx-4 hover:text-slate-200" href="/about">About</a>
<a class="text-white mx-4 hover:text-slate-200" href="/resume">Resume</a>
<div class="bg-white absolute h-[1px] bottom-0 w-96 max-w-[80%]"></div>
</nav>
14 changes: 3 additions & 11 deletions src/components/PostList.astro
Original file line number Diff line number Diff line change
@@ -1,5 +1,4 @@
---
import A from "./CaptionImageastro";
import Post from "./Post.astro";
const posts = await Astro.glob("../pages/posts/**/*.mdx");
Expand All @@ -12,9 +11,10 @@ const getRealImage = (postLocation: string, imageLocation: string): string => {
return result
}
---
<div>
<div
class="flex flex-col items-center w-full"
>
{
posts.sort((a, b) => new Date(b.frontmatter.date) - new Date(a.frontmatter.date)).filter(x => !x.frontmatter.draft ).map((x) => {
return(
Expand All @@ -30,11 +30,3 @@ const getRealImage = (postLocation: string, imageLocation: string): string => {
})
}
</div>
<style>
div {
display: flex;
flex-direction: column;
align-items: center;
width: 100%;
}
</style>
3 changes: 3 additions & 0 deletions src/components/Section.astro
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
<section class="flex flex-col w-full py-8">
<slot />
</section>
132 changes: 39 additions & 93 deletions src/pages/about.astro
Original file line number Diff line number Diff line change
@@ -1,41 +1,46 @@
---
import BaseLayout from "../layouts/BaseLayout.astro";
import Section from "../components/Section.astro";
const title = "About"
---
<BaseLayout
title={title}
>
<div class="flex flex-col w-full items-center">
<div class="
prose prose-invert
max-w-full
sm:max-w-prose
sm:prose-sm md:prose-md lg:prose-lg xl:prose-xl 2xl:prose-2xl
">
<h1>Hi I'm Ethan</h1>
<h2>Who am I?</h2>
<span>
I'm an engineer of sorts, I grew up in the suburbs of Philadelphia, went to school for Biomedical Engineering at Rutgers University and now live in Morristown, New Jersey. I am currently working as a Senior Systems Engineer for <b>Biomated Solutions</b> doing a wide variety of engineering tasks. I like to work the whole stack and enjoy doing everything from the PCB design all the way up to the User Interface. Whether that's good or not? I don't know, but it certainly has helped introduce me to a lot of new things. My hope is to write about some of those thing's in the hopes of reciprocating the help I've received from others along the way.
<br />
<br />
Another hope of mine is that by writing on here I will refine my prose, as well as further explore idea's I have.
</span>
<!--
<span>
In my freetime you can find me programming, working on side projects, backpacking, or doing some kind of physical activity.
</span>
-->
<div class="column">
<img id="me" src="/assets/about/ethan-hawaii.jpg" />
<span id="caption"><i>Waimea Canyon, HI</i></span>
<Section>
<div class="flex flex-col w-full space-y-4">
<h1>Hi I'm Ethan</h1>
<span>
I'm an engineer. I grew up in southern New Jersey, and went to school for Biomedical Engineering at Rutgers University.

I currently live in Morristown, NJ and am working as a Senior Systems Engineer for <b>Biomated Solutions</b> doing a wide variety of engineering tasks.
</span>
<span>
I like to work at every level of the stack and enjoy doing everything from PCB design all the way up to the User Interface. Whether that's good or not? I don't know, but it certainly has helped introduce me to a lot of new things.

My hope is to write about some of those thing's in the hopes of reciprocating the help I've received from others along the way.

Another hope of mine is that by writing on here I will refine my prose, as well as further explore idea's I have.
</span>

<span>
In my freetime you can find me programming, working on side projects, backpacking, or doing some kind of physical activity mostly running nowadays.
</span>
</div>
<section>
<div class="tools">
<span>Tools i use</span>
<div>
</Section>
<Section>
<div class="flex flex-col w-full items-center">
<img class="w-full max-w-[360px]" src="/assets/about/ethan-hawaii.jpg" />
<span><i>Waimea Canyon, HI</i></span>
</div>
</Section>
<Section>
<div class="flex flex-col w-full relative py-8 space-y-4">
<span class="text-xl text-semibold">Tools i use</span>
<div class="flex flex-col relative">
<div id="sidebar"></div>
<ul>
<ul class="list-none px-[12px]">
<li><b>Operating System:</b> Ubuntu</li>
<li><b>Terminal:</b> ZSH/TMUX</li>
<li><b>Text Editor:</b> Neovim</li>
Expand All @@ -44,11 +49,11 @@ const title = "About"
</ul>
</div>
</div>
<div class="tools">
<span>Languages I'm comfortable with in no specific order</span>
<div>
<div class="flex flex-col w-full relative py-8 space-y-4">
<span class="text-xl text-semibold">Languages I'm comfortable with in no specific order</span>
<div class="flex flex-col relative">
<div id="sidebar"></div>
<ul>
<ul class="list-none px-[12px]">
<li>Rust</li>
<li>C++</li>
<li>C</li>
Expand All @@ -59,75 +64,16 @@ const title = "About"
</ul>
</div>
</div>
</section>
</Section>

<section>
<Section>
<span>
I began learning software as an autodidact my sophmore year of college, and I've been hooked since. I love working on software that makes things move, but enjoy just moving bits around. I have an interest in hardware as well and find the intersection between hardware and software to be a fascinating design space.
</span>
</section>



<!--
Section about hiking
Section about goals
Section about purpose/value
Section about this blog
-->
<!--
<section>
<div id="timeline">
<div id="timeline-bar"></div>
<div class="timeline-item">
<img src="/assets/about/clearview.png"/>
<div class="timeline-info">
<span>Clearview Highschool</span>
<span>2010-2013</span>
</div>
</div>
<img src="/assets/about/ru.svg"/>
<img src="/assets/about/ethicon.webp"/>
<img src="/assets/about/arcmed.svg"/>
<img src="/assets/about/biomated.png"/>
</div>
</section>
-->
</div>
</Section>
</div>
</BaseLayout>
<style>
.row {
display: flex;
flex-wrap: wrap;
}

.column {
display: flex;
flex-direction: column;
align-items: center;
}

#me {
max-width: 100%;
margin-top: 12px;
}

@media (min-width: 360px) {
#me {
max-width: 336px;
}
}

span {
text-align: left;
}

#caption {
width: 100%;
text-align: center;
}

.tools {
position: relative;
padding-left: 0px;
Expand Down
15 changes: 1 addition & 14 deletions src/pages/index.astro
Original file line number Diff line number Diff line change
Expand Up @@ -3,23 +3,10 @@ import BaseLayout from "../layouts/BaseLayout.astro";
import PostList from "../components/PostList.astro";
const title = "Home"
---
<style>
.posts {
display: flex;
flex-direction: column;
}

h2 {
margin: 0px;
}

</style>
<BaseLayout
title={title}
>
<div class="flex flex-col align-center">
<h1>Posts</h1>

<PostList/>
</div>
</BaseLayout>
</BaseLayout>
Original file line number Diff line number Diff line change
@@ -1,13 +1,14 @@
---
---
layout: ../../../layouts/PostLayout.astro
title: Making an Embedded Rust Driver on the STM32 bluepill
hero: ./Background.jpg
thumbnail: ./Thumbnail.png
description: How i designed an
layout: ../../../layouts/PostLayout.astro
tags: [ rust, embedded, stm32, microcontrollers ]
date: 01-01-2022
draft: true
---

import Signup from '../../../components/Signup.astro';


Expand Down
12 changes: 11 additions & 1 deletion tailwind.config.cjs
Original file line number Diff line number Diff line change
@@ -1,10 +1,20 @@
/** @type {import('tailwindcss').Config} */
const plugin = require('tailwindcss/plugin')
module.exports = {
content: ['./src/**/*.{astro,html,js,jsx,md,mdx,svelte,ts,tsx,vue}'],
theme: {
extend: {},
},
plugins: [
plugin(function({ addBase, theme }) {
addBase({
'h1': { fontSize: theme('fontSize.4xl') },
'h2': { fontSize: theme('fontSize.3xl') },
'h3': { fontSize: theme('fontSize.2xl') },
'h4': { fontSize: theme('fontSize.1xl') },
'h5': { fontSize: theme('fontSize.lg') }
})
}),
require('@tailwindcss/typography'),
],
}
}

0 comments on commit d9aad29

Please sign in to comment.