fix: clerk sponsorship cta in dark mode (#9630)

fix clerk sponsorship cta in dark mode

Author: astrotars

docs/src/pages/index.js

@@ -167,12 +167,15 @@ export default function Home() {
                 </Link>
               </div>
             </div>
-            <span className={styles.heroClerk}>
+            <div className={styles.heroClerk}>
               Looking for a hosted alternative?
-              <a href="https://clerk.com?utm_source=sponsorship&utm_medium=website&utm_campaign=authjs&utm_content=cta" target="_blank">
+              <a
+                href="https://clerk.com?utm_source=sponsorship&utm_medium=website&utm_campaign=authjs&utm_content=cta"
+                target="_blank"
+              >
                 Try Clerk →
               </a>
-            </span>
+            </div>
             <div className="hero-marquee">
               <ProviderMarquee />
             </div>

docs/src/pages/index.module.css

@@ -116,6 +116,10 @@
   text-align: center;
 }
 
+[data-theme="dark"] .heroClerk {
+  color: #fff;
+}
+
 .heroClerk {
   display: flex;
   align-items: center;
@@ -128,7 +132,3 @@
     z-index: 1000;
   }
 }
-
-[data-theme="dark"] .heroClerk {
-  color: #fff;
-}