SowinskiBraedenandClaude Opus 5
54c00bf16f
The first pass applied terminal decoration to everything, which read as costume rather than design. Strip it back to a few deliberate cues and let an animated backdrop carry the character instead: - Drop the prefix glyphs from links, tags, nav items, badges and headings, and restore plain section names in place of snake_case. - Keep one prompt in the hero, the ~/ on the wordmark, ISO dates and status dots; everything else is ordinary type. - Restore depth: acrylic surfaces over soft radial light, 6px radii, and an accent glow on the primary action and status dots. - Draw a dithered ASCII field behind the page. A fixed per-cell dither value decides which cells are lit so coverage stays even, while slow interfering waves move brightness through it. It idles when the tab is hidden and stays still under prefers-reduced-motion. - Remove the nested panel boxes on the projects page and size the entry page to its article column. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
189 lines
10 KiB
HTML
Executable File
189 lines
10 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang='en'>
|
|
|
|
<head>
|
|
<title>Braeden Sowinski Projects and Updates | Software Portfolio</title>
|
|
<meta charset='utf-8'>
|
|
<meta name='description' content="Browse selected software projects, technical writeups, and recent updates from Braeden Sowinski, including backend systems, APIs, and student leadership milestones." />
|
|
<meta name='author' content="Braeden Sowinski" />
|
|
<meta name='keywords' content="Braeden Sowinski, sowinski.dev, projects, updates, portfolio, software engineer, BCIT" />
|
|
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
|
|
<meta name='robots' content='index, follow'>
|
|
<meta name='theme-color' content='#0c0d10'>
|
|
<link rel='canonical' href='https://sowinski.dev/projects.html'>
|
|
<meta property='og:type' content='website'>
|
|
<meta property='og:title' content='Braeden Sowinski Projects and Updates | Software Portfolio'>
|
|
<meta property='og:description' content='Browse selected software projects, technical writeups, and recent updates from Braeden Sowinski.'>
|
|
<meta property='og:url' content='https://sowinski.dev/projects.html'>
|
|
<meta property='og:site_name' content='Braeden Sowinski'>
|
|
<meta property='og:image' content='https://avatars.githubusercontent.com/u/48144618?v=4'>
|
|
<meta property='og:image:alt' content='Braeden Sowinski profile photo'>
|
|
<meta name='twitter:card' content='summary_large_image'>
|
|
<meta name='twitter:title' content='Braeden Sowinski Projects and Updates | Software Portfolio'>
|
|
<meta name='twitter:description' content='Browse selected software projects, technical writeups, and recent updates from Braeden Sowinski.'>
|
|
<meta name='twitter:image' content='https://avatars.githubusercontent.com/u/48144618?v=4'>
|
|
<script type='application/ld+json'>
|
|
{
|
|
"@context": "https://schema.org",
|
|
"@type": "CollectionPage",
|
|
"@id": "https://sowinski.dev/projects.html#collection",
|
|
"url": "https://sowinski.dev/projects.html",
|
|
"name": "Braeden Sowinski Projects and Updates",
|
|
"description": "Selected software projects, technical writeups, and recent updates from Braeden Sowinski.",
|
|
"isPartOf": {
|
|
"@id": "https://sowinski.dev/#website"
|
|
},
|
|
"about": {
|
|
"@id": "https://sowinski.dev/#person"
|
|
},
|
|
"author": {
|
|
"@id": "https://sowinski.dev/#person"
|
|
},
|
|
"inLanguage": "en-CA"
|
|
}
|
|
</script>
|
|
|
|
<link rel="icon" type="image/svg+xml" href="./public/images/favicon.svg">
|
|
<link rel="stylesheet" href="./public/css/style.css">
|
|
<link rel="stylesheet" href="./public/css/projects.css">
|
|
</head>
|
|
|
|
<body class="js-stop-transition" data-page="projects">
|
|
<canvas id="ascii-bg" aria-hidden="true"></canvas>
|
|
<header class="header">
|
|
<nav class="nav">
|
|
<div class="logo">
|
|
<a href="./" title="sowinski.dev (Alt + H)">
|
|
<img src="https://avatars.githubusercontent.com/u/48144618?v=4" alt="Braeden Sowinski profile photo" style="border-radius:50%;"
|
|
aria-label="Braeden Sowinski profile photo" height="32">sowinski.dev
|
|
</a>
|
|
<span class="logo-switches">
|
|
<button id="theme-toggle" accesskey="t" title="(Alt + T)">
|
|
<svg id="sun" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M21 12.79A9 9 0 1111.21 3 7 7 0 0021 12.79z" />
|
|
</svg>
|
|
<svg id="moon" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none"
|
|
stroke="currentcolor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
<circle cx="12" cy="12" r="5" />
|
|
<line x1="12" y1="1" x2="12" y2="3" />
|
|
<line x1="12" y1="21" x2="12" y2="23" />
|
|
<line x1="4.22" y1="4.22" x2="5.64" y2="5.64" />
|
|
<line x1="18.36" y1="18.36" x2="19.78" y2="19.78" />
|
|
<line x1="1" y1="12" x2="3" y2="12" />
|
|
<line x1="21" y1="12" x2="23" y2="12" />
|
|
<line x1="4.22" y1="19.78" x2="5.64" y2="18.36" />
|
|
<line x1="18.36" y1="5.64" x2="19.78" y2="4.22" />
|
|
</svg>
|
|
</button>
|
|
</span>
|
|
</div>
|
|
<ul id="menu" class="nav__links">
|
|
<li id="home-link">
|
|
<a href="./" title="Home">
|
|
<span class="active">Home</span>
|
|
</a>
|
|
</li>
|
|
<li id="about-link">
|
|
<a href="./about.html" title="About">
|
|
<span class="active">About</span>
|
|
</a>
|
|
</li>
|
|
<li id="projects-link">
|
|
<a href="./projects.html" title="Projects">
|
|
<span class="active">Projects</span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
<p class="menu cta">Menu</p>
|
|
</nav>
|
|
|
|
<div id="mobile__menu" class="overlay">
|
|
<button type="button" class="close" aria-label="Close menu">×</button>
|
|
<div class="overlay__content">
|
|
<a href="./" title="Home"><span class="active">Home</span></a>
|
|
<a href="./about.html" title="About"><span class="active">About</span></a>
|
|
<a href="./projects.html" title="Projects"><span class="active">Projects</span></a>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
|
|
<main class="projects-page page-shell">
|
|
<section class="projects-hero">
|
|
<h1>Braeden Sowinski projects, milestones, and technical writeups.</h1>
|
|
<p class="projects-intro">
|
|
A collection of backend, infrastructure, data-driven, and full-stack projects,
|
|
including personal tools, student work, freelance websites, and technical writeups.
|
|
</p>
|
|
</section>
|
|
|
|
<section class="content-section">
|
|
<div class="section-heading">
|
|
<h2>Selected Projects</h2>
|
|
<div class="section-heading__right">
|
|
<span id="projects-count" class="section-count"></span>
|
|
<a class="section-link" href="https://git.sowinski.dev/SowinskiBraeden" target="_blank" rel="noopener noreferrer">Gitea</a>
|
|
</div>
|
|
</div>
|
|
<div id="projects-grid" class="content-grid">
|
|
<p class="loading-state">Loading projects...</p>
|
|
</div>
|
|
<div id="projects-toggle-shell" class="projects-toggle-shell" hidden>
|
|
<button id="projects-toggle" class="projects-toggle" type="button" aria-expanded="false">
|
|
Show more projects
|
|
</button>
|
|
</div>
|
|
</section>
|
|
|
|
<section class="content-section updates-section">
|
|
<div class="section-heading">
|
|
<h2>Updates & Achievements</h2>
|
|
<div class="section-heading__right">
|
|
<span id="updates-count" class="section-count"></span>
|
|
</div>
|
|
</div>
|
|
<div id="updates-grid" class="content-grid updates-grid">
|
|
<p class="loading-state">Loading updates...</p>
|
|
</div>
|
|
</section>
|
|
|
|
<footer class="footer flex-container site-footer">
|
|
<p>Get in touch with me!</p>
|
|
<div class="social-icons">
|
|
<a class="icon" href="https://www.linkedin.com/in/SowinskiBraeden" target="_blank" rel="noopener noreferrer me"
|
|
title="LinkedIn">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-linkedin"
|
|
viewBox="0 0 16 16">
|
|
<path
|
|
d="M0 1.146C0 .513.526 0 1.175 0h13.65C15.474 0 16 .513 16 1.146v13.708c0 .633-.526 1.146-1.175 1.146H1.175C.526 16 0 15.487 0 14.854zm4.943 12.248V6.169H2.542v7.225zm-1.2-8.212c.837 0 1.358-.554 1.358-1.248-.015-.709-.52-1.248-1.342-1.248S2.4 3.226 2.4 3.934c0 .694.521 1.248 1.327 1.248zm4.908 8.212V9.359c0-.216.016-.432.08-.586.173-.431.568-.878 1.232-.878.869 0 1.216.662 1.216 1.634v3.865h2.401V9.25c0-2.22-1.184-3.252-2.764-3.252-1.274 0-1.845.7-2.165 1.193v.025h-.016l.016-.025V6.169h-2.4c.03.678 0 7.225 0 7.225z" />
|
|
</svg>
|
|
</a>
|
|
<a class="icon" href="https://git.sowinski.dev/SowinskiBraeden" target="_blank" rel="noopener noreferrer me" title="Gitea" aria-label="Gitea">
|
|
<svg role="img" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg" fill="currentColor">
|
|
<path
|
|
d="M4.209 4.603c-.247 0-.525.02-.84.088-.333.07-1.28.283-2.054 1.027C-.403 7.25.035 9.685.089 10.052c.065.446.263 1.687 1.21 2.768 1.749 2.141 5.513 2.092 5.513 2.092s.462 1.103 1.168 2.119c.955 1.263 1.936 2.248 2.89 2.367 2.406 0 7.212-.004 7.212-.004s.458.004 1.08-.394c.535-.324 1.013-.893 1.013-.893s.492-.527 1.18-1.73c.21-.37.385-.729.538-1.068 0 0 2.107-4.471 2.107-8.823-.042-1.318-.367-1.55-.443-1.627-.156-.156-.366-.153-.366-.153s-4.475.252-6.792.306c-.508.011-1.012.023-1.512.027v4.474l-.634-.301c0-1.39-.004-4.17-.004-4.17-1.107.016-3.405-.084-3.405-.084s-5.399-.27-5.987-.324c-.187-.011-.401-.032-.648-.032zm.354 1.832h.111s.271 2.269.6 3.597C5.549 11.147 6.22 13 6.22 13s-.996-.119-1.641-.348c-.99-.324-1.409-.714-1.409-.714s-.73-.511-1.096-1.52C1.444 8.73 2.021 7.7 2.021 7.7s.32-.859 1.47-1.145c.395-.106.863-.12 1.072-.12zm8.33 2.554c.26.003.509.127.509.127l.868.422-.529 1.075a.686.686 0 0 0-.614.359.685.685 0 0 0 .072.756l-.939 1.924a.69.69 0 0 0-.66.527.687.687 0 0 0 .347.763.686.686 0 0 0 .867-.206.688.688 0 0 0-.069-.882l.916-1.874a.667.667 0 0 0 .237-.02.657.657 0 0 0 .271-.137 8.826 8.826 0 0 1 1.016.512.761.761 0 0 1 .286.282c.073.21-.073.569-.073.569-.087.29-.702 1.55-.702 1.55a.692.692 0 0 0-.676.477.681.681 0 1 0 1.157-.252c.073-.141.141-.282.214-.431.19-.397.515-1.16.515-1.16.035-.066.218-.394.103-.814-.095-.435-.48-.638-.48-.638-.467-.301-1.116-.58-1.116-.58s0-.156-.042-.27a.688.688 0 0 0-.148-.241l.516-1.062 2.89 1.401s.48.218.583.619c.073.282-.019.534-.069.657-.24.587-2.1 4.317-2.1 4.317s-.232.554-.748.588a1.065 1.065 0 0 1-.393-.045l-.202-.08-4.31-2.1s-.417-.218-.49-.596c-.083-.31.104-.691.104-.691l2.073-4.272s.183-.37.466-.497a.855.855 0 0 1 .35-.077z" />
|
|
</svg>
|
|
</a>
|
|
<a class="icon" href="mailto:braeden@sowinski.dev" target="_blank" rel="noopener noreferrer me" title="Email">
|
|
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 21" fill="none" stroke="currentcolor" stroke-width="2"
|
|
stroke-linecap="round" stroke-linejoin="round">
|
|
<path d="M4 4h16c1.1 0 2 .9 2 2v12c0 1.1-.9 2-2 2H4c-1.1 0-2-.9-2-2V6c0-1.1.9-2 2-2z" />
|
|
<polyline points="22,6 12,13 2,6" />
|
|
</svg>
|
|
</a>
|
|
</div>
|
|
</footer>
|
|
</main>
|
|
|
|
<script src="./public/scripts/mobile.js"></script>
|
|
<script src="./public/scripts/theme.js"></script>
|
|
<script src="./public/scripts/ascii-bg.js"></script>
|
|
<script src="https://cdn.jsdelivr.net/npm/marked/marked.min.js"></script>
|
|
<script src="./public/scripts/content.js"></script>
|
|
<script>
|
|
window.PORTFOLIO_CONTENT.initListPage();
|
|
</script>
|
|
</body>
|
|
|
|
</html>
|