docs: Add configurable padding to docs header logo (supabase#39615)

* Add configurable padding to docs header logo

* ci: Autofix updates from GitHub workflow

* tweak

---------

Co-authored-by: alaister <[email protected]>
Co-authored-by: Alaister Young <[email protected]>

Author: ChrisChinchilla

apps/docs/components/Navigation/NavigationMenu/TopNavBar.tsx

@@ -7,6 +7,7 @@ import { memo, useState } from 'react'
 // End of third-party imports
 
 import { useIsLoggedIn, useIsUserLoading, useUser } from 'common'
+import { isFeatureEnabled } from 'common/enabled-features'
 import { Button, buttonVariants, cn } from 'ui'
 import { AuthenticatedDropdownMenu, CommandMenuTrigger } from 'ui-patterns'
 import { getCustomContent } from '../../../lib/custom-content/getCustomContent'
@@ -16,6 +17,8 @@ import useDropdownMenu from './useDropdownMenu'
 const GlobalMobileMenu = dynamic(() => import('./GlobalMobileMenu'))
 const TopNavDropdown = dynamic(() => import('./TopNavDropdown'))
 
+const largeLogo = isFeatureEnabled('branding:large_logo')
+
 const TopNavBar: FC = () => {
   const isLoggedIn = useIsLoggedIn()
   const isUserLoading = useIsUserLoading()
@@ -121,7 +124,7 @@ const HeaderLogo = memo(() => {
       )}
     >
       <Image
-        className="hidden dark:block !m-0"
+        className={cn('hidden dark:block !m-0', largeLogo && 'h-[36px]')}
         src={navigationLogo?.dark ?? '/docs/supabase-dark.svg'}
         priority={true}
         loading="eager"
@@ -130,7 +133,7 @@ const HeaderLogo = memo(() => {
         alt="Supabase wordmark"
       />
       <Image
-        className="block dark:hidden !m-0"
+        className={cn('block dark:hidden !m-0', largeLogo && 'h-[36px]')}
         src={navigationLogo?.light ?? '/docs/supabase-light.svg'}
         priority={true}
         loading="eager"