ApiKeysIllustrationWithOverlay() — supabase Function Reference

Source Code

apps/studio/components/interfaces/APIKeys/ApiKeysIllustrations.tsx lines 92–108

const ApiKeysIllustrationWithOverlay = () => {
  return (
    <>
      {/* Gradient overlay - horizontal on desktop, vertical on mobile */}
      <div
        className="absolute inset-x-0 bottom-0 h-1/2 xl:h-full xl:inset-x-auto xl:-right-16 xl:top-3 w-full xl:w-2/3
        bg-gradient-to-t xl:bg-gradient-to-l
        from-background-alternative via-background-alternative/90 via-[5%] to-transparent
        z-[3] pointer-events-none xl:max-w-[500px]"
      />

      <div className="absolute scale-100 left-10 -bottom-14 w-[720px] xl:w-[500px] xl:left-auto xl:-right-[200px] 2xl:-right-16 xl:top-[21px] xl:scale-75">
        <ApiKeysTableIllustration />
      </div>
    </>
  )
}