minor design changes
This commit is contained in:
Cypro Freelance
parent
abd8179815
commit
5b1400e14b
5 changed files with 99 additions and 96 deletions
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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",
|
||||
})}`}
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
|
|
|||
|
|
@ -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>
|
||||
|
|
|
|||
Loading…
Reference in a new issue