added more samples and identified ideal candidates
This commit is contained in:
venus
@@ -0,0 +1,629 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>River Rooks | Field Notes & Dispatches (Cards Lander)</title>
|
||||
<style>
|
||||
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:ital,wght@0,400;0,500;0,700;1,400&family=Inter:wght@400;500;700&family=JetBrains+Mono:ital,wght@0,400;0,500;1,400&display=swap');
|
||||
|
||||
:root {
|
||||
--bg-canvas: #0d0f12; /* Deep slate/charcoal canvas */
|
||||
--bg-surface: #121417; /* Card background surface */
|
||||
--bg-elevated: #1c1f26; /* Hovered card surface */
|
||||
--border-color: #2b303b; /* Low-contrast 1px border */
|
||||
--text-primary: #e0e6f0; /* Light off-white prose */
|
||||
--text-muted: #8a95a5; /* Monospace metadata */
|
||||
--accent-cyan: #00f0ff; /* Primary terminal accent */
|
||||
--accent-green: #00e676; /* Operational status indicator */
|
||||
--accent-amber: #ffb700; /* Pinned badge accent */
|
||||
}
|
||||
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
body {
|
||||
background-color: var(--bg-canvas);
|
||||
color: var(--text-primary);
|
||||
font-family: 'Inter', sans-serif;
|
||||
line-height: 1.65;
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
padding: 0 0 64px 0;
|
||||
}
|
||||
|
||||
/* Top Sticky Header */
|
||||
.top-navbar {
|
||||
width: 100%;
|
||||
background-color: var(--bg-canvas);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
position: sticky;
|
||||
top: 0;
|
||||
z-index: 100;
|
||||
padding: 12px 24px;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 0.82rem;
|
||||
}
|
||||
|
||||
.nav-brand {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 10px;
|
||||
color: var(--text-primary);
|
||||
text-decoration: none;
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.status-dot {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
background-color: var(--accent-green);
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.nav-links {
|
||||
display: flex;
|
||||
gap: 14px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.nav-item {
|
||||
color: var(--text-muted);
|
||||
text-decoration: none;
|
||||
padding: 3px 6px;
|
||||
transition: none; /* Instant snap */
|
||||
}
|
||||
|
||||
.nav-item:hover {
|
||||
color: var(--accent-cyan);
|
||||
}
|
||||
|
||||
.nav-item.active {
|
||||
color: var(--text-primary);
|
||||
border-bottom: 1px solid var(--accent-cyan);
|
||||
}
|
||||
|
||||
/* Page Container */
|
||||
.page-container {
|
||||
width: 100%;
|
||||
max-width: 960px;
|
||||
padding: 40px 20px 0 20px;
|
||||
}
|
||||
|
||||
/* Hero Identity Header */
|
||||
.hero-header {
|
||||
margin-bottom: 36px;
|
||||
padding-bottom: 24px;
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
}
|
||||
|
||||
.hero-title {
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 2.2rem;
|
||||
font-weight: 700;
|
||||
color: var(--text-primary);
|
||||
letter-spacing: -0.02em;
|
||||
margin-bottom: 6px;
|
||||
}
|
||||
|
||||
.hero-subtitle {
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 0.85rem;
|
||||
color: var(--accent-cyan);
|
||||
margin-bottom: 14px;
|
||||
}
|
||||
|
||||
.hero-bio {
|
||||
font-size: 0.98rem;
|
||||
color: var(--text-primary);
|
||||
max-width: 70ch;
|
||||
margin-bottom: 18px;
|
||||
}
|
||||
|
||||
.stack-tags {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 0.76rem;
|
||||
}
|
||||
|
||||
.stack-tag {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
/* Featured Lead Card */
|
||||
.featured-section {
|
||||
margin-bottom: 44px;
|
||||
}
|
||||
|
||||
.section-label {
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 0.82rem;
|
||||
font-weight: 700;
|
||||
color: var(--text-muted);
|
||||
text-transform: uppercase;
|
||||
letter-spacing: 0.05em;
|
||||
margin-bottom: 14px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.featured-card {
|
||||
background-color: var(--bg-surface);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 4px;
|
||||
padding: 24px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 16px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.featured-card:hover {
|
||||
border-color: var(--accent-cyan);
|
||||
}
|
||||
|
||||
.featured-badge-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 0.76rem;
|
||||
flex-wrap: wrap;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.badge-pinned {
|
||||
color: var(--accent-amber);
|
||||
font-weight: 700;
|
||||
}
|
||||
|
||||
.featured-date {
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.featured-title-link {
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 1.45rem;
|
||||
font-weight: 700;
|
||||
color: var(--text-primary);
|
||||
text-decoration: none;
|
||||
line-height: 1.3;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.featured-title-link:hover {
|
||||
color: var(--accent-cyan);
|
||||
}
|
||||
|
||||
.featured-title-link:focus {
|
||||
outline: 2px solid var(--accent-cyan);
|
||||
}
|
||||
|
||||
.featured-abstract {
|
||||
font-size: 0.95rem;
|
||||
color: var(--text-primary);
|
||||
line-height: 1.6;
|
||||
}
|
||||
|
||||
/* Code Snippet in Lead Card */
|
||||
.code-wrapper {
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 3px;
|
||||
background-color: var(--bg-canvas);
|
||||
overflow: hidden;
|
||||
font-family: 'JetBrains Mono', monospace;
|
||||
}
|
||||
|
||||
.code-header {
|
||||
background-color: var(--bg-surface);
|
||||
border-bottom: 1px solid var(--border-color);
|
||||
padding: 6px 12px;
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-muted);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
}
|
||||
|
||||
.code-body {
|
||||
padding: 12px;
|
||||
font-size: 0.8rem;
|
||||
overflow-x: auto;
|
||||
color: var(--text-primary);
|
||||
}
|
||||
|
||||
.featured-footer {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
padding-top: 8px;
|
||||
border-top: 1px solid var(--border-color);
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 0.8rem;
|
||||
}
|
||||
|
||||
.cta-button {
|
||||
background-color: var(--accent-cyan);
|
||||
color: var(--bg-canvas);
|
||||
padding: 6px 14px;
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-weight: 700;
|
||||
font-size: 0.82rem;
|
||||
text-decoration: none;
|
||||
border-radius: 2px;
|
||||
border: 1px solid var(--accent-cyan);
|
||||
transition: none; /* Instant snap */
|
||||
}
|
||||
|
||||
.cta-button:hover {
|
||||
background-color: transparent;
|
||||
color: var(--accent-cyan);
|
||||
}
|
||||
|
||||
.cta-button:focus {
|
||||
outline: 2px solid var(--accent-cyan);
|
||||
}
|
||||
|
||||
/* Recent Dispatches Grid */
|
||||
.cards-grid {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(2, 1fr);
|
||||
gap: 16px;
|
||||
margin-bottom: 48px;
|
||||
}
|
||||
|
||||
@media (max-width: 720px) {
|
||||
.cards-grid {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
|
||||
.dispatch-card {
|
||||
background-color: var(--bg-surface);
|
||||
border: 1px solid var(--border-color);
|
||||
border-radius: 4px;
|
||||
padding: 20px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
gap: 12px;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.dispatch-card:hover {
|
||||
border-color: var(--accent-cyan);
|
||||
background-color: var(--bg-elevated);
|
||||
}
|
||||
|
||||
.card-meta-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 0.75rem;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.card-date {
|
||||
color: var(--accent-cyan);
|
||||
}
|
||||
|
||||
.card-heading-link {
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 1.05rem;
|
||||
font-weight: 700;
|
||||
color: var(--text-primary);
|
||||
text-decoration: none;
|
||||
line-height: 1.35;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.dispatch-card:hover .card-heading-link {
|
||||
color: var(--accent-cyan);
|
||||
}
|
||||
|
||||
.card-heading-link:focus {
|
||||
outline: 2px solid var(--accent-cyan);
|
||||
}
|
||||
|
||||
.card-summary {
|
||||
font-size: 0.88rem;
|
||||
color: var(--text-primary);
|
||||
line-height: 1.55;
|
||||
}
|
||||
|
||||
.card-bottom-row {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: baseline;
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 0.74rem;
|
||||
padding-top: 10px;
|
||||
border-top: 1px solid var(--border-color);
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
}
|
||||
|
||||
.card-tag-cluster {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 6px;
|
||||
color: var(--text-muted);
|
||||
}
|
||||
|
||||
.read-more-link {
|
||||
color: var(--accent-cyan);
|
||||
text-decoration: none;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.read-more-link:hover {
|
||||
text-decoration: underline;
|
||||
}
|
||||
|
||||
/* Bottom Site Footer */
|
||||
.site-footer {
|
||||
border-top: 1px solid var(--border-color);
|
||||
padding-top: 24px;
|
||||
font-family: 'IBM Plex Mono', monospace;
|
||||
font-size: 0.8rem;
|
||||
color: var(--text-muted);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-wrap: wrap;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.footer-links {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
gap: 10px;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.footer-link {
|
||||
color: var(--text-primary);
|
||||
text-decoration: none;
|
||||
padding: 2px 4px;
|
||||
transition: none;
|
||||
}
|
||||
|
||||
.footer-link:hover {
|
||||
background-color: var(--accent-cyan);
|
||||
color: var(--bg-canvas);
|
||||
}
|
||||
|
||||
.footer-link:focus {
|
||||
outline: 2px solid var(--accent-cyan);
|
||||
}
|
||||
|
||||
.pipe {
|
||||
color: var(--border-color);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<!-- Sticky Top Navigation -->
|
||||
<header class="top-navbar">
|
||||
<a href="#" class="nav-brand">
|
||||
<span class="status-dot"></span>
|
||||
<span>ROOKS.DEV // NOTES</span>
|
||||
</a>
|
||||
<nav class="nav-links" aria-label="Site Navigation">
|
||||
<a href="#" class="nav-item active">[Dispatches]</a>
|
||||
<a href="https://git.rooks.dev" target="_blank" rel="noopener" class="nav-item">Git</a>
|
||||
<a href="feed.xml" class="nav-item">RSS</a>
|
||||
<a href="index.html" class="nav-item">Catalog ↗</a>
|
||||
</nav>
|
||||
</header>
|
||||
|
||||
<main class="page-container">
|
||||
|
||||
<!-- Hero Identity Block -->
|
||||
<section class="hero-header" aria-label="Author Profile">
|
||||
<h1 class="hero-title">River Rooks</h1>
|
||||
<div class="hero-subtitle">SYSTEMS ARCHITECTURE & CYBERSECURITY • ALABAMA, USA</div>
|
||||
<p class="hero-bio">
|
||||
Cybersecurity student at the University of Alabama College of Engineering. Architecting high-throughput homelab networks, reverse engineering IoT firmware, and writing zero-allocation Unix utilities.
|
||||
</p>
|
||||
<div class="stack-tags">
|
||||
<span class="stack-tag">[#network-forensics]</span>
|
||||
<span class="stack-tag">[#docker-traefik]</span>
|
||||
<span class="stack-tag">[#arch-linux]</span>
|
||||
<span class="stack-tag">[#neovim]</span>
|
||||
<span class="stack-tag">[#wireguard]</span>
|
||||
<span class="stack-tag">[#posix-sh]</span>
|
||||
<span class="stack-tag">[#python]</span>
|
||||
<span class="stack-tag">[#rust]</span>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Featured Lead Story -->
|
||||
<section class="featured-section" aria-label="Featured Technical Article">
|
||||
<div class="section-label">
|
||||
<span>// Pinned Technical Write-Up</span>
|
||||
</div>
|
||||
|
||||
<article class="featured-card">
|
||||
<div class="featured-badge-row">
|
||||
<span class="badge-pinned">[PINNED WRITE-UP]</span>
|
||||
<span class="featured-date">2026-07-20 • 8 min read</span>
|
||||
</div>
|
||||
|
||||
<h2 class="featured-title">
|
||||
<a href="#" class="featured-title-link">Reverse Engineering IoT Firmware: SPI Flash Extraction</a>
|
||||
</h2>
|
||||
|
||||
<p class="featured-abstract">
|
||||
In security audits of embedded systems, retrieving the firmware is the critical first step. When over-the-air updates are encrypted and debug ports (UART, JTAG) are disabled in production silicon, dumping physical SPI Flash memory becomes necessary. This writeup covers extracting firmware from an 8-pin SOP SPI flash chip using a Bus Pirate and flashrom to bypass bootloader lockdowns.
|
||||
</p>
|
||||
|
||||
<!-- Code Snippet -->
|
||||
<div class="code-wrapper">
|
||||
<div class="code-header">
|
||||
<span>extract_firmware.sh</span>
|
||||
<span>POSIX sh</span>
|
||||
</div>
|
||||
<div class="code-body">
|
||||
<pre><code># Query the SPI flash details using flashrom via Bus Pirate
|
||||
flashrom -p buspirate_spi:dev=/dev/ttyUSB0,spispeed=1M -r firmware_dump.bin
|
||||
|
||||
# Verify the integrity of the binary dump by comparing hashes
|
||||
if [ $? -eq 0 ]; then
|
||||
echo "Dump successful. Running md5sum..."
|
||||
md5sum firmware_dump.bin
|
||||
fi</code></pre>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="featured-footer">
|
||||
<div class="stack-tags">
|
||||
<span class="stack-tag">[#firmware]</span>
|
||||
<span class="stack-tag">[#hardware]</span>
|
||||
<span class="stack-tag">[#security]</span>
|
||||
<span class="stack-tag">[#bus-pirate]</span>
|
||||
</div>
|
||||
<a href="#" class="cta-button">READ FULL WRITEUP [8 MIN] →</a>
|
||||
</div>
|
||||
</article>
|
||||
</section>
|
||||
|
||||
<!-- Recent Dispatches Grid -->
|
||||
<section class="recent-section" aria-label="Recent Technical Dispatches">
|
||||
<div class="section-label">
|
||||
<span>// Recent Dispatches & Architecture Notes</span>
|
||||
</div>
|
||||
|
||||
<div class="cards-grid">
|
||||
|
||||
<!-- Card 1: Traefik -->
|
||||
<article class="dispatch-card">
|
||||
<div>
|
||||
<div class="card-meta-row">
|
||||
<time datetime="2026-07-15" class="card-date">2026-07-15</time>
|
||||
<span>12 min read</span>
|
||||
</div>
|
||||
<h3 style="margin: 10px 0 8px 0;">
|
||||
<a href="#" class="card-heading-link">Building a High-Availability Traefik Router with Docker Compose</a>
|
||||
</h3>
|
||||
<p class="card-summary">
|
||||
Architecting automated TLS wildcard certificate propagation, Docker provider label routing, zero-downtime container updates, and backend health-check failover routes.
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-bottom-row">
|
||||
<div class="card-tag-cluster">
|
||||
<span>[#homelab]</span>
|
||||
<span>[#docker-traefik]</span>
|
||||
</div>
|
||||
<a href="#" class="read-more-link">Read →</a>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<!-- Card 2: POSIX sh -->
|
||||
<article class="dispatch-card">
|
||||
<div>
|
||||
<div class="card-meta-row">
|
||||
<time datetime="2026-07-10" class="card-date">2026-07-10</time>
|
||||
<span>6 min read</span>
|
||||
</div>
|
||||
<h3 style="margin: 10px 0 8px 0;">
|
||||
<a href="#" class="card-heading-link">POSIX sh vs. Bash: Portability in Modern Scripts</a>
|
||||
</h3>
|
||||
<p class="card-summary">
|
||||
Analyzing edge-case incompatibilities, syntax overhead, eliminating bashisms, and writing fast, bulletproof bootstrapping scripts for Alpine and embedded targets conforming to IEEE Std 1003.1.
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-bottom-row">
|
||||
<div class="card-tag-cluster">
|
||||
<span>[#posix-sh]</span>
|
||||
<span>[#unix]</span>
|
||||
</div>
|
||||
<a href="#" class="read-more-link">Read →</a>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<!-- Card 3: Heap Exploitation -->
|
||||
<article class="dispatch-card">
|
||||
<div>
|
||||
<div class="card-meta-row">
|
||||
<time datetime="2026-06-28" class="card-date">2026-06-28</time>
|
||||
<span>15 min read</span>
|
||||
</div>
|
||||
<h3 style="margin: 10px 0 8px 0;">
|
||||
<a href="#" class="card-heading-link">CTF Write-up: Heap Exploitation in glibc 2.35</a>
|
||||
</h3>
|
||||
<p class="card-summary">
|
||||
Deconstructing modern glibc memory allocator defenses: tcache safe-linking pointer mangling, bypass primitives, and House of Apple file structure hijacking.
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-bottom-row">
|
||||
<div class="card-tag-cluster">
|
||||
<span>[#ctf]</span>
|
||||
<span>[#security]</span>
|
||||
</div>
|
||||
<a href="#" class="read-more-link">Read →</a>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
<!-- Card 4: WireGuard OPNsense -->
|
||||
<article class="dispatch-card">
|
||||
<div>
|
||||
<div class="card-meta-row">
|
||||
<time datetime="2026-06-14" class="card-date">2026-06-14</time>
|
||||
<span>10 min read</span>
|
||||
</div>
|
||||
<h3 style="margin: 10px 0 8px 0;">
|
||||
<a href="#" class="card-heading-link">Zero-Trust Network Isolation with WireGuard & OPNsense VLANs</a>
|
||||
</h3>
|
||||
<p class="card-summary">
|
||||
Designing strict zone-based firewall rules across isolated VLANs (Management, Server DMZ, IoT, Trusted Clients) with point-to-point WireGuard cryptographic routing.
|
||||
</p>
|
||||
</div>
|
||||
<div class="card-bottom-row">
|
||||
<div class="card-tag-cluster">
|
||||
<span>[#networking]</span>
|
||||
<span>[#wireguard]</span>
|
||||
</div>
|
||||
<a href="#" class="read-more-link">Read →</a>
|
||||
</div>
|
||||
</article>
|
||||
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Site Footer -->
|
||||
<footer class="site-footer">
|
||||
<div>River Rooks © 2026 • Node RACK-01</div>
|
||||
<nav class="footer-links" aria-label="Footer Links">
|
||||
<a href="feed.xml" class="footer-link">Feed</a>
|
||||
<span class="pipe">|</span>
|
||||
<a href="https://git.rooks.dev" target="_blank" rel="noopener" class="footer-link">Git Forge</a>
|
||||
<span class="pipe">|</span>
|
||||
<a href="https://github.com" target="_blank" rel="noopener" class="footer-link">GitHub</a>
|
||||
<span class="pipe">|</span>
|
||||
<a href="mailto:river@rooks.dev" class="footer-link">river@rooks.dev</a>
|
||||
<span class="pipe">|</span>
|
||||
<a href="#" title="PGP: 0x4A8E92F1C0B3D4E7" class="footer-link">PGP</a>
|
||||
<span class="pipe">|</span>
|
||||
<a href="index.html" class="footer-link">Samples ↗</a>
|
||||
</nav>
|
||||
</footer>
|
||||
|
||||
</main>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user