Update Free plan button copy and styles in onboarding plan selection screen

Author: MananTank

apps/dashboard/src/app/login/onboarding/ChoosePlan.tsx

@@ -2,7 +2,6 @@
 
 import { PricingCard } from "@/components/blocks/pricing-card";
 import { Button } from "@/components/ui/button";
-import { ArrowRightIcon } from "lucide-react";
 import { TitleAndDescription } from "./Title";
 
 export function OnboardingChoosePlan(props: {
@@ -20,7 +19,7 @@ export function OnboardingChoosePlan(props: {
 
       <div className="h-4" />
 
-      <div className="grid grid-cols-1 gap-6 md:grid-cols-2 md:gap-4">
+      <div className="grid grid-cols-1 gap-6 md:grid-cols-2 md:gap-5">
         <PricingCard
           billingPlan="starter"
           teamSlug={props.teamSlug}
@@ -51,17 +50,20 @@ export function OnboardingChoosePlan(props: {
         />
       </div>
 
-      <div className="h-4" />
+      <div className="h-5" />
 
-      <div className="flex justify-center">
-        <Button
-          variant="link"
-          onClick={props.skipPlan}
-          className="inline-flex translate-x-2 items-center gap-2 text-muted-foreground"
-        >
-          Continue with Free Plan <ArrowRightIcon className="size-4" />
-        </Button>
-      </div>
+      <Button
+        variant="outline"
+        onClick={props.skipPlan}
+        className="relative h-auto w-full items-center gap-2 rounded-xl bg-muted/50 py-2.5"
+      >
+        <span className="flex flex-col gap-0.5">
+          <span className="text-base text-foreground">Skip for Now</span>
+          <span className="text-muted-foreground text-sm">
+            Limited Access To Services
+          </span>
+        </span>
+      </Button>
     </div>
   );
 }