Updated share link.

wasp-ai/src/client/Main.css

@@ -7,7 +7,7 @@ body {
 }
 
 .button {
-  @apply bg-orange-300 text-gray-700 font-bold py-3 px-6 rounded text-center hover:bg-orange-200 transition duration-150;
+  @apply font-bold py-3 px-6 rounded text-center transition duration-150 bg-orange-300 text-gray-700 hover:bg-orange-200;
 }
 .button.gray {
   @apply bg-slate-200 text-slate-600;
@@ -15,6 +15,9 @@ body {
 .button.yellow {
   @apply bg-yellow-400 text-yellow-900;
 }
+.button.light-blue {
+  @apply bg-sky-200 text-sky-600 hover:bg-sky-100
+}
 .button.sm {
   @apply text-sm py-2 px-4;
 }
@@ -61,7 +64,4 @@ textarea {
 
 .status-icon {
   @apply rounded-full w-[27px] h-[27px] flex items-center justify-center;
-}
-.copy-link {
-  @apply text-sky-700 hover:text-sky-600 bg-sky-200 bg-opacity-50 font-bold py-1 px-3 rounded;
 }

wasp-ai/src/client/pages/ResultPage.jsx

@@ -238,9 +238,6 @@ export const ResultPage = () => {
             <h2 className="text-xl font-bold text-gray-800">
               {appGenerationResult?.project?.name}
             </h2>
-            <div>
-              <CopyLink />
-            </div>
           </div>
           <button
             className="button gray block w-full mb-4 md:hidden"
@@ -262,6 +259,9 @@ export const ResultPage = () => {
                   The app is still being generated.
                 </small>
               )}
+              <div>
+                <ShareButton />
+              </div>
               <FileTree
                 paths={interestingFilePaths}
                 activeFilePath={activeFilePath}
@@ -443,7 +443,7 @@ function WarningAboutAI() {
   );
 }
 
-function CopyLink() {
+function ShareButton() {
   const [copying, setCopying] = useState(false);
   function copy() {
     navigator.clipboard.writeText(window.location.href);
@@ -453,7 +453,7 @@ function CopyLink() {
 
   return (
     <button
-      className="copy-link flex items-center justify-center gap-1"
+      className="button light-blue flex items-center justify-center gap-1 w-full mb-2"
       onClick={copy}
       disabled={copying}
     >
@@ -463,7 +463,7 @@ function CopyLink() {
         </span>
       ) : (
         <span>
-          Copy a sharable link{" "}
+          Copy a shareable link{" "}
           <PiCopyDuotone className="inline-block" size={20} />
         </span>
       )}