Merge remote-tracking branch 'origin/main'

docs/Hero.tsx

@@ -1,16 +1,16 @@
 import cx from 'classnames'
-import { forwardRef, useEffect, useRef, useState } from 'react'
+import { AnchorHTMLAttributes, forwardRef, ReactNode, useEffect, useRef, useState } from 'react'
 import { animated, config, useSpring } from 'react-spring'
 import styles from './Hero.module.css'
 
 const subtitle = 'Accessible, Delightful, and Performant'
 
-const Link: React.FC<{
-  href?: string
-  target?: string
-  className?: string
-}> = forwardRef(
-  ({ children, className, ...props }, ref: React.Ref<HTMLAnchorElement>) => (
+interface LinkProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+  href: string;
+  children: ReactNode;
+}
+
+const Link = forwardRef<HTMLAnchorElement, LinkProps>(({ children, className, ...props }, ref) => (
     <a
       {...props}
       className={cx(
@@ -41,7 +41,7 @@ const Links = ({ className }: { className?: string }) => (
   </>
 )
 // The wrapping in <g> is because of Safari 🙄 https://bug-149617-attachments.webkit.org/attachment.cgi?id=262048
-const SvgText: React.FC<{ x?: string; y?: string; className?: string }> = ({
+const SvgText: React.FC<{ x?: string; y?: string; className?: string; children?: ReactNode }> = ({
   children,
   className,
   x = '23',

docs/style.css

@@ -13,7 +13,6 @@
 @layer base {
   :root {
     --rsbs-backdrop-bg: rgba(15, 23, 42, 0.7);
-    --rsbs-z-index: 3;
   }
 }
 

src/style.css

@@ -24,7 +24,7 @@
 [data-rsbs-overlay],
 [data-rsbs-backdrop],
 [data-rsbs-root]:after {
-  z-index: var(--rsbs-z-index, 3);;
+  z-index: var(--rsbs-z-index);
   overscroll-behavior: none;
   touch-action: none;
   position: fixed;