feat(aboutme): update photos and blurb

This commit is contained in:
2025-06-24 21:49:15 -04:00
parent 6bda5876ba
commit afe6c08101
7 changed files with 29 additions and 22 deletions
Binary file not shown.

After

Width:  |  Height:  |  Size: 187 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 175 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 340 KiB

+29 -22
View File
@@ -5,6 +5,9 @@ import React, {
useEffect, useEffect,
useRef, useRef,
} from "react"; } from "react";
import cruiseImg from "./images/cruise.jpg";
import discGolfImg from "./images/disc_golf_ace.jpg";
import odinImg from "./images/odin.jpg";
import { import {
BrowserRouter as Router, BrowserRouter as Router,
Routes, Routes,
@@ -418,32 +421,36 @@ function LandingPage() {
function About() { function About() {
return ( return (
<div className="py-10"> <div className="py-10">
<div className="flex justify-center items-end space-x-4"> <div className="flex justify-center items-end space-x-4 flex-wrap">
<img {[cruiseImg, discGolfImg, odinImg].map((src, i) => (
src="/images/photo1.jpg" <img
alt="Photo 1" key={i}
className="w-24 h-24 rounded-full" src={src}
/> alt={["Cruise", "Disc golf ace", "Odin"][i]}
<img className="
src="/images/photo2.jpg" rounded-full
alt="Photo 2" aspect-square
className="w-24 h-24 rounded-full transform translate-y-4" object-cover
/> w-1/3 max-w-[120px] /* small screens: 33% of container, up to 120px */
<img sm:w-1/4 sm:max-w-[150px] /* ≥640px: 25% up to 150px */
src="/images/photo3.jpg" md:w-1/6 md:max-w-[200px] /* ≥768px: ~16% up to 200px */
alt="Photo 3" lg:w-1/8 lg:max-w-[250px] /* ≥1024px: 12.5% up to 250px */
className="w-24 h-24 rounded-full" "
/> />
))}
</div> </div>
<div className="text-center mt-8 px-4"> <div className="text-center mt-8 px-4">
<h2 className="text-3xl font-bold mb-4">About Me</h2> <h2 className="text-3xl font-bold mb-4">About Me</h2>
<p className="text-lg text-gray-700 dark:text-gray-300 max-w-2xl mx-auto"> <p className="text-lg text-gray-700 dark:text-gray-300 max-w-2xl mx-auto">
I am a software engineer at Whisker who designs and implements Im Alex, a full-stack engineer at Whisker, working on backend one
whatever is highest priority. I work with every team in the minute, mobile tweaks the next, and firmware the day after. Learning
engineering organization to coordinate mission-critical projects new tech is something I'm passionate about, and Im all about
across backend, mobile, and firmware. Im comfortable in many tech spreading that knowledge fast. Off-duty youll catch me reading a
stacks and learn new ones quicklynever afraid to jump in the deep end bunch, writing (ironically, on my blog, which you are currently
and adapt on the fly. viewing), exploring the outdoors with my dogs (and my girlfriend,
trust me shes real!), or rolling dice as a D&amp;D sorcerer. Here
youll find book thoughts, code experiments, and random shower
thoughts. Thanks for stopping by!
</p> </p>
</div> </div>
<div className="mt-8 flex flex-col items-center space-y-2"> <div className="mt-8 flex flex-col items-center space-y-2">
Binary file not shown.

After

Width:  |  Height:  |  Size: 187 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 175 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 340 KiB