diff --git a/site/index.html b/site/index.html index 520996b..d4d1404 100644 --- a/site/index.html +++ b/site/index.html @@ -792,7 +792,110 @@ gap: 0; } } + /* ============================================ + TECH STACK ITEMS + ============================================ */ + .tech-item { + display: flex; + flex-direction: column; + align-items: center; + gap: 0.5rem; + padding: 1rem 1.25rem; + background: var(--witch-moon); + border-radius: 12px; + border: 2px solid transparent; + transition: all 0.3s ease; + min-width: 100px; + } + + .tech-item:hover { + transform: translateY(-4px); + border-color: var(--witch-plum); + box-shadow: 0 8px 20px rgba(43, 27, 61, 0.15); + } + + .tech-item i { + font-size: 2.5rem; + } + + .tech-item span { + font-size: 0.9rem; + font-weight: 600; + color: var(--witch-purple); + } + + @media (max-width: 480px) { + .tech-item { + min-width: 80px; + padding: 0.75rem 1rem; + } + + .tech-item i { + font-size: 2rem; + } + + .tech-item span { + font-size: 0.8rem; + } + } + + /* ============================================ + TECH STACK COLLAPSIBLE SECTIONS + ============================================ */ + .tech-category { + border: 2px solid var(--witch-mauve); + border-radius: 12px; + overflow: hidden; + background: rgba(255, 255, 255, 0.3); + } + + .tech-category summary { + padding: 1rem 1.5rem; + cursor: pointer; + display: flex; + align-items: center; + justify-content: center; + gap: 0.5rem; + font-size: 1.1rem; + font-weight: 600; + color: var(--witch-plum); + background: rgba(255, 255, 255, 0.5); + transition: background 0.3s ease; + list-style: none; + } + + .tech-category summary::-webkit-details-marker { + display: none; + } + + .tech-category summary::marker { + display: none; + content: ""; + } + + .tech-category summary .dropdown-icon { + transition: transform 0.3s ease; + font-size: 0.9rem; + } + + .tech-category[open] summary .dropdown-icon { + transform: rotate(90deg); + } + + .tech-category summary:hover { + background: rgba(255, 255, 255, 0.7); + } + + .tech-category-content { + padding: 1.5rem; + display: flex; + flex-wrap: wrap; + justify-content: center; + gap: 1rem; + } + + @@ -1336,6 +1439,279 @@ })(); + +
+

Our Tech Stack

+

+ The languages, frameworks, and tools we use to bring your projects to life. +

+ +
+ +
+ Languages +
+
+ + Bash +
+
+ + CSS +
+
+ + Go +
+
+ + HTML +
+
+ + Java +
+
+ + JavaScript +
+
+ + JSON +
+
+ + Kotlin +
+
+ + MDX +
+
+ + Python +
+
+ + Rust +
+
+ + TypeScript +
+
+ + YAML +
+
+
+ + +
+ Frameworks & Libraries +
+
+ + .NET +
+
+ + Angular +
+
+ + Astro +
+
+ + Discord.js +
+
+ + Express +
+
+ + Fastify +
+
+ + Next.js +
+
+ + Node.js +
+
+ + Prisma +
+
+ + Pydantic +
+
+ + React +
+
+ + Slack Bolt +
+
+ + Tauri +
+
+
+ + +
+ Databases +
+
+ + MongoDB +
+
+ + MySQL +
+
+ + PostgreSQL +
+
+ + Redis +
+
+ + SQLite +
+
+
+ + +
+ Cloud & Infrastructure +
+
+ + AWS S3 +
+
+ + AWS SES +
+
+ + Cloudflare R2 +
+
+ + Cloudflare Workers +
+
+ + Docker Compose +
+
+ + GitHub Actions +
+
+ + Gradle +
+
+ + Maven +
+
+ + NGINX +
+
+
+ + +
+ API Standards +
+
+ + AsyncAPI +
+
+ + OpenAPI +
+
+ + Swagger +
+
+
+ + +
+ Testing & Quality +
+
+ + Chai +
+
+ + Clippy +
+
+ + ESLint +
+
+ + Jest +
+
+ + pytest +
+
+ + Ruff +
+
+ + Vitest +
+
+
+ + +
+ Operating Systems +
+
+ + Arch +
+
+ + Ubuntu +
+
+ + Windows +
+
+
+
+
+ @@ -1553,7 +1929,7 @@
-
400+
+
675+
Discord Members