patx/afterdarklabs
improve portfolio for scanner
Commit c541888 · patx · 2026-08-26T21:32:48-04:00
Comments
No comments yet.
Diff
diff --git a/docs/index.html b/docs/index.html
index e273e77..3daa680 100644
--- a/docs/index.html
+++ b/docs/index.html
@@ -333,6 +333,11 @@
scroll-padding-inline: 1rem;
}
+ .portfolio-description {
+ display: block;
+ margin-top: 0.625rem;
+ }
+
.work-scroll-ready #work-scroller {
overflow: visible;
scroll-behavior: auto;
@@ -451,7 +456,7 @@
<span class="logo-font -mt-1 block text-xs tracking-[3px] text-[#ccff00]">LABS</span>
</span>
</a>
- <a href="mailto:[email protected]" target="_blank" rel="noopener noreferrer" class="shrink-0 rounded-2xl bg-[#ccff00] px-4 py-3 text-sm font-semibold text-black transition-colors hover:bg-white">Let's Talk</a>
+ <a href="mailto:[email protected]" class="shrink-0 rounded-2xl bg-[#ccff00] px-4 py-3 text-sm font-semibold text-black transition-colors hover:bg-white">Let's Talk</a>
</div>
<div class="hidden items-center justify-between lg:flex">
@@ -462,7 +467,7 @@
<span class="logo-font -mt-1 block text-sm tracking-[3px] text-[#ccff00]">LABS</span>
</div>
</a>
- <a href="mailto:[email protected]" target="_blank" rel="noopener noreferrer" class="rounded-2xl bg-[#ccff00] px-6 py-3 font-semibold text-black transition-colors hover:bg-white">Let's Talk</a>
+ <a href="mailto:[email protected]" class="rounded-2xl bg-[#ccff00] px-6 py-3 font-semibold text-black transition-colors hover:bg-white">Let's Talk</a>
</div>
</div>
</nav>
@@ -507,7 +512,10 @@
<img src="https://afterdarklabs.io/gardenfresh.webp?v=2" width="1200" height="702" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="Garden Fresh Wholesale ecommerce web app project by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">Garden Fresh Wholesale • Business Website • Local SEO strategy that increased customer acquisition by 50%</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">Garden Fresh Wholesale</span>
+ <span class="portfolio-description">Business website and local SEO strategy that increased customer acquisition by 50%.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
@@ -515,7 +523,10 @@
<img src="https://afterdarklabs.io/miadruck.webp?v=3" width="1200" height="681" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="Mia Druck real estate website project by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">Mia Druck • Real Estate Website • SEO and a custom API for current listings and sales</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">Mia Druck</span>
+ <span class="portfolio-description">Real estate website with SEO and a custom API for current listings and sales.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
@@ -523,7 +534,10 @@
<img src="https://afterdarklabs.io/coralvibe.webp?v=1" width="1200" height="678" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="Shopify store for Coral Vibe Florida project by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">Coral Vibe • Shopify Store • Ecommerce, ongoing product management, and social media marketing</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">Coral Vibe</span>
+ <span class="portfolio-description">Shopify store and support for ecommerce operations, product management, and social media marketing.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
@@ -531,7 +545,10 @@
<img src="https://afterdarklabs.io/prima.webp?v=1" width="1200" height="702" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="Prima Produce business website project by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">Prima Produce • Business Website • End-to-end web design, SEO, and brand identity</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">Prima Produce</span>
+ <span class="portfolio-description">Business website, including web design, SEO, and brand identity.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
@@ -539,15 +556,21 @@
<img src="https://afterdarklabs.io/frontlineboats.webp?v=1" width="1200" height="700" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="Frontline Boat Services marine services website project by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">Frontline Boat Services • Business Website • Local SEO, payment links, and an owner-managed photo gallery</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">Frontline Boat Services</span>
+ <span class="portfolio-description">Business website with local SEO, payment links, and an owner-managed photo gallery.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
<a href="https://voldservices.com" target="_blank" rel="noopener noreferrer" class="block w-full overflow-hidden rounded-t-3xl text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-[#ccff00] focus-visible:ring-offset-2 focus-visible:ring-offset-[#17212b]" aria-label="Visit Vold Services website">
- <img src="voldservices.webp" width="1200" height="702" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="Vold Services exterior cleaning website with a scroll-animated hero, designed by After Dark Labs">
+ <img src="https://afterdarklabs.io/voldservices.webp" width="1200" height="702" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="Vold Services exterior cleaning website with a scroll-animated hero, designed by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">Vold Services • Business Website • Scroll-animated hero and an owner-managed photo gallery</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">Vold Services</span>
+ <span class="portfolio-description">Business website with a scroll-animated hero and an owner-managed photo gallery.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
@@ -555,7 +578,10 @@
<img src="https://afterdarklabs.io/invoiceotter.webp?v=1" width="1200" height="673" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="Invoice Otter SaaS project by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">Invoice Otter • Mobile App • Subscriptions, integrated payments, a custom AI chatbot, and per-user customization</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">Invoice Otter</span>
+ <span class="portfolio-description">Mobile app for contractor invoicing with subscriptions, integrated payments, a custom AI chatbot, and per-user customization.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
@@ -563,31 +589,43 @@
<img src="https://afterdarklabs.io/vegy.webp?v=1" width="1200" height="702" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="Vegy wholesale ordering platform project by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">Vegy • SaaS Platform • Wholesale ordering, AI and email integrations, real-time updates, and advanced analytics</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">Vegy</span>
+ <span class="portfolio-description">Wholesale ordering with AI and email integrations, real-time updates, and advanced analytics.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
<a href="https://gitman.io" target="_blank" rel="noopener noreferrer" class="block w-full overflow-hidden rounded-t-3xl text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-[#ccff00] focus-visible:ring-offset-2 focus-visible:ring-offset-[#17212b]" aria-label="Visit GitMan.io website">
- <img src="gitman.webp" width="1200" height="702" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="GitMan.io open-source Git repository hosting platform by After Dark Labs">
+ <img src="https://afterdarklabs.io/gitman.webp" width="1200" height="702" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="GitMan.io open-source Git repository hosting platform by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">GitMan.io • Web App • Free, developer-first Git hosting with an old-school minimalist interface</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">GitMan.io</span>
+ <span class="portfolio-description">Free, developer-first web app for Git hosting with an old-school minimalist interface.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
<a href="https://harrisonerd.com/twig" target="_blank" rel="noopener noreferrer" class="block w-full overflow-hidden rounded-t-3xl text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-[#ccff00] focus-visible:ring-offset-2 focus-visible:ring-offset-[#17212b]" aria-label="Visit Twig website">
- <img src="twig-editor.webp" width="916" height="683" loading="lazy" decoding="async" class="aspect-video w-full object-cover" style="object-position: top;" alt="Twig editing a short Python file in a dark code editor window">
+ <img src="https://afterdarklabs.io/twig-editor.webp" width="916" height="683" loading="lazy" decoding="async" class="aspect-video w-full object-cover" style="object-position: top;" alt="Twig editing a short Python file in a dark code editor window">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">Twig • Custom Software • An ultra-minimal text editor built to be extremely fast and user-friendly</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">Twig Text Editor</span>
+ <span class="portfolio-description">Ultra-minimal code first text editor designed to be extremely fast and user-friendly.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
<a href="https://harrisonerd.com/micropie" target="_blank" rel="noopener noreferrer" class="block w-full overflow-hidden rounded-t-3xl text-left focus:outline-none focus-visible:ring-2 focus-visible:ring-[#ccff00] focus-visible:ring-offset-2 focus-visible:ring-offset-[#17212b]" aria-label="Visit MicroPie website">
- <img src="micropie.webp" width="1200" height="694" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="MicroPie ultra-micro ASGI framework project by After Dark Labs">
+ <img src="https://afterdarklabs.io/micropie.webp" width="1200" height="694" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="MicroPie ultra-micro ASGI framework project by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">MicroPie • Python Framework • A lightweight, open-source web application framework for Python</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">MicroPie</span>
+ <span class="portfolio-description">Lightweight, open-source web application framework for Python.</span>
+ </p>
</div>
</article>
<article class="w-[82vw] shrink-0 snap-start overflow-hidden rounded-3xl bg-zinc-950 sm:w-[28rem] md:w-[38rem]">
@@ -595,7 +633,10 @@
<img src="https://afterdarklabs.io/makeitpdf.webp?v=2" width="1200" height="694" loading="lazy" decoding="async" class="aspect-video w-full object-cover" alt="MakeItPDF image-to-PDF web app project by After Dark Labs">
</a>
<div class="p-6">
- <p class="text-sm font-medium text-[#ccff00]">MakeItPDF • Web App • A privacy-first, open-source tool for creating PDFs</p>
+ <p class="text-sm font-medium text-[#ccff00]">
+ <span class="block">MakeItPDF</span>
+ <span class="portfolio-description">Privacy-first, open-source web app for creating PDFs.</span>
+ </p>
</div>
</article>
</div>