/* ======================================================
Layout Foundation
====================================================== */
/* Main Content Wrapper */
div.projects-wrapper.w3-content.w3-padding-64 {
max-width: 1100px;
}
/* Section Header */
div.projects-header.w3-margin-bottom {
h1.w3-xxxlarge.w3-margin-bottom { text { Projects } }
p.w3-large.w3-opacity {
text { Selected engineering projects focused on infrastructure, UI systems, and runtime abstraction. }
}
}
/* ======================================================
Project Card Component (Clean Professional Layout)
====================================================== */
q-template project-card {
div.w3-card.w3-round-large.w3-margin-bottom.w3-theme-d3 {
div.w3-padding-32 {
/* Title Row */
div.w3-margin-bottom {
h2.w3-xlarge.w3-margin-top.w3-margin-bottom {
slot { title }
}
}
/* Primary Description */
blockquote,p.w3-margin-bottom {
slot { description }
}
blockquote,p.w3-margin-bottom {
slot { extended }
}
/* Divider */
hr.w3-border-opacity.w3-margin-top.w3-margin-bottom { }
/* Tech Stack / Meta */
div.w3-small.w3-opacity {
slot { name: "meta" }
}
}
}
}
/* ======================================================
Projects Section
====================================================== */
div.projects-wrapper {
div.projects-header { }
project-card {
span { slot: "title" text { RouterUI } }
span { slot: "description" text { Browser-based control plane for routing, firewall policies, and segmented network orchestration. } }
span { slot: "extended" text { Abstracts nftables, iptables, advanced routing constructs, and namespace-aware topologies into a deterministic interface while preserving low-level control and precision. Designed for infrastructure engineers who require full visibility without sacrificing usability. } }
span { slot: "meta" text { nftables • iptables • policy routing • namespace isolation • Linux networking } }
}
project-card {
span { slot: "title" text { LCARS Launcher } }
span { slot: "description" text { Plasma-integrated command interface inspired by LCARS design principles. } }
span { slot: "extended" text { Provides structured system execution, URL dispatch, and shell integration through a stylized but production-capable control surface. Designed for live system interaction while maintaining modular separation of execution logic. } }
span { slot: "meta" text { KDE Plasma 6 • shell orchestration • runtime hooks • system interface design } }
}
project-card {
span { slot: "title" text { q-html.js } }
span { slot: "description" text { Declarative meta-markup language compiling structured syntax into native HTML. } }
span { slot: "extended" text { Implements deterministic tokenization and structured parsing to transform concise component definitions into semantic HTML. Supports slot injection, nested composition, and multi-tag grouping while maintaining minimal runtime overhead. } }
span { slot: "meta" text { tokenizer • structured parser • Web Components • slot injection • compilation pipeline } }
}
project-card {
span { slot: "title" text { Blockwars30 } }
span { slot: "description" text { Strategic puzzle-battle engine built with Qt/QML. } }
span { slot: "extended" text { Features modular buff stacking, turn-based state management, and extensible hero-card systems. Emphasizes clean separation of rendering, game logic, and state mutation through polymorphic engine design. } }
span { slot: "meta" text { Qt 6 • QML • state engine • polymorphic systems • modular gameplay } }
}
project-card {
span { slot: "title" text { CSS Smart Editor } }
span { slot: "description" text { Deterministic CSS transformation engine driven by structured natural-language input. } }
span { slot: "extended" text { Rewrites style rules via structured parsing and controlled mutation logic without relying on LLM inference. Preserves semantic integrity while enabling safe programmatic manipulation of the CSSOM and Typed OM APIs. } }
span { slot: "meta" text { CSSOM • Typed OM • rule transformation • deterministic rewrite engine } }
}
}