50 lines
2.7 KiB
Markdown
50 lines
2.7 KiB
Markdown
# Project Brief: Temporary Single-Page Portfolio (Landing Page)
|
|
|
|
**Project Type:** Single-Page "Under Construction" / Digital Business Card
|
|
**Design Philosophy:** High-signal, low-noise. Developer-centric minimalism. (Matches primary site spec)
|
|
|
|
## 1. Executive Summary
|
|
|
|
This is a temporary, single-page landing site to serve as a digital presence while the full web architecture is being developed. It must adhere strictly to the global design rules established for the main site (no glassmorphism, no glows, monospace-heavy typography, dark charcoal palette). The layout should be a simple, single-column document flow.
|
|
|
|
## 2. Layout & Structure
|
|
|
|
The page will be a single, centered column with a maximum width of `65ch` (characters) to ensure optimal reading density.
|
|
|
|
### A. Header (Identity)
|
|
|
|
* **Main Title (H1):** "River Rooks"
|
|
* **Subtitle/Status:** A monospaced, muted status line (e.g., "SYSTEMS ARCHITECTURE & CYBERSECURITY") paired with a rigid, square, 8x8px solid active-state indicator dot (using the primary accent color).
|
|
|
|
### B. The "Under Construction" Terminal Block
|
|
|
|
* **Component:** A terminal-style code block.
|
|
* **Style:** 1px solid border, slightly lighter surface background.
|
|
* **Content:** Must present the "under construction" status as a terminal command and stdout output.
|
|
* *Example prompt:* `$ cat /var/log/status.txt`
|
|
* *Example output:* `Under construction. Full site infrastructure is currently being provisioned. Routing traffic to temporary landing page...`
|
|
|
|
### C. "Whoami" Section (Biography)
|
|
|
|
* **Header (H2):** Clean sans-serif or bold monospace.
|
|
* **Content:** Standard prose paragraph establishing background (e.g., studying cybersecurity at the University of Alabama College of Engineering, focus on network forensics and self-hosted infrastructure).
|
|
|
|
### D. Active Stack (Skills & Tech)
|
|
|
|
* **Component:** A dense cluster of inline metadata tags.
|
|
* **Style:** Small, muted, monospaced font. Bracketed format preferred (e.g., `[#network-forensics]`, `[#docker-traefik]`, `[#arch-linux]`, `[#neovim]`).
|
|
|
|
### E. Footer (Contact & Links)
|
|
|
|
* **Layout:** A single monospaced line separated by structural pipes (`|`).
|
|
* **Links:** GitHub, Email, PGP Key.
|
|
* **Interaction:** Links must have an immediate hover state (e.g., background color snap) with zero transition delay. No floaty animations.
|
|
|
|
## 3. Strict Typography & Color Application
|
|
|
|
* **Canvas:** Deep slate/charcoal (e.g., `#0d0f12`)
|
|
* **Primary Text:** Off-white/light ash (Sans-serif: Inter or Geist)
|
|
* **Metadata/Terminal Text:** Muted gray (Monospace: IBM Plex Mono or JetBrains Mono)
|
|
* **Accent (Designer's Choice):** A high-visibility terminal color for the status dot and hover states.
|
|
* **Dividers:** Use simple 1px solid horizontal rules to separate the Header, Main Content, and Footer.
|