Merge pull request #13 from me-imfhd/main

new pr, with no conflicts
Solana-Hyperdrive · Nov 7, 2023 · 186da4c · 186da4c
2 parents f00c6e4 + 3571b93
commit 186da4c
Show file tree

Hide file tree

Showing 3 changed files with 34 additions and 17 deletions.
diff --git a/public/svgs/FeaturesStar.tsx b/public/svgs/FeaturesStar.tsx
@@ -3,16 +3,29 @@ import React from "react";
 export function FeaturesStar() {
   return (
     <svg
-      className="mr-1 inline-block h-4 w-4"
-      viewBox="0 0 26 26"
       xmlns="http://www.w3.org/2000/svg"
+      width="26"
+      height="26"
+      viewBox="0 0 26 26"
+      fill="none"
+      className=""
     >
       <g clip-path="url(#clip0_281_14784)">
         <path
           d="M8.25985 17.0578L5.82483 11.7007L0.467773 9.26571L5.82483 6.83069L8.25985 1.47363L10.6949 6.83069L16.0519 9.26571L10.6949 11.7007L8.25985 17.0578ZM17.0772 19.9286L15.8725 17.2372L13.1812 16.0325L15.8725 14.8022L17.0772 12.1365L18.3075 14.8022L20.9732 16.0325L18.3075 17.2372L17.0772 19.9286Z"
           fill="#5157E6"
         />
       </g>
+      <defs>
+        <clipPath id="clip0_281_14784">
+          <rect
+            width="24.6066"
+            height="24.6066"
+            fill="white"
+            transform="translate(0.467773 0.448242)"
+          />
+        </clipPath>
+      </defs>
     </svg>
   );
 }
diff --git a/src/components/LandingHero.tsx b/src/components/LandingHero.tsx
@@ -5,7 +5,7 @@ import { ArrowRight } from "lucide-react";
 export default function LandingHero() {
   return (
     <section className="flex items-center bg-background py-12 md:py-24 lg:pt-32 ">
-      <div className="container mx-auto flex flex-col items-center md:px-36 ">
+      <div className="container mx-auto flex flex-col items-center md:px-48 ">
         <div>
           <div className="md:px-2">
             <Button
@@ -18,25 +18,27 @@ export default function LandingHero() {
               <ArrowRight size={"1rem"} />
             </Button>
           </div>
-          <div className="flex flex-wrap justify-between">
-            <div className="text-5xl tracking-wide md:w-1/2 md:px-2 md:text-6xl md:leading-tight">
-              Web3 payments for the 
-              <span className="font-bold">  Internet.. 🌐</span>
+          <div className="flex flex-wrap justify-between md:flex-nowrap">
+            <div className="text-5xl tracking-wide md:w-1/2 md:px-2 md:text-[3.5rem] md:leading-tight">
+              Web3 payments for the
+              <span className="font-bold"> Internet.. 🌐</span>
             </div>
-            <div className="mt-3 flex flex-col justify-between gap-6 px-6 py-4 md:w-1/2 ">
-              <p className="text-base text-muted-foreground">
+            <div className="mt-3 flex flex-col gap-8 md:w-1/2  md:pl-16 ">
+              <p className="text-muted-foreground">
                 {"Appwrite's"} open-source platform lets you add Auth, DBs,
                 Functions and Storage to your product and build any application
                 at any scale, own your data, and use your preferred coding
                 languages and tools.
               </p>
               <div className="flex gap-6">
-                <Button size={"sm"} variant={"primary"}
-                className="text-slate-800 font-medium">
+                <Button size={"sm"} variant={"primary"} className="font-medium">
                   Get Started
                 </Button>
-                <Button variant={"outline"} size={"sm"}
-                className="border-0 text-white">
+                <Button
+                  variant={"outline"}
+                  size={"sm"}
+                  className="border-0 text-white"
+                >
                   Join the waitlist
                 </Button>
               </div>

diff --git a/src/components/WhatsFlitchPay.tsx b/src/components/WhatsFlitchPay.tsx
@@ -16,7 +16,7 @@ export function WhatsFlitchPay() {
         <HeadComponent />
         <div className="mt-14 flex flex-wrap gap-4 md:flex-nowrap md:px-14 md:text-lg">
           <div className="flex flex-col justify-between gap-8 rounded-md bg-secondary md:w-1/2 ">
-            <div className="flex flex-col justify-between gap-6  px-6 pt-6 md:px-14 md:pt-14">
+            <div className="flex flex-col justify-between gap-6  px-6 pt-6 md:pt-14">
               <div>
                 Sophisticated Checkouts
                 <span className="text-muted-foreground">
@@ -38,7 +38,7 @@ export function WhatsFlitchPay() {
             </div>
           </div>
           <div className="flex flex-col gap-12 rounded-md bg-secondary md:w-1/2 md:gap-16 ">
-            <div className="flex flex-col justify-between gap-8  px-6 pt-6 md:px-14 md:pt-14">
+            <div className="flex flex-col justify-between gap-8  px-6 pt-6 md:pt-14">
               <div>
                 On Make products & Sell
                 <span className="text-muted-foreground">
@@ -71,8 +71,10 @@ function HeadComponent() {
         className="mx-auto hidden rounded-full bg-gradient-to-r from-[#5157E6] to-[#FFB800] p-[1px] brightness-90 contrast-150 focus:outline-none focus:ring-blue-600 focus-visible:ring-2 dark:brightness-125 dark:contrast-100 sm:block"
         href="#features"
       >
-        <div className="group relative overflow-hidden rounded-full bg-background/80 px-3 py-1">
-          <FeaturesStar />
+        <div className="flex items-center rounded-full bg-background/80 px-3 py-1">
+          <div className="-mb-1">
+            <FeaturesStar />
+          </div>
           <span className="bg-gradient-to-r from-[#5157E6] to-[#FFB800] bg-clip-text text-transparent">
             many features, wow{" "}
           </span>