SowinskiBraeden/.profile
1
0 Fork 0
Code Issues Packages Projects Releases Wiki Activity

pull the terminal styling back and add an ASCII backdrop

Browse Source 
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>
This commit is contained in:
SowinskiBraedenandClaude Opus 5 committed 2026-10-17 23:55:06 -07:00
1 parent 8595290318
commit 54c00bf16f
10 files changed
+693 -698
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

index.html
+15 -18
View File
@@ -110,6 +110,7 @@
</head>
<body class="js-stop-transition" data-page="home">
<canvas id="ascii-bg" aria-hidden="true"></canvas>
<header class="header">
<nav class="nav">
<div class="logo">
@@ -171,42 +172,39 @@
<main class="main">
<section class="term">
<div class="term__bar">
<span class="term__title">braeden@sowinski.dev: <b>~</b></span>
<span class="term__dots">&#9472; &#9633; &#10005;</span>
<span class="term__dot"></span>
<span class="term__dot"></span>
<span class="term__dot"></span>
<span class="term__title">braeden@sowinski.dev</span>
</div>
<div class="term__body">
<div class="term__avatar-wrap">
<img src="https://avatars.githubusercontent.com/u/48144618" class="term__avatar" alt="Braeden Sowinski profile photo">
<span class="term__avatar-caption">./braeden.png</span>
</div>
<div class="term__stream">
<p class="cmd">whoami</p>
<h1 class="name line">Braeden Sowinski</h1>
<p class="cmd"><span class="cmd__text">whoami</span><span class="caret"></span></p>
<p class="cmd">cat ./role</p>
<p class="des line">
<h1 class="name">Braeden Sowinski</h1>
<p class="des">
Software Engineer &amp; Systems Admin | CST Student @ BCIT
</p>
<p class="des line hero-description-secondary">
<p class="des hero-description-secondary">
Backend systems, APIs, data-driven software, and low-level problem solving
</p>
<p class="cmd">ls ./highlights</p>
<div class="hero-badges line">
<div class="hero-badges">
<span class="badge">BCIT CST Diploma</span>
<span class="badge">C4A President</span>
<span class="badge">Hackathon Podium Finisher</span>
</div>
<p class="cmd">ls ./pages</p>
<div class="hero-actions line">
<a class="button button-primary" href="./projects.html">projects</a>
<a class="button button-secondary" href="./about.html">about</a>
<div class="hero-actions">
<a class="button button-primary" href="./projects.html">Projects</a>
<a class="button button-secondary" href="./about.html">About</a>
</div>
<p class="cmd">cat ./contact</p>
<div class="social-icons line">
<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"
@@ -229,8 +227,6 @@
</svg>
</a>
</div>
<p class="prompt-end">$ <span class="caret"></span></p>
</div>
</div>
</section>
@@ -238,6 +234,7 @@
<script src="./public/scripts/mobile.js"></script>
<script src="./public/scripts/theme.js"></script>
<script src="./public/scripts/ascii-bg.js"></script>
<script src="./public/scripts/hero-effects.js"></script>
</body>