From 5343c3f42bf6419b26f88d8f8eccb0fb73511ade Mon Sep 17 00:00:00 2001
From: Jonathan Hefner <jonathan@hefner.pro>
Date: Fri, 27 Mar 2026 10:05:14 -0500
Subject: [PATCH] Add `noZoom` to logo carousel images

Mintlify enables click-to-zoom on all `<img>` elements by default. This
caused clicking a carousel logo to both open the vendor link in a new
tab AND zoom the logo to fullscreen in the original tab. Adding `noZoom`
disables the lightbox so only the link navigation fires.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
---
 docs/snippets/LogoCarousel.jsx | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/docs/snippets/LogoCarousel.jsx b/docs/snippets/LogoCarousel.jsx
index c7338bc..d6121fd 100644
--- a/docs/snippets/LogoCarousel.jsx
+++ b/docs/snippets/LogoCarousel.jsx
@@ -291,8 +291,8 @@ export const LogoCarousel = () => {
         <div className="logo-carousel-track" style={{ animation: 'logo-scroll 50s linear infinite' }}>
           {row1Doubled.map((logo, i) => (
             <a key={`${logo.name}-${i}`} href={logo.url} style={{ textDecoration: 'none', border: 'none' }}>
-              <img className="block dark:hidden object-contain" style={{ width: logo.width || '150px', maxWidth: '100%' }} src={logo.lightSrc} alt={logo.name} />
-              <img className="hidden dark:block object-contain" style={{ width: logo.width || '150px', maxWidth: '100%' }} src={logo.darkSrc} alt={logo.name} />
+              <img className="block dark:hidden object-contain" style={{ width: logo.width || '150px', maxWidth: '100%' }} src={logo.lightSrc} alt={logo.name} noZoom />
+              <img className="hidden dark:block object-contain" style={{ width: logo.width || '150px', maxWidth: '100%' }} src={logo.darkSrc} alt={logo.name} noZoom />
             </a>
           ))}
         </div>
@@ -301,8 +301,8 @@ export const LogoCarousel = () => {
         <div className="logo-carousel-track" style={{ animation: 'logo-scroll 60s linear infinite reverse' }}>
           {row2Doubled.map((logo, i) => (
             <a key={`${logo.name}-${i}`} href={logo.url} style={{ textDecoration: 'none', border: 'none' }}>
-              <img className="block dark:hidden object-contain" style={{ width: logo.width || '150px', maxWidth: '100%' }} src={logo.lightSrc} alt={logo.name} />
-              <img className="hidden dark:block object-contain" style={{ width: logo.width || '150px', maxWidth: '100%' }} src={logo.darkSrc} alt={logo.name} />
+              <img className="block dark:hidden object-contain" style={{ width: logo.width || '150px', maxWidth: '100%' }} src={logo.lightSrc} alt={logo.name} noZoom />
+              <img className="hidden dark:block object-contain" style={{ width: logo.width || '150px', maxWidth: '100%' }} src={logo.darkSrc} alt={logo.name} noZoom />
             </a>
           ))}
         </div>