From 89b05be5ec7c71dadedfa5af7fce6d9f4bcfc048 Mon Sep 17 00:00:00 2001
From: Austin Chen <akrolsmir@gmail.com>
Date: Wed, 18 May 2022 11:57:22 -0400
Subject: [PATCH] Tweak "Ask a question" button VisD

---
 web/components/nav/sidebar.tsx | 23 +++++++++++++----------
 1 file changed, 13 insertions(+), 10 deletions(-)

diff --git a/web/components/nav/sidebar.tsx b/web/components/nav/sidebar.tsx
index 1a8a0ba3..77faac30 100644
--- a/web/components/nav/sidebar.tsx
+++ b/web/components/nav/sidebar.tsx
@@ -8,6 +8,7 @@ import {
   HeartIcon,
   PresentationChartLineIcon,
   ChatAltIcon,
+  SparklesIcon,
 } from '@heroicons/react/outline'
 import clsx from 'clsx'
 import _ from 'lodash'
@@ -20,6 +21,7 @@ import { ManifoldLogo } from './manifold-logo'
 import { MenuButton } from './menu'
 import { getNavigationOptions, ProfileSummary } from './profile-menu'
 import { useHasCreatedContractToday } from 'web/hooks/use-has-created-contract-today'
+import { Row } from '../layout/row'
 
 // Create an icon from the url of an image
 function IconFromUrl(url: string): React.ComponentType<{ className?: string }> {
@@ -178,23 +180,24 @@ export default function Sidebar(props: { className?: string }) {
         />
       </div>
 
-      {user && deservesDailyFreeMarket ? (
-        <div className=" mt-4 text-center text-indigo-500">
-          Use your daily free market! 🎉
-        </div>
-      ) : (
-        <div />
-      )}
-
       {user && (
         <div className={'aligncenter flex justify-center'}>
           <Link href={'/create'} passHref>
-            <button className="btn btn-md mt-4 border-0 bg-indigo-500 capitalize hover:bg-indigo-700">
-              Ask question
+            <button className="mx-auto mt-4 -ml-1 w-full rounded-md border border-transparent bg-gradient-to-r from-purple-500 via-violet-500 to-indigo-500 py-2.5 text-base font-semibold text-white shadow-sm hover:from-purple-700 hover:via-violet-700 hover:to-indigo-700">
+              Ask a question
             </button>
           </Link>
         </div>
       )}
+
+      {user && deservesDailyFreeMarket && (
+        <Row className="mt-2 justify-center">
+          <Row className="gap-1 align-middle text-sm text-indigo-400">
+            Daily free market
+            <SparklesIcon className="mt-0.5 h-4 w-4" aria-hidden="true" />
+          </Row>
+        </Row>
+      )}
     </nav>
   )
 }