Add Manifold Markets logo on signed out home.

web/components/feed-create.tsx

@@ -16,8 +16,8 @@ export function FeedPromo(props: { hotContracts: Contract[] }) {
 
   return (
     <>
-      <Col className="m-6 mb-1 text-center sm:m-12">
+      <Col className="my-6 rounded-xl bg-white py-12 text-center sm:m-12">
-        <h1 className="mt-4 text-4xl sm:mt-5 sm:text-6xl lg:mt-6 xl:text-6xl">
+        <h1 className="text-4xl sm:text-6xl xl:text-6xl">
           <div className="font-semibold sm:mb-2">
             A{' '}
             <span className="bg-gradient-to-r from-teal-400 to-green-400 bg-clip-text font-bold text-transparent">
@@ -48,8 +48,6 @@ export function FeedPromo(props: { hotContracts: Contract[] }) {
         </button>{' '}
       </Col>
 
-      <Spacer h={12} />
-
       <Row className="m-4 mb-6 items-center gap-1 text-xl font-semibold text-gray-800">
         <SparklesIcon className="inline h-5 w-5" aria-hidden="true" />
         Trending today

web/components/nav/manifold-logo.tsx

@@ -8,8 +8,9 @@ export function ManifoldLogo(props: {
   className?: string
   darkBackground?: boolean
   hideText?: boolean
+  twoLine?: boolean
 }) {
-  const { darkBackground, className, hideText } = props
+  const { darkBackground, className, hideText, twoLine } = props
 
   const user = useUser()
 
@@ -26,8 +27,7 @@ export function ManifoldLogo(props: {
         {!hideText &&
           (ENV_CONFIG.navbarLogoPath ? (
             <img src={ENV_CONFIG.navbarLogoPath} width={245} height={45} />
-          ) : (
+          ) : twoLine ? (
-            <>
             <div
               className={clsx(
                 'font-major-mono mt-1 text-lg lowercase text-gray-900',
@@ -38,7 +38,15 @@ export function ManifoldLogo(props: {
               <br />
               Markets
             </div>
-            </>
+          ) : (
+            <div
+              className={clsx(
+                'font-major-mono mt-2 text-2xl lowercase text-gray-900 md:whitespace-nowrap',
+                darkBackground && 'text-white'
+              )}
+            >
+              Manifold Markets
+            </div>
           ))}
       </a>
     </Link>

web/components/nav/sidebar.tsx

@@ -105,7 +105,7 @@ export default function Sidebar() {
   return (
     <nav aria-label="Sidebar" className="sticky top-4 divide-gray-300 pl-2">
       <div className="space-y-1 pb-6">
-        <ManifoldLogo />
+        <ManifoldLogo twoLine />
       </div>
 
       <div className="mb-2" style={{ minHeight: 80 }}>

web/components/page.tsx

@@ -19,7 +19,7 @@ export function Page(props: {
         )}
       >
         <div className="hidden lg:col-span-2 lg:block">
-          {assertUser !== 'signed-out' && <Sidebar />}
+          <Sidebar />
         </div>
         <main
           className={clsx(

web/pages/index.tsx

@@ -6,7 +6,7 @@ import { Page } from '../components/page'
 import { FeedPromo } from '../components/feed-create'
 import { Col } from '../components/layout/col'
 import { useUser } from '../hooks/use-user'
-import { SiteLink } from '../components/site-link'
+import { ManifoldLogo } from '../components/nav/manifold-logo'
 
 export async function getStaticProps() {
   const hotContracts = (await getHotContracts().catch(() => [])) ?? []
@@ -29,15 +29,18 @@ const Home = (props: { hotContracts: Contract[] }) => {
 
   return (
     <Page assertUser="signed-out">
+      <div className="px-4 pt-2 md:mt-0 lg:hidden">
+        <ManifoldLogo />
+      </div>
       <Col className="items-center">
         <Col className="max-w-3xl">
           <FeedPromo hotContracts={hotContracts ?? []} />
-          <p className="mt-6 text-gray-500">
+          {/* <p className="mt-6 text-gray-500">
             View{' '}
             <SiteLink href="/markets" className="font-bold text-gray-700">
               all markets
             </SiteLink>
-          </p>
+          </p> */}
         </Col>
       </Col>
     </Page>