Merge pull request #249 from TreasureProject/dev

Various updates
TreasureProject · Nov 10, 2023 · b7ef8ca · b7ef8ca
2 parents 8d56fc9 + 572215e
commit b7ef8ca
Show file tree

Hide file tree

Showing 59 changed files with 2,982 additions and 224 deletions.
diff --git a/.gitignore b/.gitignore
@@ -1,4 +1,5 @@
 node_modules
+.DS_Store
 
 /.cache
 /build

diff --git a/app/components/CartridgeSlider.tsx b/app/components/CartridgeSlider.tsx
@@ -1,4 +1,5 @@
 import React from "react";
+import { ArrowTopRightOnSquareIcon } from "@heroicons/react/24/solid";
 import { useKeenSlider } from "keen-slider/react";
 import { motion } from "framer-motion";
 import { twMerge } from "tailwind-merge";
@@ -111,8 +112,16 @@ export const CartridgeSlider = () => {
         ))}
       </div>
       <div className="mt-12 flex justify-center">
-        <CTAButton as="link" type="primary" to="/games" className="mx-auto">
-          View all games
+        <CTAButton
+          as="link"
+          type="primary"
+          to="https://app.treasure.lol/games"
+          rel="noopener noreferrer"
+          target="_blank"
+          className="mx-auto"
+        >
+          View all games{" "}
+          <ArrowTopRightOnSquareIcon className="ml-1.5 h-4 w-4 fill-ruby-200 [&>path]:stroke-ruby-200 [&>path]:stroke-[1] group-hover:[&>path]:stroke-white" />
         </CTAButton>
       </div>
     </div>

diff --git a/app/components/Footer.tsx b/app/components/Footer.tsx
@@ -131,7 +131,7 @@ export const Footer = () => {
                       {links.map(({ name, isExternal, href }) => (
                         <li
                           key={name}
-                          className="items-center justify-center space-x-1 sm:justify-start"
+                          className="items-center justify-center space-x-2 sm:justify-start"
                         >
                           {isExternal ? (
                             <a

diff --git a/app/components/Header.tsx b/app/components/Header.tsx
@@ -37,19 +37,11 @@ export const Header = () => {
                 >
                   Newsletter
                 </a>
-                <a
-                  href="https://magicswap.lol/"
-                  target="_blank"
-                  rel="noreferrer noopener"
-                  className="text-xs text-ruby-100 hover:text-ruby-200"
-                >
-                  MagicSwap
-                </a>
                 <button
                   onClick={openModal}
                   className="text-xs text-ruby-100 hover:text-ruby-200"
                 >
-                  Buy MAGIC
+                  Get MAGIC
                 </button>
               </div>
               <div className="flex space-x-6">
@@ -193,10 +185,12 @@ export const Header = () => {
             </Popover.Group>
             <div className="absolute right-4 hidden items-center sm:right-8 xl:right-12 xl:flex xl:space-x-8">
               <Link
-                to="/build"
-                className="inline-flex items-center space-x-2 rounded-lg border border-transparent bg-ruby-900 py-3.25 px-6.5 text-base font-bold text-white hover:bg-ruby-1000"
+                to="https://app.treasure.lol"
+                rel="noopener noreferrer"
+                target="_blank"
+                className="inline-flex items-center space-x-2 rounded-lg border border-transparent bg-ruby-900 py-3.25 px-6.5 text-lg font-bold text-white hover:bg-ruby-1000"
               >
-                Build with Treasure
+                Play Now
               </Link>
             </div>
           </div>
@@ -320,10 +314,12 @@ export const Header = () => {
                 </nav>
                 <div className="mt-6 px-5">
                   <Link
-                    to="/build"
-                    className="inline-flex w-full items-center justify-center space-x-2 rounded-lg border border-transparent bg-ruby-900 py-3.25 px-6.5 text-base font-bold text-white hover:bg-ruby-1000"
+                    to="https://app.treasure.lol"
+                    rel="noopener noreferrer"
+                    target="_blank"
+                    className="inline-flex w-full items-center justify-center space-x-2 rounded-lg border border-transparent bg-ruby-900 py-3.25 px-6.5 text-lg font-bold text-white hover:bg-ruby-1000"
                   >
-                    Build with Treasure
+                    Play Now
                   </Link>
                 </div>
               </div>

diff --git a/app/components/Icons.tsx b/app/components/Icons.tsx
@@ -145,9 +145,12 @@ export const BridgeIcon = ({ className }: { className?: string }) => (
   </svg>
 );
 
-export const TwitterIcon = ({ className }: { className?: string }) => (
-  <svg fill="currentColor" viewBox="0 0 24 24" className={className}>
-    <path d="M8.29 20.251c7.547 0 11.675-6.253 11.675-11.675 0-.178 0-.355-.012-.53A8.348 8.348 0 0022 5.92a8.19 8.19 0 01-2.357.646 4.118 4.118 0 001.804-2.27 8.224 8.224 0 01-2.605.996 4.107 4.107 0 00-6.993 3.743 11.65 11.65 0 01-8.457-4.287 4.106 4.106 0 001.27 5.477A4.072 4.072 0 012.8 9.713v.052a4.105 4.105 0 003.292 4.022 4.095 4.095 0 01-1.853.07 4.108 4.108 0 003.834 2.85A8.233 8.233 0 012 18.407a11.616 11.616 0 006.29 1.84" />
+export const XIcon = ({ className }: { className?: string }) => (
+  <svg fill="currentColor" viewBox="0 0 20 20" className={className}>
+    <path
+      d="M2.04069 2L8.48459 10.8249L2 18H3.45942L9.13667 11.7181L13.7237 18H18.6902L11.8837 8.67867L17.9195 2H16.4601L11.2317 7.78548L7.00716 2H2.04069ZM4.18688 3.10107H6.46849L16.5437 16.8988H14.2621L4.18688 3.10107Z"
+      fill="currentColor"
+    ></path>
   </svg>
 );
 
@@ -375,3 +378,29 @@ export const InteropIcon = ({ className }: { className?: string }) => (
     />
   </svg>
 );
+
+export const TreasureLogo = ({ className }: { className?: string }) => (
+  <svg
+    viewBox="0 0 94 116"
+    fill="none"
+    xmlns="http://www.w3.org/2000/svg"
+    className={className}
+  >
+    <path
+      d="M0.217285 36.1599V79.8637C0.217285 87.0986 4.09152 93.7718 10.356 97.3668L39.2325 113.995C43.8704 116.668 49.5642 116.668 54.21 113.995L83.0865 97.3668C89.3449 93.7494 93.2173 87.0762 93.2173 79.8637V36.1599C93.2173 28.9244 89.3449 22.2512 83.0865 18.6556L54.21 2.00531C49.5642 -0.668437 43.871 -0.668437 39.2325 2.00531L10.356 18.6332C4.09152 22.2506 0.217285 28.9244 0.217285 36.1599Z"
+      fill="#DC2626"
+    />
+    <path
+      d="M81.9787 56.8538L71.3718 53.2594C67.4768 51.9331 64.5708 48.6528 63.7603 44.631L59.271 22.5654C59.1596 22.0037 58.6687 21.5999 58.0817 21.5999C57.4947 21.5999 56.9965 22.0043 56.8851 22.5654L52.4031 44.631C51.5932 48.6528 48.6866 51.9331 44.7916 53.2594L34.1847 56.8538C33.6865 57.0112 33.3748 57.4834 33.3748 57.9997C33.3748 58.5161 33.7091 58.9658 34.1847 59.1456L44.7916 62.7407C48.6866 64.067 51.5926 67.3473 52.4031 71.3691L56.8851 93.4346C56.9965 93.9964 57.4947 94.4001 58.0817 94.4001C58.6687 94.4001 59.1596 93.9958 59.271 93.4346L63.7603 71.3691C64.5702 67.3473 67.4768 64.067 71.3718 62.7407L81.9787 59.1456C82.4769 58.9888 82.7886 58.5167 82.7886 57.9997C82.7886 57.4828 82.4543 57.0342 81.9787 56.8538Z"
+      fill="#FFFDF7"
+    />
+    <path
+      d="M24.9031 36.6097L28.6422 37.8681C30.0172 38.3403 31.058 39.4856 31.3253 40.9239L32.9013 48.7211C32.9458 48.9227 33.1242 49.0583 33.3325 49.0583C33.5328 49.0583 33.7118 48.9233 33.7563 48.7211L35.3323 40.9239C35.6295 39.508 36.6404 38.3403 38.0379 37.8681L41.777 36.6097C41.9554 36.5425 42.0668 36.3851 42.0668 36.2047C42.0668 36.0243 41.9554 35.8675 41.777 35.8003L38.0379 34.5418C36.6629 34.0697 35.6295 32.9238 35.3323 31.4861L33.7563 23.6889C33.7118 23.4867 33.5334 23.3517 33.3325 23.3517C33.1242 23.3517 32.9458 23.4861 32.9013 23.6889L31.3253 31.4861C31.0354 32.902 30.0172 34.0697 28.6422 34.5418L24.9031 35.8003C24.7247 35.8675 24.6133 36.0249 24.6133 36.2047C24.6133 36.3845 24.7247 36.5425 24.9031 36.6097Z"
+      fill="#FFFDF7"
+    />
+    <path
+      d="M33.6437 74.8969L28.6191 73.2116C26.7758 72.5827 25.4007 71.0319 25.0141 69.122L22.9034 58.674C22.8516 58.4046 22.6062 58.2249 22.3383 58.2249C22.063 58.2249 21.8182 58.4046 21.7731 58.674L19.6545 69.122C19.2752 71.0319 17.9001 72.5827 16.0495 73.2116L11.0322 74.8969C10.802 74.9641 10.6455 75.1893 10.6455 75.4362C10.6455 75.6832 10.8014 75.9084 11.0322 75.9756L16.0495 77.6608C17.9001 78.2898 19.2752 79.8406 19.6545 81.7505L21.7731 92.1985C21.8176 92.4678 22.063 92.6476 22.3383 92.6476C22.6056 92.6476 22.8291 92.4461 22.9034 92.1985L25.0141 81.7505C25.4007 79.8406 26.7758 78.2898 28.6191 77.6608L33.6437 75.9756C33.8666 75.9084 34.0304 75.6838 34.0304 75.4362C34.0304 75.1887 33.8672 74.9641 33.6437 74.8969Z"
+      fill="#FFFDF7"
+    />
+  </svg>
+);
diff --git a/app/components/Reviews.tsx b/app/components/Reviews.tsx
@@ -16,11 +16,11 @@ export function Tweet({
   const animationDelay = useMemo(() => {
     const possibleAnimationDelays = [
       "0s",
+      "0.1s",
       "0.15s",
       "0.25s",
-      "0.35s",
-      "0.45s",
-      "0.55s",
+      "0.3s",
+      "0.4s",
     ];
     return possibleAnimationDelays[
       Math.floor(Math.random() * possibleAnimationDelays.length)