From 5b1400e14b6370558fcd3bb105bf0d7d52da376d Mon Sep 17 00:00:00 2001
From: Cypro Freelance <110410268+Proxyy587@users.noreply.github.com>
Date: Fri, 26 Jul 2024 00:53:26 +0530
Subject: [PATCH] minor design changes

---
 components/shared/About.tsx        | 66 +++++++++++++--------------
 components/shared/HowItWorks.tsx   | 54 +++++++++++------------
 components/shared/Navbar.tsx       |  2 +-
 components/shared/Partners.tsx     | 71 ++++++++++++++++--------------
 components/shared/Testimonials.tsx |  2 +-
 5 files changed, 99 insertions(+), 96 deletions(-)

diff --git a/components/shared/About.tsx b/components/shared/About.tsx
index 30b5151..fad7e17 100644
--- a/components/shared/About.tsx
+++ b/components/shared/About.tsx
@@ -3,40 +3,40 @@ import React from "react";
 import Statistics from "./Statistics";
 
 const About = () => {
-  return (
-    <section id="about" className="container py-2 sm:py-9">
-      <div className="bg-accent/50 border rounded-lg py-12">
-        <div className="px-6 flex flex-col-reverse md:flex-row gap-8 md:gap-12">
-          <Image
-            src="/about.svg"
-            alt="aboutpicture"
-            width={300}
-            height={300}
-            className="w-[300px] object-contain rounded-lg"
-          />
+	return (
+		<section id="about" className="container py-2 sm:py-9">
+			<div className="bg-accent/50 border rounded-lg py-12">
+				<div className="px-6 flex flex-col-reverse md:flex-row gap-8 md:gap-12">
+					<Image
+						src="/about.svg"
+						alt="aboutpicture"
+						width={300}
+						height={300}
+						className="w-[300px] object-contain rounded-lg"
+					/>
 
-          <div className="flex flex-col justify-between">
-            <div className="pb-6">
-              <h2 className="text-3xl md:text-5xl font-bold">
-                About{" "}
-                <span className="bg-gradient-to-b from-green-200 to-primary text-transparent bg-clip-text">
-                  SVRJS!
-                </span>
-              </h2>
-              <p className="text-lg text-muted-foreground mt-4">
-                Host a webpage, run server-side JavaScript, use mods to expand
-                server functionality, or use it as a forward or reverse proxy.
-                SVRJS is a web server that runs on top of Node.JS, enabling
-                server-side JS on webpages. SVRJS also has an integrated log
-                viewer, log highlighter, and user management tool.
-              </p>
-            </div>
-            <Statistics />
-          </div>
-        </div>
-      </div>
-    </section>
-  );
+					<div className="flex flex-col justify-between">
+						<div className="pb-6">
+							<h2 className="text-3xl md:text-5xl font-bold">
+								About{" "}
+								<span className="bg-gradient-to-b from-green-300 to-primary text-transparent bg-clip-text">
+									SVRJS!
+								</span>
+							</h2>
+							<p className="text-lg text-muted-foreground mt-4">
+								Host a webpage, run server-side JavaScript, use mods to expand
+								server functionality, or use it as a forward or reverse proxy.
+								SVRJS is a web server that runs on top of Node.JS, enabling
+								server-side JS on webpages. SVRJS also has an integrated log
+								viewer, log highlighter, and user management tool.
+							</p>
+						</div>
+						<Statistics />
+					</div>
+				</div>
+			</div>
+		</section>
+	);
 };
 
 export default About;
diff --git a/components/shared/HowItWorks.tsx b/components/shared/HowItWorks.tsx
index abeec59..5e73a1a 100644
--- a/components/shared/HowItWorks.tsx
+++ b/components/shared/HowItWorks.tsx
@@ -3,33 +3,33 @@ import React from "react";
 import { Card, CardContent, CardHeader, CardTitle } from "../ui/card";
 
 const HowItWorks = () => {
-  return (
-    <section className="container text-center py-12 sm:py-24">
-      <h2 className="text-3xl md:text-5xl font-bold">
-        Accelerate your{" "}
-        <span className="bg-gradient-to-b from-green-200 to-primary text-transparent bg-clip-text">
-          development
-        </span>
-      </h2>
-      <p className="md:w-3/4 mx-auto mt-4 mb-8 text-xl text-muted-foreground">
-        Beautifully designed components that you can copy and paste into your
-        apps. Accessible. Customizable. Open Source.
-      </p>
-      <div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
-        {Features.map(({ icon, title, description }) => (
-          <Card key={title} className="bg-muted/50">
-            <CardHeader>
-              <CardTitle className="grid gap-4 place-items-center">
-                {icon}
-                {title}
-              </CardTitle>
-            </CardHeader>
-            <CardContent>{description}</CardContent>
-          </Card>
-        ))}
-      </div>
-    </section>
-  );
+	return (
+		<section className="container text-center py-12 sm:py-24">
+			<h2 className="text-3xl md:text-5xl font-bold">
+				Accelerate your{" "}
+				<span className="bg-gradient-to-b from-green-300 to-primary text-transparent bg-clip-text">
+					development
+				</span>
+			</h2>
+			<p className="md:w-3/4 mx-auto mt-4 mb-8 text-xl text-muted-foreground">
+				Beautifully designed components that you can copy and paste into your
+				apps. Accessible. Customizable. Open Source.
+			</p>
+			<div className="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-4 gap-8">
+				{Features.map(({ icon, title, description }) => (
+					<Card key={title} className="bg-muted/50">
+						<CardHeader>
+							<CardTitle className="grid gap-4 place-items-center">
+								{icon}
+								{title}
+							</CardTitle>
+						</CardHeader>
+						<CardContent>{description}</CardContent>
+					</Card>
+				))}
+			</div>
+		</section>
+	);
 };
 
 export default HowItWorks;
diff --git a/components/shared/Navbar.tsx b/components/shared/Navbar.tsx
index 228387b..3df247b 100644
--- a/components/shared/Navbar.tsx
+++ b/components/shared/Navbar.tsx
@@ -38,7 +38,7 @@ const Navbar = () => {
 								href={href}
 								target={target}
 								className={`text-[17px] tracking-tight ${
-									pathname == href ? "bg-accent/40" : ""
+									pathname == href ? "bg-muted-foreground/20" : ""
 								} ${buttonVariants({
 									variant: "ghost",
 								})}`}
diff --git a/components/shared/Partners.tsx b/components/shared/Partners.tsx
index b891fa9..c6d3c48 100644
--- a/components/shared/Partners.tsx
+++ b/components/shared/Partners.tsx
@@ -6,41 +6,44 @@ import Link from "next/link";
 import { useRouter } from "next/navigation";
 
 const Partners = () => {
-  const router = useRouter();
-  const handleClick = () => {
-    router.push("/docs");
-  };
-  return (
-    <section
-      id="partners"
-      className="wrapper container py-24 md:py-28 gap-4 flex flex-col"
-    >
-      <h2 className="text-3xl md:text-5xl font-bold mb-6 text-black dark:bg-clip-text dark:text-transparent dark:bg-gradient-to-b dark:from-white dark:to-neutral-400">
-        SVRJS in action
-      </h2>
-      <div className="w-full flex-start flex-row">
-        <div className="flex max-md:flex-col items-center justify-start gap-4">
-          <h2 className="text-lg font-medium bg-accent/60 px-2 py-2 rounded-md">
-            Process of setting up a WordPress website running on SVR.JS.
-          </h2>
-          <Button
-            onClick={handleClick}
-            className="flex-center font-bold max-md:w-full max-w-xl"
-          >
-            Docs <ArrowUpRight />
-          </Button>
-        </div>
-      </div>
+	const router = useRouter();
+	const handleClick = () => {
+		router.push("/docs");
+	};
+	return (
+		<section
+			id="partners"
+			className="wrapper container py-24 md:py-28 gap-4 flex flex-col"
+		>
+			<h2 className="text-3xl md:text-5xl font-bold text-start">
+				<span className="bg-gradient-to-b from-green-300 to-primary text-transparent bg-clip-text">
+					SVRJS
+				</span>{" "}
+				in action
+			</h2>
+			<div className="w-full flex-start flex-row">
+				<div className="flex max-md:flex-col items-center justify-start gap-4">
+					<h2 className="text-lg font-medium bg-accent/60 px-2 py-2 rounded-md">
+						Process of setting up a WordPress website running on SVR.JS.
+					</h2>
+					<Button
+						onClick={handleClick}
+						className="flex-center font-bold max-md:w-full max-w-xl"
+					>
+						Docs <ArrowUpRight />
+					</Button>
+				</div>
+			</div>
 
-      <video
-        src="/svgaction.mp4"
-        className="rounded-xl aspect-video bg-[#09090b]"
-        controls
-        poster="/poster.svg"
-      ></video>
-      <hr className="w-full h-1" />
-    </section>
-  );
+			<video
+				src="/svgaction.mp4"
+				className="rounded-xl aspect-video bg-[#09090b]"
+				controls
+				poster="/poster.svg"
+			></video>
+			<hr className="w-full h-1" />
+		</section>
+	);
 };
 
 export default Partners;
diff --git a/components/shared/Testimonials.tsx b/components/shared/Testimonials.tsx
index 22aa629..66e504e 100644
--- a/components/shared/Testimonials.tsx
+++ b/components/shared/Testimonials.tsx
@@ -81,7 +81,7 @@ const Testimonials = () => {
 			</div>
 			<h1 className="text-3xl md:text-5xl font-bold text-center">
 				Hear it from{" "}
-				<span className="bg-gradient-to-b from-green-200 to-primary text-transparent bg-clip-text">
+				<span className="bg-gradient-to-b from-green-300 to-primary text-transparent bg-clip-text">
 					our users
 				</span>
 			</h1>