diff --git a/css/main.css b/css/main.css index 7e46d05..6bef540 100644 --- a/css/main.css +++ b/css/main.css @@ -1696,6 +1696,117 @@ body:has(.waka) { margin: 1.4rem 0 0; } +/* ---- collapsible dropdown sections (details/summary) ---- */ +details.waka-section { + /* keep the card padding tight when collapsed; expands via [open] below */ + padding-bottom: 1.15rem; + transition: padding-bottom 0.15s ease; +} + +details.waka-section[open] { + padding-bottom: 1.35rem; +} + +/* The clickable header row */ +summary.section-title { + display: flex; + align-items: center; + justify-content: space-between; + gap: 0.5rem; + cursor: pointer; + list-style: none; + user-select: none; + margin-bottom: 0; + transition: margin-bottom 0.15s ease, color 0.15s ease; +} + +/* Hide the native disclosure triangle (both engines) */ +summary.section-title::-webkit-details-marker { + display: none; +} + +summary.section-title::marker { + content: ""; +} + +summary.section-title:hover { + color: rgb(var(--accent-rgb)); +} + +summary.section-title:focus-visible { + outline: 2px solid rgb(var(--accent-rgb)); + outline-offset: 3px; + border-radius: 6px; +} + +/* Custom chevron that flips when the section is open */ +summary.section-title::after { + content: ""; + flex: none; + width: 0.5rem; + height: 0.5rem; + margin-right: 0.15rem; + border-right: 2px solid currentColor; + border-bottom: 2px solid currentColor; + transform: rotate(45deg); + transition: transform 0.2s ease; +} + +details.waka-section[open] > summary.section-title { + margin-bottom: 1rem; +} + +details.waka-section[open] > summary.section-title::after { + transform: rotate(-135deg); +} + +/* Tech-stack icons sit inside a collapsible card now: drop the big + page-bottom padding the standalone .dev-info block used. */ +.tech-stack .dev-info { + padding-bottom: 0; + justify-content: flex-start; +} + +/* ---- hardware spec list ---- */ +.hw-intro { + margin: 0 0 0.9rem; + font-size: 0.8rem; + color: var(--subtext-0); +} + +.hw-list { + display: flex; + flex-direction: column; + gap: 0.55rem; + margin: 0; +} + +.hw-row { + display: grid; + grid-template-columns: 8rem 1fr; + gap: 0.7rem; + align-items: baseline; +} + +.hw-row dt { + font-size: 0.72rem; + text-transform: uppercase; + letter-spacing: 0.05em; + color: var(--subtext-0); +} + +.hw-row dd { + margin: 0; + font-size: 0.88rem; + color: var(--text); +} + +@media (max-width: 560px) { + .hw-row { + grid-template-columns: 6rem 1fr; + } +} + /* ============================================================ 14. TERMINAL HOMEPAGE (+ 88x31 button wall) diff --git a/dev-info/index.html b/dev-info/index.html index 84f72eb..f1e4d18 100644 --- a/dev-info/index.html +++ b/dev-info/index.html @@ -100,7 +100,9 @@ -
+
+ Tech Stack +
-
+ +
+ + +
+ Hardware +

This is the beast setup I daily-drive. ✨

+
+
+
CPU
+
AMD Ryzen 9 9950x3d 4.3 GHz 16-Core Processor
+
+
+
GPU
+
XFX Speedster MERC 310 Black Edition Radeon RX 7900 XTX 24 GB Video Card
+
+
+
RAM
+
Corsair Vengeance 64 GB (2 x 32 GB) DDR5-6000 CL40 Memory
+
+
+
Storage
+
2x 1 TB NVMe + 10TB HDD
+
+
+
Motherboard
+
Gigabyte B850M AORUS ELITE WIFI6E ICE Micro ATX AM5 Motherboard
+
+
+
Cooling
+
Thermalright Aqua Elite V3 66.17 CFM Liquid CPU Cooler
+
+
+
Keyboard
+
Akko Sakura Miku 5108B Plus
+
+
+
Mouse
+
Logitech G502 X Gaming Lightspeed Wireless
+
+
+
Monitor(s)
+
Gigabyte G34WQCP 34.0" 3440 x 1440 180 Hz Curved Monitor
+
+
+
Headphones
+
Yowu Cat Ear Headphones Hatsune Miku NX
+
+
+
Microphone
+
Aokeo AK-60 USB Microphone
+
+
+
OS
+
Arch Linux | Windows 11
+
+
+
@@ -201,26 +261,26 @@
- + - +
- + - +

Tracked automatically with