init
This commit is contained in:
Reihan
commit
e56a469cfa
45
.gitignore
vendored
Normal file
45
.gitignore
vendored
Normal file
@ -0,0 +1,45 @@
|
||||
# See https://help.github.com/articles/ignoring-files/ for more about ignoring files.
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
/.pnp
|
||||
.pnp.*
|
||||
.yarn/*
|
||||
!.yarn/patches
|
||||
!.yarn/plugins
|
||||
!.yarn/releases
|
||||
!.yarn/versions
|
||||
|
||||
package-lock.json
|
||||
yarn.lock
|
||||
pnpm-lock.yaml
|
||||
|
||||
# testing
|
||||
/coverage
|
||||
|
||||
# next.js
|
||||
/.next/
|
||||
/out/
|
||||
|
||||
# production
|
||||
/build
|
||||
|
||||
# misc
|
||||
.DS_Store
|
||||
*.pem
|
||||
|
||||
# debug
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
.pnpm-debug.log*
|
||||
|
||||
# env files (can opt-in for committing if needed)
|
||||
.env*
|
||||
|
||||
# vercel
|
||||
.vercel
|
||||
|
||||
# typescript
|
||||
*.tsbuildinfo
|
||||
next-env.d.ts
|
||||
16
eslint.config.mjs
Normal file
16
eslint.config.mjs
Normal file
@ -0,0 +1,16 @@
|
||||
import { dirname } from "path";
|
||||
import { fileURLToPath } from "url";
|
||||
import { FlatCompat } from "@eslint/eslintrc";
|
||||
|
||||
const __filename = fileURLToPath(import.meta.url);
|
||||
const __dirname = dirname(__filename);
|
||||
|
||||
const compat = new FlatCompat({
|
||||
baseDirectory: __dirname,
|
||||
});
|
||||
|
||||
const eslintConfig = [
|
||||
...compat.extends("next/core-web-vitals", "next/typescript"),
|
||||
];
|
||||
|
||||
export default eslintConfig;
|
||||
4
next.config.js
Normal file
4
next.config.js
Normal file
@ -0,0 +1,4 @@
|
||||
/** @type {import('next').NextConfig} */
|
||||
const nextConfig = {};
|
||||
|
||||
module.exports = nextConfig;
|
||||
35
package.json
Normal file
35
package.json
Normal file
@ -0,0 +1,35 @@
|
||||
{
|
||||
"name": "vertex-dapp",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "next dev",
|
||||
"build": "next build",
|
||||
"start": "next start",
|
||||
"lint": "next lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@geist-ui/core": "^2.3.8",
|
||||
"@privy-io/react-auth": "^2.0.4",
|
||||
"chart.js": "^4.4.7",
|
||||
"framer-motion": "^11.18.1",
|
||||
"geist": "^1.3.1",
|
||||
"next": "^14.2.23",
|
||||
"react": "^18.2.0",
|
||||
"react-chartjs-2": "^5.3.0",
|
||||
"react-dom": "^18.2.0",
|
||||
"use-sync-external-store": "^1.2.0",
|
||||
"zustand": "^4.5.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@eslint/eslintrc": "^3",
|
||||
"@types/node": "^20",
|
||||
"@types/react": "^18",
|
||||
"@types/react-dom": "^18",
|
||||
"eslint": "^8.0.0",
|
||||
"eslint-config-next": "14.1.0",
|
||||
"postcss": "^8",
|
||||
"tailwindcss": "^3.4.1",
|
||||
"typescript": "^5"
|
||||
}
|
||||
}
|
||||
8
postcss.config.mjs
Normal file
8
postcss.config.mjs
Normal file
@ -0,0 +1,8 @@
|
||||
/** @type {import('postcss-load-config').Config} */
|
||||
const config = {
|
||||
plugins: {
|
||||
tailwindcss: {},
|
||||
},
|
||||
};
|
||||
|
||||
export default config;
|
||||
17
public/bg.svg
Normal file
17
public/bg.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 12 KiB |
BIN
public/og-banner.png
Normal file
BIN
public/og-banner.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 270 KiB |
180
src/app/(login)/Form.tsx
Normal file
180
src/app/(login)/Form.tsx
Normal file
@ -0,0 +1,180 @@
|
||||
"use client";
|
||||
import Image from "next/image";
|
||||
import iconImg from "@/assets/images/brand/icon.svg";
|
||||
import BtnPrimary from "@/components/BtnPrimary";
|
||||
import Link from "next/link";
|
||||
import SocialLinks from "@/components/SocialLinks";
|
||||
import { motion } from "framer-motion";
|
||||
import { usePrivy } from "@privy-io/react-auth";
|
||||
import { useRouter } from "next/navigation";
|
||||
import { useEffect } from "react";
|
||||
|
||||
export default function Form() {
|
||||
const { ready, login, authenticated } = usePrivy();
|
||||
const router = useRouter();
|
||||
|
||||
useEffect(() => {
|
||||
if (ready && authenticated) {
|
||||
router.push("/dashboard/home");
|
||||
}
|
||||
}, [ready, authenticated, router]);
|
||||
|
||||
if (!ready) {
|
||||
return <></>;
|
||||
}
|
||||
|
||||
return (
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 50,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="relative w-full max-w-[465px] p-12 border border-white/5 bg-[#0CE77E]/10 backdrop-blur-[1px] flex flex-col items-center"
|
||||
>
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.2,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
>
|
||||
<Image src={iconImg} alt="icon" width={40} height={40} />
|
||||
</motion.div>
|
||||
|
||||
<motion.h1
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.4,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="mt-7 mb-1 text-[22px] font-medium text-center text-white"
|
||||
>
|
||||
Welcome to Vertex
|
||||
</motion.h1>
|
||||
|
||||
<motion.p
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.6,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="mb-7 text-lg text-center text-white/50"
|
||||
>
|
||||
Get access to dashboard
|
||||
</motion.p>
|
||||
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.8,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="mb-6 w-full"
|
||||
>
|
||||
<div onClick={login}>
|
||||
<BtnPrimary text="Sign in" />
|
||||
</div>
|
||||
</motion.div>
|
||||
|
||||
<motion.p
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 1,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="mb-10 text-center text-white"
|
||||
>
|
||||
By signing up, I agree with Vertex's{" "}
|
||||
<Link href={"/"} className="text-[#0CE77E]">
|
||||
Terms and Conditions
|
||||
</Link>{" "}
|
||||
&{" "}
|
||||
<Link href={"/"} className="text-[#0CE77E]">
|
||||
Privacy Policy
|
||||
</Link>
|
||||
</motion.p>
|
||||
|
||||
<SocialLinks />
|
||||
|
||||
<span className="absolute -top-px -left-px">
|
||||
<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 1.00037V13.0004" stroke="#0CE77E" strokeWidth="1.5" />
|
||||
<path d="M13 1.00037L1 1.00037" stroke="#0CE77E" strokeWidth="1.5" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px">
|
||||
<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 12V-3.57628e-07" stroke="#0CE77E" strokeWidth="1.5" />
|
||||
<path d="M13 12L1 12" stroke="#0CE77E" strokeWidth="1.5" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px">
|
||||
<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 1.00037V13.0004" stroke="#0CE77E" strokeWidth="1.5" />
|
||||
<path d="M0 1.00037L12 1.00037" stroke="#0CE77E" strokeWidth="1.5" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px">
|
||||
<svg width="13" height="13" viewBox="0 0 13 13" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M12 12V-3.57628e-07" stroke="#0CE77E" strokeWidth="1.5" />
|
||||
<path d="M0 12L12 12" stroke="#0CE77E" strokeWidth="1.5" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
9
src/app/(login)/page.tsx
Normal file
9
src/app/(login)/page.tsx
Normal file
@ -0,0 +1,9 @@
|
||||
import Form from "./Form";
|
||||
|
||||
export default function Login() {
|
||||
return (
|
||||
<main className="relative z-10 min-h-[100svh] flex justify-center items-center">
|
||||
<Form />
|
||||
</main>
|
||||
);
|
||||
}
|
||||
81
src/app/dashboard/api/Box.tsx
Normal file
81
src/app/dashboard/api/Box.tsx
Normal file
@ -0,0 +1,81 @@
|
||||
"use client";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function Box() {
|
||||
return (
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="relative p-5 border border-white/5 bg-[#0E1618]/10 backdrop-blur-sm flex flex-col items-center gap-4"
|
||||
>
|
||||
<p className="text-sm text-white/75 text-center">
|
||||
Team Vertex is working on this
|
||||
</p>
|
||||
|
||||
<button className="h-[40px] px-2.5 border border-white/5 bg-[#0E1618] flex justify-center items-center gap-1.5 text-sm font-medium uppercase text-[#0CE77E]">
|
||||
Coming Your Way Q2 - 2025
|
||||
</button>
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
24
src/app/dashboard/api/page.tsx
Normal file
24
src/app/dashboard/api/page.tsx
Normal file
@ -0,0 +1,24 @@
|
||||
import type { Metadata } from "next";
|
||||
import Box from "./Box";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Vertex - API & Webhook",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
openGraph: {
|
||||
type: "website",
|
||||
url: "https://dapp-ai-proj-02.vercel.app/dashboard/api",
|
||||
title: "Vertex - API & Webhook",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
images: "https://dapp-ai-proj-02.vercel.app/og-banner.png",
|
||||
},
|
||||
};
|
||||
|
||||
export default function API() {
|
||||
return (
|
||||
<div className="pt-7">
|
||||
<Box />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
268
src/app/dashboard/contact/Box.tsx
Normal file
268
src/app/dashboard/contact/Box.tsx
Normal file
@ -0,0 +1,268 @@
|
||||
"use client";
|
||||
import { motion } from "framer-motion";
|
||||
import BtnPrimary from "@/components/BtnPrimary";
|
||||
import { useState } from "react";
|
||||
|
||||
export default function Box() {
|
||||
// Add state management
|
||||
const [formData, setFormData] = useState({
|
||||
name: "",
|
||||
email: "",
|
||||
subject: "",
|
||||
message: "",
|
||||
});
|
||||
const [buttonText, setButtonText] = useState("Submit Form");
|
||||
|
||||
// Handle form submission
|
||||
const handleSubmit = () => {
|
||||
// Check if all fields are filled
|
||||
if (!formData.name || !formData.email || !formData.subject || !formData.message) {
|
||||
alert("Please fill in all fields");
|
||||
return;
|
||||
}
|
||||
|
||||
// Wait 1 second before changing text
|
||||
setTimeout(() => {
|
||||
setButtonText("Form Submitted");
|
||||
|
||||
// Reset form after 2 seconds of showing "Form Submitted"
|
||||
setTimeout(() => {
|
||||
setButtonText("Submit Form");
|
||||
setFormData({
|
||||
name: "",
|
||||
email: "",
|
||||
subject: "",
|
||||
message: "",
|
||||
});
|
||||
}, 2000);
|
||||
}, 1000);
|
||||
};
|
||||
|
||||
return (
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="relative p-5 border border-white/5 bg-[#0E1618]/10 backdrop-blur-sm"
|
||||
>
|
||||
<h3 className="mb-1 font-medium uppercase text-[#0CE77E]">Reach Out to Team Vertex</h3>
|
||||
|
||||
<p className="mb-4 text-sm text-white/75">Our support team is available to assist you</p>
|
||||
|
||||
<div className="py-4 border-t border-[#0CE77E]/25 grid grid-cols-[360px_auto] gap-16 items-center">
|
||||
<div className="flex items-center gap-3.5">
|
||||
<p className="text-sm uppercase text-white">Your name</p>
|
||||
|
||||
<div className="relative flex-1 h-[36px] border border-white/5 bg-[#0CE77E]/10 flex items-center">
|
||||
<input
|
||||
type="text"
|
||||
value={formData.name}
|
||||
onChange={(e) => setFormData((prev) => ({ ...prev, name: e.target.value }))}
|
||||
className="w-full px-3.5 bg-transparent text-sm uppercase text-[#0CE77E] placeholder:text-[#0CE77E]/25"
|
||||
placeholder="Enter your name"
|
||||
/>
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex items-center gap-3.5">
|
||||
<p className="text-sm uppercase text-white">Your email address</p>
|
||||
|
||||
<div className="relative flex-1 h-[36px] border border-white/5 bg-[#0CE77E]/10 flex items-center">
|
||||
<input
|
||||
type="text"
|
||||
value={formData.email}
|
||||
onChange={(e) => setFormData((prev) => ({ ...prev, email: e.target.value }))}
|
||||
className="w-full px-3.5 bg-transparent text-sm uppercase text-[#0CE77E] placeholder:text-[#0CE77E]/25"
|
||||
placeholder="Enter your email"
|
||||
/>
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="py-4 border-t border-[#0CE77E]/25">
|
||||
<div className="flex items-center gap-3.5">
|
||||
<p className="min-w-[75px] text-sm uppercase text-white">Subject</p>
|
||||
|
||||
<div className="relative flex-1 h-[36px] border border-white/5 bg-[#0CE77E]/10 flex items-center">
|
||||
<input
|
||||
type="text"
|
||||
value={formData.subject}
|
||||
onChange={(e) => setFormData((prev) => ({ ...prev, subject: e.target.value }))}
|
||||
className="w-full px-3.5 bg-transparent text-sm uppercase text-[#0CE77E] placeholder:text-[#0CE77E]/25"
|
||||
placeholder="I am facing issue with ..."
|
||||
/>
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="py-4 border-t border-[#0CE77E]/25">
|
||||
<div className="flex items-start gap-3.5">
|
||||
<p className="min-w-[75px] text-sm uppercase text-white">Message</p>
|
||||
|
||||
<div className="relative flex-1 h-[165px] border border-white/5 bg-[#0CE77E]/10">
|
||||
<textarea
|
||||
value={formData.message}
|
||||
onChange={(e) => setFormData((prev) => ({ ...prev, message: e.target.value }))}
|
||||
className="w-full h-[165px] resize-none p-3.5 bg-transparent text-sm uppercase text-[#0CE77E] placeholder:text-[#0CE77E]/25"
|
||||
placeholder="Explain your problem in brief"
|
||||
></textarea>
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="pt-4 border-t border-[#0CE77E]/25">
|
||||
<div className="w-[260px]" onClick={handleSubmit}>
|
||||
<BtnPrimary text={buttonText} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
24
src/app/dashboard/contact/page.tsx
Normal file
24
src/app/dashboard/contact/page.tsx
Normal file
@ -0,0 +1,24 @@
|
||||
import type { Metadata } from "next";
|
||||
import Box from "./Box";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Vertex - Contact Us",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
openGraph: {
|
||||
type: "website",
|
||||
url: "https://dapp-ai-proj-02.vercel.app/dashboard/server",
|
||||
title: "Vertex - Contact Us",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
images: "https://dapp-ai-proj-02.vercel.app/og-banner.png",
|
||||
},
|
||||
};
|
||||
|
||||
export default function Contact() {
|
||||
return (
|
||||
<div className="pt-7">
|
||||
<Box />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
223
src/app/dashboard/home/BottomBoxes.tsx
Normal file
223
src/app/dashboard/home/BottomBoxes.tsx
Normal file
@ -0,0 +1,223 @@
|
||||
"use client";
|
||||
import Image from "next/image";
|
||||
import nvidiaImg from "@/assets/images/manufacturers/nvidia.svg";
|
||||
import amdImg from "@/assets/images/manufacturers/amd.svg";
|
||||
import intelImg from "@/assets/images/manufacturers/intel.svg";
|
||||
import googleImg from "@/assets/images/manufacturers/google.svg";
|
||||
import qualcommImg from "@/assets/images/manufacturers/qualcomm.svg";
|
||||
import Statistics from "./Statistics";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function BottomBoxes() {
|
||||
return (
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.8,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="relative p-5 border border-white/5 bg-[#0E1618]/10 backdrop-blur-sm"
|
||||
>
|
||||
<h3 className="mb-1 font-medium text-[#0CE77E]">
|
||||
TOP GPUs BY MANUFACTURER
|
||||
</h3>
|
||||
|
||||
<p className="mb-8 text-sm text-white/75">
|
||||
A detailed list of GPU manufacturing companies worldwide
|
||||
</p>
|
||||
|
||||
<div className="space-y-4">
|
||||
<div className="group grid grid-cols-[85px_auto] items-center">
|
||||
<Image
|
||||
src={nvidiaImg}
|
||||
alt=""
|
||||
className="opacity-75 group-hover:opacity-100 duration-200"
|
||||
/>
|
||||
|
||||
<motion.div
|
||||
initial={{
|
||||
width: "0%",
|
||||
}}
|
||||
whileInView={{
|
||||
width: "100%",
|
||||
}}
|
||||
transition={{
|
||||
delay: 1,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="h-[12px] bg-[#0CE77E]"
|
||||
></motion.div>
|
||||
</div>
|
||||
|
||||
<div className="group grid grid-cols-[85px_auto] items-center">
|
||||
<Image
|
||||
src={amdImg}
|
||||
alt=""
|
||||
className="opacity-75 group-hover:opacity-100 duration-200"
|
||||
/>
|
||||
|
||||
<motion.div
|
||||
initial={{
|
||||
width: "0%",
|
||||
}}
|
||||
whileInView={{
|
||||
width: "30%",
|
||||
}}
|
||||
transition={{
|
||||
delay: 1.2,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="h-[10px] bg-[#0CE77E]"
|
||||
></motion.div>
|
||||
</div>
|
||||
|
||||
<div className="group grid grid-cols-[85px_auto] items-center">
|
||||
<Image
|
||||
src={intelImg}
|
||||
alt=""
|
||||
className="opacity-75 group-hover:opacity-100 duration-200"
|
||||
/>
|
||||
|
||||
<motion.div
|
||||
initial={{
|
||||
width: "0%",
|
||||
}}
|
||||
whileInView={{
|
||||
width: "20%",
|
||||
}}
|
||||
transition={{
|
||||
delay: 1.4,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="h-[10px] bg-[#0CE77E]"
|
||||
></motion.div>
|
||||
</div>
|
||||
|
||||
<div className="group grid grid-cols-[85px_auto] items-center">
|
||||
<Image
|
||||
src={googleImg}
|
||||
alt=""
|
||||
className="opacity-75 group-hover:opacity-100 duration-200"
|
||||
/>
|
||||
|
||||
<motion.div
|
||||
initial={{
|
||||
width: "0%",
|
||||
}}
|
||||
whileInView={{
|
||||
width: "10%",
|
||||
}}
|
||||
transition={{
|
||||
delay: 1.6,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="h-[10px] bg-[#0CE77E]"
|
||||
style={{
|
||||
width: "10%",
|
||||
}}
|
||||
></motion.div>
|
||||
</div>
|
||||
|
||||
<div className="group grid grid-cols-[85px_auto] items-center">
|
||||
<Image
|
||||
src={qualcommImg}
|
||||
alt=""
|
||||
className="opacity-75 group-hover:opacity-100 duration-200"
|
||||
/>
|
||||
|
||||
<motion.div
|
||||
initial={{
|
||||
width: "0%",
|
||||
}}
|
||||
whileInView={{
|
||||
width: "5%",
|
||||
}}
|
||||
transition={{
|
||||
delay: 1.8,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="h-[10px] bg-[#0CE77E]"
|
||||
style={{
|
||||
width: "5%",
|
||||
}}
|
||||
></motion.div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
<Statistics />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
366
src/app/dashboard/home/Boxes.tsx
Normal file
366
src/app/dashboard/home/Boxes.tsx
Normal file
@ -0,0 +1,366 @@
|
||||
"use client";
|
||||
import Image from "next/image";
|
||||
import serverIcon1 from "@/assets/images/server-1-icon.svg";
|
||||
import serverIcon2 from "@/assets/images/server-2-icon.svg";
|
||||
import serverIcon3 from "@/assets/images/server-3-icon.svg";
|
||||
import serverIcon4 from "@/assets/images/server-4-icon.svg";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function Boxes() {
|
||||
return (
|
||||
<div className="mb-4 grid grid-cols-4 gap-4">
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="group relative p-5 border border-white/5 bg-[#0E1618]/10 hover:bg-[#0CE77E]/25 backdrop-blur-sm duration-200"
|
||||
>
|
||||
<div className="mb-5 flex justify-between items-center">
|
||||
<Image src={serverIcon1} alt="" className="w-[40px] h-[40px]" />
|
||||
|
||||
<p className="py-1.5 px-2 border border-[#0CE77E]/10 bg-[#0CE77E]/10 text-xs font-medium text-[#0CE77E]">
|
||||
Available
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mb-10">
|
||||
<h3 className="font-medium text-[#0CE77E]">GAMING GPUs</h3>
|
||||
<p className="text-sm text-white/75">Consumer grade GPUs</p>
|
||||
</div>
|
||||
|
||||
<div className="relative w-full h-[22px] bg-[#0CE77E]/25">
|
||||
<div className="absolute top-0 left-0 w-[31%] h-full px-2 bg-[#0CE77E] flex items-center">
|
||||
<p className="text-xs font-semibold text-[#0B1315]">31%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span className="absolute -top-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.2,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="group relative p-5 border border-white/5 bg-[#0E1618]/10 hover:bg-[#E2F410]/25 backdrop-blur-sm duration-200"
|
||||
>
|
||||
<div className="mb-5 flex justify-between items-center">
|
||||
<Image src={serverIcon2} alt="" className="w-[40px] h-[40px]" />
|
||||
|
||||
<p className="py-1.5 px-2 border border-[#E2F410]/10 bg-[#E2F410]/10 text-xs font-medium text-[#E2F410]">
|
||||
High Performance
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mb-10">
|
||||
<h3 className="font-medium text-[#E2F410]">Datacenter GPUs</h3>
|
||||
<p className="text-sm text-white/75">Datacenter based GPUs</p>
|
||||
</div>
|
||||
|
||||
<div className="relative w-full h-[22px] bg-[#E2F410]/25">
|
||||
<div className="absolute top-0 left-0 w-[27%] h-full px-2 bg-[#E2F410] flex items-center">
|
||||
<p className="text-xs font-semibold text-[#0B1315]">27%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span className="absolute -top-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.4,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="group relative p-5 border border-white/5 bg-[#0E1618]/10 hover:bg-[#F65927]/25 backdrop-blur-sm duration-200"
|
||||
>
|
||||
<div className="mb-5 flex justify-between items-center">
|
||||
<Image src={serverIcon3} alt="" className="w-[40px] h-[40px]" />
|
||||
|
||||
<p className="py-1.5 px-2 border border-[#F65927]/10 bg-[#F65927]/10 text-xs font-medium text-[#F65927]">
|
||||
Low Performance
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mb-10">
|
||||
<h3 className="font-medium text-[#F65927]">Integrated GPUs</h3>
|
||||
<p className="text-sm text-white/75">Embedded into CPU</p>
|
||||
</div>
|
||||
|
||||
<div className="relative w-full h-[22px] bg-[#F65927]/25">
|
||||
<div className="absolute top-0 left-0 w-[20%] h-full px-2 bg-[#F65927] flex items-center">
|
||||
<p className="text-xs font-semibold text-[#0B1315]">10%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span className="absolute -top-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.6,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="group relative p-5 border border-white/5 bg-[#0E1618]/10 hover:bg-[#0CBFE7]/25 backdrop-blur-sm duration-200"
|
||||
>
|
||||
<div className="mb-5 flex justify-between items-center">
|
||||
<Image src={serverIcon4} alt="" className="w-[40px] h-[40px]" />
|
||||
|
||||
<p className="py-1.5 px-2 border border-[#0CBFE7]/10 bg-[#0CBFE7]/10 text-xs font-medium text-[#0CBFE7]">
|
||||
Specialised GPU
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div className="mb-10">
|
||||
<h3 className="font-medium text-[#0CBFE7]">AI GPUs</h3>
|
||||
<p className="text-sm text-white/75">Manufactured for AI</p>
|
||||
</div>
|
||||
|
||||
<div className="relative w-full h-[22px] bg-[#0CBFE7]/25">
|
||||
<div className="absolute top-0 left-0 w-[36%] h-full px-2 bg-[#0CBFE7] flex items-center">
|
||||
<p className="text-xs font-semibold text-[#0B1315]">36%</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span className="absolute -top-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
173
src/app/dashboard/home/Statistics.tsx
Normal file
173
src/app/dashboard/home/Statistics.tsx
Normal file
@ -0,0 +1,173 @@
|
||||
"use client";
|
||||
import { Radar } from "react-chartjs-2";
|
||||
import {
|
||||
Chart as ChartJS,
|
||||
RadialLinearScale,
|
||||
PointElement,
|
||||
LineElement,
|
||||
Filler,
|
||||
Tooltip,
|
||||
Legend,
|
||||
} from "chart.js";
|
||||
ChartJS.register(
|
||||
RadialLinearScale,
|
||||
PointElement,
|
||||
LineElement,
|
||||
Filler,
|
||||
Tooltip,
|
||||
Legend
|
||||
);
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function Statistics() {
|
||||
const data = {
|
||||
labels: [
|
||||
"Cluster Utilization",
|
||||
"Power Draw",
|
||||
"NVENC",
|
||||
"PCIe Throughput",
|
||||
"GPU Utilization",
|
||||
"ECC Errors",
|
||||
"Avg. Temp",
|
||||
],
|
||||
datasets: [
|
||||
{
|
||||
label: "Performance Metrics",
|
||||
data: [140, 120, 120, 60, 100, 120, 120],
|
||||
backgroundColor: "rgba(11, 231, 126, 0.2)",
|
||||
borderColor: "rgba(11, 231, 126, 1)",
|
||||
borderWidth: 2,
|
||||
pointBackgroundColor: "rgba(11, 231, 126, 1)",
|
||||
pointBorderColor: "rgba(0, 0, 0, 1)",
|
||||
pointHoverRadius: 5,
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const options = {
|
||||
responsive: true,
|
||||
plugins: {
|
||||
tooltip: {
|
||||
enabled: true,
|
||||
backgroundColor: "rgba(0, 0, 0, 1)",
|
||||
titleColor: "rgba(11, 231, 126, 1)",
|
||||
bodyColor: "rgba(255, 255, 255, 1)",
|
||||
},
|
||||
legend: {
|
||||
display: false,
|
||||
},
|
||||
},
|
||||
scales: {
|
||||
r: {
|
||||
ticks: {
|
||||
display: true,
|
||||
color: "rgba(11, 231, 126, 0.7)",
|
||||
backdropColor: "transparent",
|
||||
},
|
||||
grid: {
|
||||
color: "rgba(11, 231, 126, 0.3)",
|
||||
},
|
||||
angleLines: {
|
||||
color: "rgba(11, 231, 126, 0.5)",
|
||||
},
|
||||
pointLabels: {
|
||||
color: "rgba(11, 231, 126, 0.7)",
|
||||
font: {
|
||||
size: 12,
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
};
|
||||
|
||||
return (
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 1,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="relative p-5 border border-white/5 bg-[#0E1618]/10 backdrop-blur-sm"
|
||||
>
|
||||
<h3 className="mb-1 font-medium uppercase text-[#0CE77E]">
|
||||
Resource Statistics
|
||||
</h3>
|
||||
|
||||
<p className="mb-4 text-sm text-white/75">
|
||||
How the GPU’s resources are being utilized
|
||||
</p>
|
||||
|
||||
<div className="flex justify-center">
|
||||
<div
|
||||
style={{
|
||||
width: "380px",
|
||||
height: "380px",
|
||||
}}
|
||||
>
|
||||
<Radar data={data} options={options} />
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
26
src/app/dashboard/home/page.tsx
Normal file
26
src/app/dashboard/home/page.tsx
Normal file
@ -0,0 +1,26 @@
|
||||
import type { Metadata } from "next";
|
||||
import Boxes from "./Boxes";
|
||||
import BottomBoxes from "./BottomBoxes";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Vertex - Dashboard Home",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
openGraph: {
|
||||
type: "website",
|
||||
url: "https://dapp-ai-proj-02.vercel.app/dashboard/home",
|
||||
title: "Vertex - Dashboard Home",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
images: "https://dapp-ai-proj-02.vercel.app/og-banner.png",
|
||||
},
|
||||
};
|
||||
|
||||
export default function Home() {
|
||||
return (
|
||||
<div className="pt-7">
|
||||
<Boxes />
|
||||
<BottomBoxes />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
36
src/app/dashboard/layout.tsx
Normal file
36
src/app/dashboard/layout.tsx
Normal file
@ -0,0 +1,36 @@
|
||||
"use client";
|
||||
|
||||
import Sidebar from "@/components/Sidebar";
|
||||
import Topbar from "@/components/Topbar";
|
||||
import { usePrivy } from "@privy-io/react-auth";
|
||||
import { useRouter } from "next/navigation";
|
||||
|
||||
export default function DashboardLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
const { ready, authenticated } = usePrivy();
|
||||
const router = useRouter();
|
||||
if (!ready) {
|
||||
return <></>;
|
||||
}
|
||||
if (ready && !authenticated) {
|
||||
router.push("/");
|
||||
return null;
|
||||
}
|
||||
return (
|
||||
<main className="relative z-10">
|
||||
<div className="mx-auto container max-w-[1720px] px-14">
|
||||
<div className="min-h-[100svh] p-14 grid grid-cols-[268px_auto] gap-12 overflow-hidden">
|
||||
<Sidebar />
|
||||
|
||||
<div className="hide-scrollbar py-5 h-[calc(100svh-115px)] overflow-y-auto">
|
||||
<Topbar />
|
||||
{children}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</main>
|
||||
);
|
||||
}
|
||||
234
src/app/dashboard/rent/Boxes.tsx
Normal file
234
src/app/dashboard/rent/Boxes.tsx
Normal file
@ -0,0 +1,234 @@
|
||||
"use client";
|
||||
import Link from "next/link";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
interface IGPU {
|
||||
title: string;
|
||||
subTitle: string;
|
||||
price: string;
|
||||
isRecentlyPurchased?: boolean;
|
||||
link: string;
|
||||
}
|
||||
|
||||
export default function Boxes() {
|
||||
const gpus: IGPU[] = [
|
||||
{
|
||||
title: "NVIDIA RTX A4000",
|
||||
subTitle: "16GB GDDR6 - 6144 CUDA Cores",
|
||||
price: "$0.20/hour ($147/mo)",
|
||||
isRecentlyPurchased: true,
|
||||
link: "https://nowpayments.io/payment?iid=5964763281",
|
||||
},
|
||||
{
|
||||
title: "NVIDIA RTX A5000",
|
||||
subTitle: "24 GB GDDR6 - 8192 CUDA Cores",
|
||||
price: "$0.26/hr ($190/month)",
|
||||
link: "https://nowpayments.io/payment?iid=4873013025",
|
||||
},
|
||||
{
|
||||
title: "4x NVIDIA RTX 4090",
|
||||
subTitle: "24 GB GDDR6X - 16384 GPU CUDA Cores",
|
||||
price: "$0.37/hr ($268/month)",
|
||||
link: "https://nowpayments.io/payment?iid=5977605820",
|
||||
},
|
||||
{
|
||||
title: "NVIDIA V100",
|
||||
subTitle: "32 GB HBM2 - 5120 CUDA Cores",
|
||||
price: "$0.44/hr ($317/month)",
|
||||
link: "https://nowpayments.io/payment?iid=5437270588",
|
||||
},
|
||||
{
|
||||
title: "NVIDIA L4 Ada",
|
||||
subTitle: "24 GB GDDR6 - 7680 CUDA Cores",
|
||||
price: "$0.52/hr ($372/month)",
|
||||
link: "https://nowpayments.io/payment?iid=6283623234",
|
||||
},
|
||||
{
|
||||
title: "NVIDIA RTX A6000",
|
||||
subTitle: "48 GB GDDR6 - 10752 CUDA Cores",
|
||||
price: "$0.53/hr ($380/month)",
|
||||
link: "https://nowpayments.io/payment?iid=6074730706",
|
||||
},
|
||||
{
|
||||
title: "NVIDIA L40S Ada",
|
||||
subTitle: "48 GB GDDR6 - 18176 CUDA Cores",
|
||||
price: "$1.24/hr ($890/month)",
|
||||
link: "https://nowpayments.io/payment?iid=4570621084",
|
||||
},
|
||||
{
|
||||
title: "NVIDIA A100 PCIe",
|
||||
subTitle: "40 GB HBM2 - 6912 CUDA Cores",
|
||||
price: "$1.62/hr ($1,166/month)",
|
||||
link: "https://nowpayments.io/payment?iid=6381921922",
|
||||
},
|
||||
{
|
||||
title: "NVIDIA H100 NVL",
|
||||
subTitle: "94 GB HBM3 - 14592 CUDA Cores",
|
||||
price: "$3.35/hr ($2,410/month)",
|
||||
link: "https://nowpayments.io/payment?iid=5319698362",
|
||||
},
|
||||
{
|
||||
title: "NVIDIA H100 SXM",
|
||||
subTitle: "80 GB HBM3 - 14592 CUDA Cores",
|
||||
price: "$3.60/hr ($2,592/month)",
|
||||
link: "https://nowpayments.io/payment?iid=4768823499",
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="grid grid-cols-2 gap-4">
|
||||
{gpus.map((gpu, index) => (
|
||||
<motion.div
|
||||
key={index}
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.2 * index,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="group relative p-5 border border-white/5 bg-[#0E1618]/10 hover:bg-[#0CE77E]/25 backdrop-blur-sm duration-200"
|
||||
>
|
||||
<div className="flex justify-between items-center">
|
||||
<div className="flex items-center gap-3">
|
||||
<svg
|
||||
width="40"
|
||||
height="40"
|
||||
viewBox="0 0 40 40"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<rect width="40" height="40" rx="3" fill="#0CE77E" />
|
||||
<rect
|
||||
width="40"
|
||||
height="40"
|
||||
rx="3"
|
||||
fill="url(#paint0_linear_26_99714)"
|
||||
fillOpacity="0.5"
|
||||
/>
|
||||
<path
|
||||
d="M17.0338 16.8167V15.3963C17.1707 15.3877 17.3162 15.3791 17.4531 15.3791C21.3551 15.2593 23.9051 18.7249 23.9051 18.7249C23.9051 18.7249 21.1498 22.5585 18.189 22.5585C17.7612 22.5585 17.3847 22.49 17.0424 22.3702V18.0489C18.557 18.2372 18.865 18.9046 19.7806 20.4192L21.8087 18.7078C21.8087 18.7078 20.3283 16.7654 17.8296 16.7654C17.5558 16.7739 17.2905 16.7911 17.0338 16.8167ZM17.0338 12.1104V14.2325C17.1707 14.2239 17.3162 14.2154 17.4531 14.2068C22.8697 14.0186 26.4038 18.6479 26.4038 18.6479C26.4038 18.6479 22.3478 23.5853 18.1291 23.5853C17.7441 23.5853 17.3847 23.5511 17.0424 23.4912V24.809C17.3333 24.8432 17.6414 24.8689 17.9494 24.8689C21.8857 24.8689 24.7266 22.858 27.482 20.4877C27.9355 20.8557 29.8095 21.7456 30.1946 22.1306C27.5761 24.3213 21.4749 26.0926 18.0179 26.0926C17.6842 26.0926 17.3676 26.0754 17.0509 26.0412V27.8895H32.0001V12.1104H17.0338ZM17.0338 22.3788V23.4998C13.3971 22.8494 12.3874 19.0672 12.3874 19.0672C12.3874 19.0672 14.133 17.1333 17.0338 16.8167V18.0489H17.0253C15.5107 17.8607 14.3127 19.2897 14.3127 19.2897C14.3127 19.2897 14.9887 21.6771 17.0338 22.3788ZM10.5733 18.9046C10.5733 18.9046 12.7296 15.73 17.0338 15.3963V14.2411C12.2676 14.6261 8.14307 18.665 8.14307 18.665C8.14307 18.665 10.4791 25.4251 17.0338 26.0498V24.8176C12.2248 24.21 10.5733 18.9046 10.5733 18.9046Z"
|
||||
fill="white"
|
||||
/>
|
||||
<defs>
|
||||
<linearGradient
|
||||
id="paint0_linear_26_99714"
|
||||
x1="20"
|
||||
y1="0"
|
||||
x2="20"
|
||||
y2="40"
|
||||
gradientUnits="userSpaceOnUse"
|
||||
>
|
||||
<stop stopOpacity="0" />
|
||||
<stop offset="1" />
|
||||
</linearGradient>
|
||||
</defs>
|
||||
</svg>
|
||||
|
||||
<p className="font-medium text-[#0CE77E]">{gpu.title}</p>
|
||||
</div>
|
||||
|
||||
<p className="text-sm text-white/75">{gpu.subTitle}</p>
|
||||
</div>
|
||||
|
||||
<div className="mt-5 flex justify-between items-center">
|
||||
<div className="flex items-center gap-3">
|
||||
<p className="p-2.5 border border-white/10 text-sm font-medium text-[#0CE77E]">
|
||||
{gpu.price}
|
||||
</p>
|
||||
|
||||
{gpu.isRecentlyPurchased && (
|
||||
<p className="py-1.5 px-2 border border-[#0CE77E] bg-[#0CE77E]/10 flex items-center gap-1.5 text-xs font-medium text-[#0CE77E]">
|
||||
<svg
|
||||
width="14"
|
||||
height="14"
|
||||
viewBox="0 0 14 14"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M7.58334 1.16675L2.38785 7.40136C2.18438 7.64548 2.08265 7.76757 2.08109 7.87071C2.07973 7.96031 2.11968 8.04559 2.1894 8.10194C2.2696 8.16675 2.42852 8.16675 2.74636 8.16675H7.00001L6.41668 12.8334L11.6121 6.59881C11.8156 6.35468 11.9173 6.23259 11.9189 6.12946C11.9203 6.03986 11.8804 5.95457 11.8106 5.89822C11.7304 5.83342 11.5715 5.83342 11.2537 5.83342H7.00001L7.58334 1.16675Z"
|
||||
fill="#0CE77E"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.16667"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
Recently purchased
|
||||
</p>
|
||||
)}
|
||||
</div>
|
||||
|
||||
<Link
|
||||
href={gpu.link}
|
||||
target="_blank"
|
||||
className="py-2.5 px-5 border border-[#0CE77E] bg-[#0CE77E]/10 hover:bg-[#0CE77E] text-sm font-medium uppercase text-[#0CE77E] hover:text-[#0B1516] duration-200"
|
||||
>
|
||||
Rent now
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
<span className="absolute -top-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px opacity-25 group-hover:opacity-100 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
))}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
24
src/app/dashboard/rent/page.tsx
Normal file
24
src/app/dashboard/rent/page.tsx
Normal file
@ -0,0 +1,24 @@
|
||||
import type { Metadata } from "next";
|
||||
import Boxes from "./Boxes";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Vertex - Rent a GPU",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
openGraph: {
|
||||
type: "website",
|
||||
url: "https://dapp-ai-proj-02.vercel.app/dashboard/rent",
|
||||
title: "Vertex - Rent a GPU",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
images: "https://dapp-ai-proj-02.vercel.app/og-banner.png",
|
||||
},
|
||||
};
|
||||
|
||||
export default function Rent() {
|
||||
return (
|
||||
<div className="pt-7">
|
||||
<Boxes />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
142
src/app/dashboard/server/Box.tsx
Normal file
142
src/app/dashboard/server/Box.tsx
Normal file
@ -0,0 +1,142 @@
|
||||
"use client";
|
||||
import { motion } from "framer-motion";
|
||||
import Image from "next/image";
|
||||
import serverIcon1 from "@/assets/images/server-1-icon.svg";
|
||||
import serverIcon2 from "@/assets/images/server-2-icon.svg";
|
||||
import serverIcon3 from "@/assets/images/server-3-icon.svg";
|
||||
import serverIcon4 from "@/assets/images/server-4-icon.svg";
|
||||
|
||||
export default function Box() {
|
||||
return (
|
||||
<motion.div
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="relative p-5 border border-white/5 bg-[#0E1618]/10 backdrop-blur-sm"
|
||||
>
|
||||
<h3 className="mb-1 font-medium uppercase text-[#0CE77E]">Live and preparing servers</h3>
|
||||
|
||||
<p className="mb-4 text-sm text-white/75">List of our GPUs and their current status</p>
|
||||
|
||||
<div className="py-4 border-t border-[#0CE77E]/25 grid grid-cols-[250px_auto] items-center">
|
||||
<div className="flex items-center gap-4">
|
||||
<Image src={serverIcon1} alt="" className="w-[40px] h-[40px]" />
|
||||
|
||||
<div>
|
||||
<h3 className="font-medium text-[#0CE77E]">GAMING GPUs</h3>
|
||||
<p className="text-sm text-white/75">Total GPUs : 52</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex">
|
||||
<div className="flex-1 h-[28px] px-5 bg-[#0CE77E] flex items-center">
|
||||
<p className="text-sm font-semibold uppercase text-[#0B1315]">Ready : 38</p>
|
||||
</div>
|
||||
|
||||
<div className="h-[28px] px-5 bg-[#0A492F] flex items-center">
|
||||
<p className="text-sm font-medium uppercase text-[#0CE77E]">PREPARING : 14</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="py-4 border-t border-[#0CE77E]/25 grid grid-cols-[250px_auto] items-center">
|
||||
<div className="flex items-center gap-4">
|
||||
<Image src={serverIcon2} alt="" className="w-[40px] h-[40px]" />
|
||||
|
||||
<div>
|
||||
<h3 className="font-medium text-[#E2F410]">Datacenter GPUs</h3>
|
||||
<p className="text-sm text-white/75">Total GPUs : 45</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex">
|
||||
<div className="flex-1 h-[28px] px-5 bg-[#0CE77E] flex items-center">
|
||||
<p className="text-sm font-semibold uppercase text-[#0B1315]">Ready : 33</p>
|
||||
</div>
|
||||
|
||||
<div className="h-[28px] px-5 bg-[#0A492F] flex items-center">
|
||||
<p className="text-sm font-medium uppercase text-[#0CE77E]">PREPARING : 12</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="py-4 border-t border-[#0CE77E]/25 grid grid-cols-[250px_auto] items-center">
|
||||
<div className="flex items-center gap-4">
|
||||
<Image src={serverIcon3} alt="" className="w-[40px] h-[40px]" />
|
||||
|
||||
<div>
|
||||
<h3 className="font-medium text-[#F65927]">Integrated GPUs</h3>
|
||||
<p className="text-sm text-white/75">Total GPUs : 17</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex">
|
||||
<div className="flex-1 h-[28px] px-5 bg-[#0CE77E] flex items-center">
|
||||
<p className="text-sm font-semibold uppercase text-[#0B1315]">Ready : 12</p>
|
||||
</div>
|
||||
|
||||
<div className="h-[28px] px-5 bg-[#0A492F] flex items-center">
|
||||
<p className="text-sm font-medium uppercase text-[#0CE77E]">PREPARING : 5</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="py-4 border-t border-[#0CE77E]/25 grid grid-cols-[250px_auto] items-center">
|
||||
<div className="flex items-center gap-4">
|
||||
<Image src={serverIcon4} alt="" className="w-[40px] h-[40px]" />
|
||||
|
||||
<div>
|
||||
<h3 className="font-medium text-[#0CBFE7]">AI GPUs</h3>
|
||||
<p className="text-sm text-white/75">Total GPUs : 61</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="flex">
|
||||
<div className="flex-1 h-[28px] px-5 bg-[#0CE77E] flex items-center">
|
||||
<p className="text-sm font-semibold uppercase text-[#0B1315]">Ready : 44</p>
|
||||
</div>
|
||||
|
||||
<div className="h-[28px] px-5 bg-[#0A492F] flex items-center">
|
||||
<p className="text-sm font-medium uppercase text-[#0CE77E]">PREPARING : 17</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</motion.div>
|
||||
);
|
||||
}
|
||||
25
src/app/dashboard/server/page.tsx
Normal file
25
src/app/dashboard/server/page.tsx
Normal file
@ -0,0 +1,25 @@
|
||||
import type { Metadata } from "next";
|
||||
|
||||
import Box from "./Box";
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Vertex - Server Status",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
openGraph: {
|
||||
type: "website",
|
||||
url: "https://dapp-ai-proj-02.vercel.app/dashboard/server",
|
||||
title: "Vertex - Server Status",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
images: "https://dapp-ai-proj-02.vercel.app/og-banner.png",
|
||||
},
|
||||
};
|
||||
|
||||
export default function Server() {
|
||||
return (
|
||||
<div className="pt-7">
|
||||
<Box />
|
||||
</div>
|
||||
);
|
||||
}
|
||||
BIN
src/app/favicon.ico
Normal file
BIN
src/app/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.2 KiB |
13
src/app/globals.css
Normal file
13
src/app/globals.css
Normal file
@ -0,0 +1,13 @@
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
input,
|
||||
textarea {
|
||||
outline: none;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.hide-scrollbar::-webkit-scrollbar {
|
||||
display: none;
|
||||
}
|
||||
37
src/app/layout.tsx
Normal file
37
src/app/layout.tsx
Normal file
@ -0,0 +1,37 @@
|
||||
import type { Metadata } from "next";
|
||||
import { GeistSans, GeistMono } from "geist/font";
|
||||
import "./globals.css";
|
||||
import Bg from "@/components/Bg";
|
||||
import Providers from "@/components/Providers";
|
||||
|
||||
const geistSans = GeistSans;
|
||||
const geistMono = GeistMono;
|
||||
|
||||
export const metadata: Metadata = {
|
||||
title: "Login to Your Dashboard - Vertex",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
openGraph: {
|
||||
type: "website",
|
||||
url: "https://dapp-ai-proj-02.vercel.app",
|
||||
title: "Login to Your Dashboard - Vertex",
|
||||
description:
|
||||
"Vertex thrives on the power of community. By connecting users across the globe, we are creating a network that fosters collaboration, innovation, and shared success.",
|
||||
images: "https://dapp-ai-proj-02.vercel.app/og-banner.png",
|
||||
},
|
||||
};
|
||||
|
||||
export default function RootLayout({
|
||||
children,
|
||||
}: Readonly<{
|
||||
children: React.ReactNode;
|
||||
}>) {
|
||||
return (
|
||||
<html lang="en">
|
||||
<body className={`${geistSans.variable} ${geistMono.className} antialiased bg-[#070F11]`}>
|
||||
<Providers>{children}</Providers>
|
||||
<Bg />
|
||||
</body>
|
||||
</html>
|
||||
);
|
||||
}
|
||||
5
src/assets/images/brand/icon.svg
Normal file
5
src/assets/images/brand/icon.svg
Normal file
@ -0,0 +1,5 @@
|
||||
<svg width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M0 10.473L15.9113 26.3843L31.9242 10.3712H24.4473L16.0394 18.7792L7.78841 10.5282L0 10.473Z" fill="#0CE77E"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M16.2951 3.7875L9.897 10.0216L15.9621 16.559L22.5144 10.0068L16.2951 3.7875Z" fill="#0CE77E"/>
|
||||
<path fill-rule="evenodd" clip-rule="evenodd" d="M31.9242 10.3712V12.1573L15.9107 28.1707L0.0987854 12.3588V10.473L15.9606 26.3348L31.9242 10.3712Z" fill="#0CE77E"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 572 B |
3
src/assets/images/manufacturers/amd.svg
Normal file
3
src/assets/images/manufacturers/amd.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="47" height="11" viewBox="0 0 47 11" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M10.832 10.269H8.27413L7.49162 8.38159H3.22865L2.51573 10.269H0L3.84344 0.736554H6.59693L10.832 10.269ZM5.25521 3.01436L3.85757 6.71812H6.79277L5.25521 3.01436ZM20.1236 0.736554H22.1921V10.269H19.8158V4.31475L17.244 7.30553H16.8808L14.3092 4.31475V10.2689H11.9329V0.736554H14.0014L17.0623 4.27266L20.1236 0.736554ZM28.2131 0.736554C31.6932 0.736554 33.482 2.90269 33.482 5.51637C33.482 8.25579 31.7491 10.269 27.9474 10.269H24.0059V0.736554H28.2131ZM26.382 8.52185H27.9332C30.3232 8.52185 31.0362 6.90018 31.0362 5.50225C31.0362 3.86679 30.1555 2.48345 27.9052 2.48345H26.382V8.52185H26.382ZM46.1211 0V10.9082L43.1249 7.91179V2.99678H38.2096L35.2133 0H46.1211ZM35.1212 11H39.4387L42.5233 7.9153H38.206V3.59727L35.1212 6.68197V11Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 858 B |
8
src/assets/images/manufacturers/google.svg
Normal file
8
src/assets/images/manufacturers/google.svg
Normal file
@ -0,0 +1,8 @@
|
||||
<svg width="46" height="15" viewBox="0 0 46 15" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M19.5003 7.89382C19.5003 10.0519 17.812 11.6421 15.7401 11.6421C13.6682 11.6421 11.98 10.0519 11.98 7.89382C11.98 5.72054 13.6682 4.14551 15.7401 4.14551C17.812 4.14551 19.5003 5.72054 19.5003 7.89382ZM17.8542 7.89382C17.8542 6.54524 16.8758 5.62252 15.7401 5.62252C14.6045 5.62252 13.626 6.54524 13.626 7.89382C13.626 9.22888 14.6045 10.1651 15.7401 10.1651C16.8758 10.1651 17.8542 9.22719 17.8542 7.89382Z" fill="white"/>
|
||||
<path d="M27.6121 7.89382C27.6121 10.0519 25.9238 11.6421 23.8519 11.6421C21.7801 11.6421 20.0918 10.0519 20.0918 7.89382C20.0918 5.72223 21.7801 4.14551 23.8519 4.14551C25.9238 4.14551 27.6121 5.72054 27.6121 7.89382ZM25.9661 7.89382C25.9661 6.54524 24.9876 5.62252 23.8519 5.62252C22.7163 5.62252 21.7378 6.54524 21.7378 7.89382C21.7378 9.22888 22.7163 10.1651 23.8519 10.1651C24.9876 10.1651 25.9661 9.22719 25.9661 7.89382Z" fill="white"/>
|
||||
<path d="M35.3859 4.37196V11.1013C35.3859 13.8695 33.7534 15.0001 31.8234 15.0001C30.0068 15.0001 28.9134 13.785 28.501 12.7913L29.9341 12.1947C30.1893 12.8048 30.8145 13.5247 31.8218 13.5247C33.0571 13.5247 33.8227 12.7626 33.8227 11.3278V10.7887H33.7652C33.3968 11.2433 32.687 11.6404 31.7913 11.6404C29.9172 11.6404 28.2002 10.0079 28.2002 7.90734C28.2002 5.79152 29.9172 4.14551 31.7913 4.14551C32.6853 4.14551 33.3951 4.54265 33.7652 4.98372H33.8227V4.37365H35.3859V4.37196ZM33.9393 7.90734C33.9393 6.58749 33.0588 5.62252 31.9384 5.62252C30.8027 5.62252 29.8513 6.58749 29.8513 7.90734C29.8513 9.21367 30.8027 10.1651 31.9384 10.1651C33.0588 10.1651 33.9393 9.21367 33.9393 7.90734Z" fill="white"/>
|
||||
<path d="M37.9629 0.427612V11.4123H36.3574V0.427612H37.9629Z" fill="white"/>
|
||||
<path d="M44.2193 9.12746L45.4969 9.9792C45.0846 10.5893 44.0909 11.6404 42.3739 11.6404C40.2445 11.6404 38.6543 9.99441 38.6543 7.89211C38.6543 5.66306 40.2581 4.1438 42.1897 4.1438C44.1348 4.1438 45.0862 5.69179 45.3972 6.52832L45.5679 6.95419L40.5572 9.02945C40.9408 9.78147 41.5374 10.1651 42.3739 10.1651C43.2121 10.1651 43.7934 9.75274 44.2193 9.12746ZM40.2868 7.77888L43.6363 6.38805C43.4521 5.91994 42.8978 5.59378 42.2454 5.59378C41.4089 5.59378 40.2445 6.33228 40.2868 7.77888Z" fill="white"/>
|
||||
<path d="M5.903 6.91866V5.32841H11.2618C11.3142 5.60557 11.3413 5.93342 11.3413 6.2883C11.3413 7.48141 11.0151 8.95674 9.96395 10.0079C8.94153 11.0726 7.6352 11.6404 5.90469 11.6404C2.69716 11.6404 0 9.02771 0 5.82019C0 2.61266 2.69716 0 5.90469 0C7.67913 0 8.94322 0.696259 9.89297 1.60376L8.77084 2.72589C8.08979 2.08709 7.16708 1.59024 5.903 1.59024C3.56073 1.59024 1.72882 3.47792 1.72882 5.82019C1.72882 8.16246 3.56073 10.0501 5.903 10.0501C7.42226 10.0501 8.28752 9.44006 8.84182 8.88576C9.29135 8.43623 9.58709 7.79405 9.7037 6.91697L5.903 6.91866Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 2.8 KiB |
4
src/assets/images/manufacturers/intel.svg
Normal file
4
src/assets/images/manufacturers/intel.svg
Normal file
@ -0,0 +1,4 @@
|
||||
<svg width="29" height="19" viewBox="0 0 29 19" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M8.48891 8.05919V12.7119H7.00769V6.86367L10.0655 6.86657C11.3642 6.86657 11.8067 7.78247 11.8067 8.61445V12.7119H10.3283V8.62209C10.3283 8.27364 10.1478 8.05919 9.71275 8.05919H8.48891ZM18.56 7.98928C18.0538 7.98928 17.662 8.24956 17.4984 8.60285C17.4014 8.81498 17.3681 8.97751 17.3567 9.2372H19.6353C19.606 8.60285 19.3183 7.98928 18.56 7.98928ZM17.3567 10.2452C17.3567 11.0028 17.8276 11.5604 18.6684 11.5604C19.3226 11.5604 19.6477 11.3791 20.026 11.0028L20.9407 11.8762C20.355 12.4544 19.7404 12.8057 18.6575 12.8057C17.2397 12.8057 15.8829 12.0326 15.8829 9.77941C15.8829 7.85441 17.0675 6.76447 18.6242 6.76447C20.2021 6.76447 21.1137 8.04043 21.1137 9.71173V10.2452H17.3567ZM14.6327 12.7045C13.426 12.7045 12.9141 11.8646 12.9141 11.0351V5.2702H14.3929V6.86358H15.5077V8.05919H14.3929V10.9423C14.3929 11.2821 14.5534 11.4707 14.9061 11.4707H15.5077V12.7045H14.6327ZM5.68997 6.05548H4.19869V4.63885H5.68997V6.05548ZM5.69374 12.7734C4.57702 12.666 4.19705 11.9887 4.19705 11.2071L4.19879 6.86367H5.69374V12.7734ZM23.4673 12.6484C22.3529 12.5409 21.9748 11.8646 21.9748 11.084V4.43736H23.4673V12.6484ZM28.6849 5.39792C27.3323 -1.19659 14.5315 -1.61408 6.28071 3.40882V3.96341C14.5231 -0.272571 26.2131 -0.24753 27.2782 5.82624C27.6344 7.83459 26.5027 9.9285 24.4815 11.132V12.7067C26.9143 11.8167 29.4093 8.93071 28.6849 5.39792ZM13.6867 16.9355C7.99224 17.4619 2.05837 16.6354 1.22804 12.1856C0.821571 9.99212 1.82091 7.66684 3.14656 6.22246V5.45014C0.759983 7.54279 -0.535117 10.1921 0.21052 13.3225C1.16219 17.3367 6.255 19.6116 14.0284 18.8561C17.104 18.556 21.1294 17.567 23.9279 16.031V13.8489C21.3886 15.3611 17.1864 16.6115 13.6867 16.9355Z" fill="white"/>
|
||||
<path d="M25.1926 4.87862C25.1926 4.8063 25.1503 4.78329 25.0537 4.78329H24.9604V4.98807C24.974 4.98807 25.0417 4.99059 25.0537 4.99059C25.1503 4.99059 25.1926 4.95829 25.1926 4.89061V4.87862ZM25.338 5.38651H25.2275C25.2227 5.3864 25.218 5.38498 25.2139 5.38238C25.2098 5.37979 25.2066 5.37614 25.2045 5.37182L25.0536 5.11628C25.051 5.11106 25.038 5.10487 25.0328 5.10487H24.9652V5.35828C24.9652 5.37182 24.9558 5.38651 24.938 5.38651H24.838C24.8255 5.38651 24.8131 5.37182 24.8131 5.35828V4.71716C24.8131 4.68003 24.8275 4.66456 24.8588 4.65973C24.8941 4.65509 24.99 4.65199 25.0417 4.65199C25.2253 4.65199 25.3364 4.70614 25.3364 4.87862V4.89061C25.3364 4.99735 25.2833 5.05372 25.2009 5.08128L25.3572 5.34561C25.3582 5.35103 25.3619 5.35828 25.3619 5.36456C25.3619 5.37491 25.3557 5.38651 25.338 5.38651ZM25.0756 4.53626C24.8036 4.53626 24.5836 4.76076 24.5836 5.03129C24.5837 5.16171 24.6356 5.28676 24.7279 5.37896C24.8201 5.47116 24.9452 5.52298 25.0756 5.52303C25.3462 5.52303 25.5683 5.30201 25.5683 5.03119C25.5683 4.76077 25.3462 4.53626 25.0756 4.53626ZM25.0756 5.62494C24.9976 5.62509 24.9203 5.60984 24.8481 5.58007C24.776 5.5503 24.7105 5.50658 24.6553 5.45143C24.6001 5.39628 24.5563 5.33078 24.5265 5.25869C24.4967 5.18659 24.4814 5.10932 24.4814 5.03129C24.4814 4.95325 24.4967 4.87596 24.5265 4.80385C24.5563 4.73174 24.6001 4.66622 24.6553 4.61104C24.7105 4.55586 24.776 4.51211 24.8481 4.48229C24.9202 4.45247 24.9975 4.43717 25.0756 4.43726C25.4025 4.43726 25.6712 4.70469 25.6712 5.03119C25.6712 5.35828 25.4025 5.62494 25.0756 5.62494Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.3 KiB |
3
src/assets/images/manufacturers/nvidia.svg
Normal file
3
src/assets/images/manufacturers/nvidia.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="66" height="12" viewBox="0 0 66 12" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M64.2364 9.62473V9.44252H64.3471C64.4056 9.44252 64.4967 9.44902 64.4967 9.52061C64.4967 9.5987 64.4512 9.61822 64.3796 9.61822H64.2364M64.2364 9.74837H64.3145L64.4967 10.0607H64.692L64.4902 9.73536C64.5878 9.72885 64.679 9.6833 64.679 9.54013C64.679 9.36443 64.5618 9.31237 64.3601 9.31237H64.0737V10.0607H64.2429L64.2364 9.74837ZM65.0759 9.68981C65.0759 9.24729 64.7375 8.99349 64.3536 8.99349C63.9761 8.99349 63.6312 9.24729 63.6312 9.68981C63.6312 10.1323 63.9696 10.3861 64.3536 10.3861C64.7375 10.3861 65.0759 10.1323 65.0759 9.68981ZM64.8677 9.68981C64.8677 10.0087 64.6334 10.2234 64.3536 10.2234C64.0672 10.2234 63.8395 10.0087 63.8395 9.68981C63.8395 9.37093 64.0738 9.15618 64.3536 9.15618C64.6334 9.16269 64.8677 9.37744 64.8677 9.68981ZM38.603 2.27115V10.1518H40.8286V2.27115H38.603ZM21.1106 2.25813V10.1453H23.3557V4.02169L25.1063 4.0282C25.679 4.0282 26.0824 4.17137 26.3557 4.46421C26.7072 4.83514 26.8503 5.44685 26.8503 6.54664V10.1453H29.0239V5.79176C29.0239 2.68113 27.039 2.25813 25.1063 2.25813H21.1106ZM42.1887 2.27115V10.1518H45.7939C47.7137 10.1518 48.3449 9.83297 49.0217 9.11714C49.5033 8.61605 49.8091 7.50976 49.8091 6.29935C49.8091 5.19306 49.5488 4.2039 49.0868 3.58568C48.2733 2.4859 47.0824 2.27115 45.3059 2.27115H42.1887ZM44.3948 3.98265H45.3514C46.7375 3.98265 47.6356 4.60087 47.6356 6.22126C47.6356 7.83514 46.744 8.45987 45.3514 8.45987H44.3948V3.98265ZM35.4013 2.27115L33.5466 8.51193L31.7701 2.27115H29.3688L31.9067 10.1518H35.1085L37.6659 2.27115H35.4013ZM50.8503 10.1453H53.0759V2.27115H50.8503V10.1453ZM57.0846 2.27115L53.9805 10.1453H56.1735L56.6681 8.75922H60.3449L60.8134 10.1453H63.1952L60.0586 2.27115H57.0846ZM58.5293 3.70933L59.8764 7.39263H57.1367L58.5293 3.70933ZM6.76139 3.57918V2.49892C6.86551 2.49241 6.97614 2.4859 7.08026 2.4859C10.0477 2.39479 11.987 5.03037 11.987 5.03037C11.987 5.03037 9.89154 7.94577 7.63991 7.94577C7.31453 7.94577 7.0282 7.89371 6.7679 7.8026V4.51627C7.91974 4.65944 8.15401 5.16703 8.85032 6.31887L10.3926 5.01735C10.3926 5.01735 9.26681 3.54013 7.36659 3.54013C7.15835 3.54664 6.95662 3.55965 6.76139 3.57918ZM6.76139 0V1.61388C6.86551 1.60738 6.97614 1.60087 7.08026 1.59436C11.1996 1.45119 13.8872 4.9718 13.8872 4.9718C13.8872 4.9718 10.8026 8.72668 7.59436 8.72668C7.30152 8.72668 7.0282 8.70065 6.7679 8.6551V9.65727C6.98915 9.6833 7.22343 9.70282 7.4577 9.70282C10.4512 9.70282 12.6117 8.17354 14.7072 6.37093C15.0521 6.65076 16.4772 7.32755 16.7701 7.62039C14.7787 9.28633 10.1388 10.6334 7.50976 10.6334C7.25597 10.6334 7.01518 10.6204 6.7744 10.5944V12H18.1432V0L6.76139 0ZM6.76139 7.80911V8.66161C3.99566 8.16703 3.22777 5.29067 3.22777 5.29067C3.22777 5.29067 4.55531 3.81996 6.76139 3.57918V4.51627H6.75488C5.60304 4.3731 4.69197 5.45987 4.69197 5.45987C4.69197 5.45987 5.20607 7.27549 6.76139 7.80911ZM1.84816 5.16703C1.84816 5.16703 3.48807 2.75271 6.76139 2.49892V1.62039C3.13666 1.91323 0 4.98482 0 4.98482C0 4.98482 1.77657 10.1258 6.76139 10.6009V9.66378C3.10412 9.20174 1.84816 5.16703 1.84816 5.16703Z" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 3.1 KiB |
3
src/assets/images/manufacturers/qualcomm.svg
Normal file
3
src/assets/images/manufacturers/qualcomm.svg
Normal file
@ -0,0 +1,3 @@
|
||||
<svg width="60" height="11" viewBox="0 0 60 11" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M16.1675 3.15705C16.328 3.15705 16.4656 3.287 16.4656 3.45518V9.1501C16.4656 9.31063 16.3204 9.44058 16.1675 9.44058H15.3954C15.2502 9.44058 15.1049 9.32592 15.1049 9.16539V8.63794C14.7151 9.21126 14.0424 9.60876 13.0639 9.60876C11.4281 9.60876 10.419 8.52328 10.419 6.91035V3.43989C10.419 3.27936 10.5643 3.14941 10.7172 3.14941H11.4892C11.6498 3.14941 11.7797 3.27936 11.7797 3.43989V6.68867C11.7797 7.73593 12.3301 8.43155 13.4156 8.43155C14.4781 8.43155 15.1049 7.71299 15.1049 6.70396V3.43989C15.1049 3.27936 15.2502 3.14941 15.3954 3.14941H16.1675M4.77762 0C2.13273 0 0 2.05629 0 4.80056C0 7.55247 2.13273 9.60111 4.77762 9.60111C5.22863 9.60111 5.66435 9.53996 6.07714 9.4253L6.59694 10.763C6.65045 10.9083 6.75747 11 6.94858 11H7.77415C7.9729 11 8.11814 10.87 8.02641 10.6178L7.35372 8.86727C8.67616 8.03405 9.55525 6.55872 9.55525 4.79291C9.55525 2.05629 7.42252 0 4.77762 0ZM6.85685 7.59069L6.25295 6.02363C6.19944 5.89368 6.09243 5.77137 5.8631 5.77137H5.07575C4.877 5.77137 4.72411 5.90132 4.81584 6.15358L5.61084 8.20987C5.35094 8.27867 5.0681 8.30924 4.77762 8.30924C2.84364 8.30924 1.46769 6.78805 1.46769 4.80056C1.46769 2.81306 2.84364 1.29187 4.77762 1.29187C6.71161 1.29187 8.08756 2.81306 8.08756 4.80056C8.08756 5.96247 7.62127 6.95622 6.85685 7.59069ZM59.877 9.11953C59.9458 9.28006 59.8617 9.43294 59.6706 9.43294H58.8068C58.6463 9.43294 58.5163 9.3565 58.4628 9.19597L56.8652 4.89993L55.2446 9.19597C55.1758 9.36414 55.0612 9.43294 54.9006 9.43294H54.1286C53.968 9.43294 53.8534 9.36414 53.7846 9.19597L52.1487 4.877L50.5358 9.19597C50.467 9.3565 50.3523 9.43294 50.1918 9.43294H49.3815C49.221 9.43294 49.1063 9.3565 49.0375 9.19597L47.4399 4.877L45.7887 9.19597C45.7199 9.36414 45.6053 9.43294 45.4448 9.43294H44.6727C44.5122 9.43294 44.3975 9.36414 44.3287 9.19597L42.7158 4.877L41.1029 9.19597C41.0493 9.3565 40.9194 9.43294 40.7589 9.43294H39.918C39.7193 9.43294 39.6428 9.27241 39.7116 9.11953L41.8978 3.40167C41.9666 3.2335 42.0813 3.14941 42.2418 3.14941H43.1821C43.3426 3.14941 43.4573 3.22585 43.5261 3.40167L45.1008 7.5754L46.6602 3.40167C46.729 3.2335 46.8436 3.14941 47.0042 3.14941H47.9291C48.0897 3.14941 48.2043 3.22585 48.2731 3.40167L49.8172 7.5754L51.3614 3.40167C51.4302 3.2335 51.5448 3.14941 51.7054 3.14941H52.6379C52.7985 3.14941 52.9131 3.22585 52.9819 3.40167L54.549 7.5754L56.0778 3.40167C56.1466 3.2335 56.2613 3.14941 56.4218 3.14941H57.3621C57.5226 3.14941 57.6373 3.22585 57.7061 3.40167L59.877 9.11953ZM23.6511 3.15705H22.8791C22.7186 3.15705 22.581 3.287 22.581 3.45518V3.97498C22.1911 3.38638 21.4267 2.96595 20.5247 2.96595C18.82 2.96595 17.36 4.31133 17.36 6.27589C17.36 8.26338 18.8277 9.60111 20.517 9.60111C21.4343 9.60111 22.1758 9.18068 22.5886 8.59208V9.14246C22.5886 9.30299 22.7338 9.43294 22.8867 9.43294H23.6588C23.8193 9.43294 23.9493 9.30299 23.9493 9.14246V3.45518C23.9416 3.287 23.8117 3.15705 23.6511 3.15705ZM20.6699 8.34746C19.5462 8.34746 18.7436 7.43016 18.7436 6.29117C18.7436 5.1369 19.5386 4.25017 20.6699 4.25017C21.786 4.25017 22.5963 5.1369 22.5963 6.29117C22.5886 7.4378 21.7783 8.34746 20.6699 8.34746ZM32.8624 8.54621C33.0306 8.75261 32.8853 8.91313 32.7936 8.98193C32.2585 9.38707 31.5476 9.60876 30.7755 9.60876C28.8263 9.60876 27.5268 8.17929 27.5268 6.29882C27.5268 4.41835 28.8263 2.97359 30.7755 2.97359C31.5476 2.97359 32.2509 3.19527 32.7936 3.60042C32.8853 3.66921 33.0153 3.80681 32.8624 4.03614L32.4955 4.5483C32.3502 4.74705 32.1821 4.69354 32.0368 4.60181C31.6928 4.39541 31.2877 4.2196 30.8214 4.2196C29.6824 4.2196 28.9256 5.1369 28.9256 6.29882C28.9256 7.46074 29.6824 8.3704 30.8214 8.3704C31.2953 8.3704 31.6699 8.18694 32.0139 7.98819C32.1591 7.91174 32.312 7.84295 32.4726 8.05698L32.8624 8.54621ZM36.501 2.98124C34.6664 2.98124 33.2064 4.41835 33.2064 6.29117C33.2064 8.17929 34.6741 9.60111 36.501 9.60111C38.3357 9.60111 39.7957 8.17165 39.7957 6.29117C39.8033 4.42599 38.3357 2.98124 36.501 2.98124ZM36.501 8.33982C35.3773 8.33982 34.5747 7.4378 34.5747 6.29882C34.5747 5.14454 35.3697 4.25782 36.501 4.25782C37.6247 4.25782 38.4274 5.14454 38.4274 6.29882C38.4274 7.4378 37.6324 8.33982 36.501 8.33982ZM26.3572 0.168172C26.5254 0.168172 26.6477 0.313412 26.6477 0.466296V9.13482C26.6477 9.29534 26.533 9.43294 26.3572 9.43294H25.5851C25.4246 9.43294 25.287 9.2877 25.287 9.13482V0.47394C25.287 0.313412 25.4322 0.175817 25.5851 0.175817H26.3572" fill="white"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 4.4 KiB |
8
src/assets/images/server-1-icon.svg
Normal file
8
src/assets/images/server-1-icon.svg
Normal file
@ -0,0 +1,8 @@
|
||||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="40" height="40" rx="3" fill="#0CE77E"/>
|
||||
<path d="M10.0083 23.8092C10.2311 20.3161 10.8874 17.7599 11.4435 16.2751C11.7242 15.5255 12.3282 14.9673 13.1015 14.7802C17.4015 13.7399 22.5986 13.7399 26.8986 14.7802C27.6719 14.9673 28.2759 15.5255 28.5566 16.2751C29.1127 17.7599 29.7689 20.3161 29.9918 23.8092C30.1251 25.8989 28.6148 27.0503 26.9429 27.8925C25.878 28.4289 25.0591 26.8457 24.5155 25.6203C24.2185 24.9508 23.5667 24.5356 22.8281 24.5356H17.172C16.4333 24.5356 15.7816 24.9508 15.4846 25.6203C14.9409 26.8457 14.122 28.4289 13.0571 27.8925C11.4022 27.0588 9.87384 25.9157 10.0083 23.8092Z" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M13 12.5L14.9629 12M27 12.5L25 12" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M17 21L15.5 19.5M15.5 19.5L14 18M15.5 19.5L14 21M15.5 19.5L17 18" stroke="#070F11" stroke-width="1.5" stroke-linecap="round"/>
|
||||
<path d="M23.9883 18H23.9973" stroke="#070F11" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M25.9883 21H25.9973" stroke="#070F11" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.3 KiB |
8
src/assets/images/server-2-icon.svg
Normal file
8
src/assets/images/server-2-icon.svg
Normal file
@ -0,0 +1,8 @@
|
||||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect width="40" height="40" rx="3" fill="#E2F410"/>
|
||||
<path d="M20 16C24.4183 16 28 14.6569 28 13C28 11.3431 24.4183 10 20 10C15.5817 10 12 11.3431 12 13C12 14.6569 15.5817 16 20 16Z" stroke="#070F11" stroke-width="1.5"/>
|
||||
<path d="M15 18.8418C15.6016 19.0227 16.2743 19.1716 17 19.2818" stroke="#070F11" stroke-width="1.5" stroke-linecap="round"/>
|
||||
<path d="M28 20C28 21.6569 24.4183 23 20 23C15.5817 23 12 21.6569 12 20" stroke="#070F11" stroke-width="1.5"/>
|
||||
<path d="M15 25.8418C15.6016 26.0227 16.2743 26.1716 17 26.2818" stroke="#070F11" stroke-width="1.5" stroke-linecap="round"/>
|
||||
<path d="M28 13V27C28 28.6569 24.4183 30 20 30C15.5817 30 12 28.6569 12 27V13" stroke="#070F11" stroke-width="1.5"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 804 B |
14
src/assets/images/server-3-icon.svg
Normal file
14
src/assets/images/server-3-icon.svg
Normal file
@ -0,0 +1,14 @@
|
||||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect y="0.000488281" width="40" height="40" rx="3" fill="#F65927"/>
|
||||
<path d="M12 20.0005C12 16.2292 12 14.3436 13.1716 13.1721C14.3431 12.0005 16.2288 12.0005 20 12.0005C23.7712 12.0005 25.6569 12.0005 26.8284 13.1721C28 14.3436 28 16.2292 28 20.0005C28 23.7717 28 25.6574 26.8284 26.8289C25.6569 28.0005 23.7712 28.0005 20 28.0005C16.2288 28.0005 14.3431 28.0005 13.1716 26.8289C12 25.6574 12 23.7717 12 20.0005Z" stroke="#070F11" stroke-width="1.5" stroke-linejoin="round"/>
|
||||
<path d="M17.5 10.0005V12.0005" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M22.5 10.0005V12.0005" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M17.5 28.0005V30.0005" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M22.5 28.0005V30.0005" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M21 17.0005L17 21.0005" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M23 21.0005L21 23.0005" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M30 22.5005H28" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M12 17.5005H10" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M12 22.5005H10" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M30 17.5005H28" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.7 KiB |
7
src/assets/images/server-4-icon.svg
Normal file
7
src/assets/images/server-4-icon.svg
Normal file
@ -0,0 +1,7 @@
|
||||
<svg width="40" height="40" viewBox="0 0 40 40" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<rect y="0.000488281" width="40" height="40" rx="3" fill="#0CBFE7"/>
|
||||
<path d="M12 20.0005C12 16.2292 12 14.3436 13.1716 13.1721C14.3431 12.0005 16.2288 12.0005 20 12.0005C23.7712 12.0005 25.6569 12.0005 26.8284 13.1721C28 14.3436 28 16.2292 28 20.0005C28 23.7717 28 25.6574 26.8284 26.8289C25.6569 28.0005 23.7712 28.0005 20 28.0005C16.2288 28.0005 14.3431 28.0005 13.1716 26.8289C12 25.6574 12 23.7717 12 20.0005Z" stroke="#070F11" stroke-width="1.5" stroke-linejoin="round"/>
|
||||
<path d="M15.5 23.0005L17.3419 17.4748C17.4363 17.1916 17.7014 17.0005 18 17.0005C18.2986 17.0005 18.5637 17.1916 18.6581 17.4748L20.5 23.0005M16.5 21.0005H19.5" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M23.5 17.0005V23.0005" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
<path d="M16 10.0005V12.0005M24 10.0005V12.0005M20 10.0005V12.0005M16 28.0005V30.0005M20 28.0005V30.0005M24 28.0005V30.0005M30 24.0005H28M12 16.0005H10M12 24.0005H10M12 20.0005H10M30 16.0005H28M30 20.0005H28" stroke="#070F11" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 1.2 KiB |
44
src/components/Bg.tsx
Normal file
44
src/components/Bg.tsx
Normal file
@ -0,0 +1,44 @@
|
||||
"use client";
|
||||
import Image from "next/image";
|
||||
// import { useEffect, useRef, useState } from "react";
|
||||
// import { FlickeringGrid } from "@/components/magicui/flickering-grid";
|
||||
|
||||
export default function Bg() {
|
||||
// const [canvasWidth, setCanvasWidth] = useState<number>(0);
|
||||
// const [canvasHeight, setCanvasHeight] = useState<number>(0);
|
||||
|
||||
// const canvasPlaceholderRef = useRef<HTMLDivElement>(null);
|
||||
|
||||
// useEffect(() => {
|
||||
// if (canvasPlaceholderRef.current) {
|
||||
// setCanvasWidth(canvasPlaceholderRef.current.clientWidth + 10);
|
||||
// setCanvasHeight(canvasPlaceholderRef.current.clientHeight + 10);
|
||||
// }
|
||||
// }, [canvasPlaceholderRef]);
|
||||
|
||||
return (
|
||||
<div className="fixed top-0 left-0 size-full p-5">
|
||||
<div
|
||||
// ref={canvasPlaceholderRef}
|
||||
className="relative size-full border border-white/5 bg-gradient-to-b from-transparent to-[#0CE77E]/5 rounded-lg overflow-hidden"
|
||||
>
|
||||
<Image
|
||||
src="/bg.svg"
|
||||
alt=""
|
||||
fill
|
||||
className="absolute top-0 left-0 size-full object-cover"
|
||||
/>
|
||||
{/* <FlickeringGrid
|
||||
className="absolute inset-0 top-0 left-0 size-full"
|
||||
squareSize={2}
|
||||
gridGap={6}
|
||||
color="#0CE77E"
|
||||
maxOpacity={0.15}
|
||||
flickerChance={0.1}
|
||||
width={2000 > canvasWidth ? 2000 : canvasWidth}
|
||||
height={2000 > canvasHeight ? 2000 : canvasHeight}
|
||||
/> */}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
60
src/components/BtnPrimary.tsx
Normal file
60
src/components/BtnPrimary.tsx
Normal file
@ -0,0 +1,60 @@
|
||||
import { JSX } from "react/jsx-runtime";
|
||||
|
||||
interface IProps {
|
||||
icon?: JSX.Element;
|
||||
text: string;
|
||||
hasRightArrowIcon?: boolean;
|
||||
customClasses?: string;
|
||||
}
|
||||
|
||||
export default function BtnPrimary({ icon, text, hasRightArrowIcon, customClasses }: IProps) {
|
||||
return (
|
||||
<div
|
||||
className={`group relative py-2.5 px-2.5 border border-white/5 hover:border-[#0CE77E] bg-[#0CE77E]/25 hover:bg-[#0CE77E]/35 backdrop-blur-lg flex justify-center items-center gap-2.5 text-base font-medium uppercase text-[#0CE77E] ${customClasses} cursor-pointer duration-200`}
|
||||
>
|
||||
{icon}
|
||||
|
||||
<p>{text}</p>
|
||||
|
||||
{hasRightArrowIcon && (
|
||||
<svg width="16" height="16" viewBox="0 0 16 16" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M6 12.0002L10 8.00017L6 4.00017"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.33333"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
)}
|
||||
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg width="6" height="5" viewBox="0 0 6 5" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
41
src/components/Providers.tsx
Normal file
41
src/components/Providers.tsx
Normal file
@ -0,0 +1,41 @@
|
||||
"use client";
|
||||
|
||||
import { PrivyProvider } from "@privy-io/react-auth";
|
||||
import { toSolanaWalletConnectors } from "@privy-io/react-auth/solana";
|
||||
|
||||
const solanaConnectors = toSolanaWalletConnectors({
|
||||
// By default, shouldAutoConnect is enabled
|
||||
shouldAutoConnect: true,
|
||||
});
|
||||
|
||||
export default function Providers({ children }: { children: React.ReactNode }) {
|
||||
return (
|
||||
<PrivyProvider
|
||||
appId="cm5rifywi0397bjqma3ylfo1p"
|
||||
config={{
|
||||
appearance: {
|
||||
accentColor: "#0ce87e",
|
||||
theme: "#0a3726",
|
||||
showWalletLoginFirst: false,
|
||||
walletChainType: "solana-only",
|
||||
walletList: ["phantom"],
|
||||
},
|
||||
externalWallets: {
|
||||
solana: {
|
||||
connectors: solanaConnectors,
|
||||
},
|
||||
},
|
||||
loginMethods: ["wallet", "email", "discord"],
|
||||
embeddedWallets: {
|
||||
createOnLogin: "all-users",
|
||||
requireUserPasswordOnCreate: false,
|
||||
},
|
||||
mfa: {
|
||||
noPromptOnMfaRequired: false,
|
||||
},
|
||||
}}
|
||||
>
|
||||
{children}
|
||||
</PrivyProvider>
|
||||
);
|
||||
}
|
||||
415
src/components/Sidebar.tsx
Normal file
415
src/components/Sidebar.tsx
Normal file
@ -0,0 +1,415 @@
|
||||
"use client";
|
||||
import Image from "next/image";
|
||||
import iconImg from "@/assets/images/brand/icon.svg";
|
||||
import Link from "next/link";
|
||||
import { JSX } from "react/jsx-runtime";
|
||||
import { usePathname } from "next/navigation";
|
||||
import { usePrivy } from "@privy-io/react-auth";
|
||||
import { useState } from "react";
|
||||
|
||||
interface ILinksPart {
|
||||
title: string;
|
||||
links: ILink[];
|
||||
}
|
||||
|
||||
interface ILink {
|
||||
icon: JSX.Element;
|
||||
title: string;
|
||||
href: string;
|
||||
subTitle?: string;
|
||||
target?: string;
|
||||
}
|
||||
|
||||
export default function Sidebar() {
|
||||
const pathname = usePathname();
|
||||
const { logout, user } = usePrivy();
|
||||
const email = user?.email?.address;
|
||||
const discordUsername = user?.discord?.username;
|
||||
const address = user?.wallet ? user.wallet.address : "";
|
||||
const [copied, setCopied] = useState(false);
|
||||
|
||||
const formatAddress = (address: string | undefined) => {
|
||||
if (!address) return "user";
|
||||
return `${address.slice(0, 4)}...${address.slice(-5)}`;
|
||||
};
|
||||
|
||||
const handleCopyAddress = () => {
|
||||
if (address) {
|
||||
navigator.clipboard.writeText(address);
|
||||
setCopied(true);
|
||||
setTimeout(() => {
|
||||
setCopied(false);
|
||||
}, 2000);
|
||||
}
|
||||
};
|
||||
|
||||
const linksParts: ILinksPart[] = [
|
||||
{
|
||||
title: "Dashboard",
|
||||
links: [
|
||||
{
|
||||
icon: (
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M5.31636 3.57182L4.56635 4.15724C3.42886 5.04511 2.86011 5.48905 2.55505 6.115C2.25 6.74094 2.25 7.46404 2.25 8.91022V10.4786C2.25 13.3172 2.25 14.7364 3.12868 15.6182C4.00736 16.5 5.42157 16.5 8.25 16.5H9.75C12.5784 16.5 13.9927 16.5 14.8713 15.6182C15.75 14.7364 15.75 13.3172 15.75 10.4786V8.91022C15.75 7.46404 15.75 6.74094 15.445 6.115C15.1399 5.48905 14.5712 5.04511 13.4336 4.15724L12.6836 3.57182C10.9141 2.19061 10.0293 1.5 9 1.5C7.9707 1.5 7.0859 2.19061 5.31636 3.57182Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
),
|
||||
title: "Home",
|
||||
href: "/dashboard/home",
|
||||
},
|
||||
{
|
||||
icon: (
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M6.48223 2.35919L5.20362 2.95021C3.23454 3.86039 2.25 4.31548 2.25 5.0625C2.25 5.80952 3.23454 6.26461 5.20363 7.17478L6.48223 7.7658C7.7214 8.33857 8.34105 8.625 9 8.625C9.65895 8.625 10.2786 8.33857 11.5178 7.7658L12.7964 7.17478C14.7655 6.26461 15.75 5.80952 15.75 5.0625C15.75 4.31548 14.7655 3.86039 12.7964 2.95021L11.5178 2.35919C10.2786 1.7864 9.65895 1.5 9 1.5C8.34105 1.5 7.7214 1.7864 6.48223 2.35919Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M15.591 8.323C15.697 8.47202 15.75 8.62742 15.75 8.79827C15.75 9.53462 14.7655 9.98327 12.7964 10.8805L11.5178 11.4631C10.2786 12.0277 9.65895 12.3101 9 12.3101C8.34105 12.3101 7.7214 12.0277 6.48223 11.4631L5.20363 10.8805C3.23454 9.98327 2.25 9.53462 2.25 8.79827C2.25 8.62742 2.303 8.47202 2.409 8.323"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M15.2825 12.1995C15.5941 12.4477 15.75 12.6951 15.75 12.9881C15.75 13.7245 14.7655 14.1731 12.7964 15.0703L11.5178 15.6529C10.2786 16.2176 9.65895 16.4999 9 16.4999C8.34105 16.4999 7.7214 16.2176 6.48223 15.6529L5.20363 15.0703C3.23454 14.1731 2.25 13.7245 2.25 12.9881C2.25 12.6951 2.40583 12.4477 2.7175 12.1995"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
),
|
||||
title: "Rent a GPU",
|
||||
href: "/dashboard/rent",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Details",
|
||||
links: [
|
||||
{
|
||||
icon: (
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M1.875 9C1.875 5.64124 1.875 3.96187 2.91843 2.91843C3.96187 1.875 5.64124 1.875 9 1.875C12.3587 1.875 14.0381 1.875 15.0816 2.91843C16.125 3.96187 16.125 5.64124 16.125 9C16.125 12.3587 16.125 14.0381 15.0816 15.0816C14.0381 16.125 12.3587 16.125 9 16.125C5.64124 16.125 3.96187 16.125 2.91843 15.0816C1.875 14.0381 1.875 12.3587 1.875 9Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
/>
|
||||
<path
|
||||
d="M4.5 10.125L5.625 6.75L7.03125 10.125M4.5 10.125L4.125 11.25M4.5 10.125H7.03125M7.03125 10.125L7.5 11.25"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M9.375 9V7.275C9.375 7.1354 9.375 7.06561 9.39337 7.00912C9.43042 6.89495 9.51997 6.80545 9.63412 6.76835C9.6906 6.75 9.76042 6.75 9.9 6.75H10.875C11.4963 6.75 12 7.25368 12 7.875C12 8.4963 11.4963 9 10.875 9H9.375ZM9.375 9V11.25"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M13.875 6.75V11.25"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
),
|
||||
title: "API & Webhook",
|
||||
href: "/dashboard/api",
|
||||
subTitle: "Q2",
|
||||
},
|
||||
{
|
||||
icon: (
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M1.5 9C1.5 6.87868 1.5 5.81802 2.15901 5.15901C2.81802 4.5 3.87868 4.5 6 4.5H9.75C11.8713 4.5 12.9319 4.5 13.591 5.15901C14.25 5.81802 14.25 6.87868 14.25 9C14.25 11.1213 14.25 12.1819 13.591 12.841C12.9319 13.5 11.8713 13.5 9.75 13.5H6C3.87868 13.5 2.81802 13.5 2.15901 12.841C1.5 12.1819 1.5 11.1213 1.5 9Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<path
|
||||
d="M14.25 7.125L15.0204 7.2534C15.5314 7.33856 15.7868 7.38114 15.9807 7.50502C16.1714 7.62682 16.3209 7.8033 16.4097 8.01143C16.5 8.223 16.5 8.48198 16.5 9C16.5 9.51802 16.5 9.777 16.4097 9.98857C16.3209 10.1967 16.1714 10.3732 15.9807 10.495C15.7868 10.6189 15.5314 10.6615 15.0204 10.7466L14.25 10.875"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<path d="M4.5 7.5V10.5" stroke="#0CE77E" strokeWidth="1.125" strokeLinecap="round" />
|
||||
<path d="M6.75 7.5V10.5" stroke="#0CE77E" strokeWidth="1.125" strokeLinecap="round" />
|
||||
<path d="M9 7.5V10.5" stroke="#0CE77E" strokeWidth="1.125" strokeLinecap="round" />
|
||||
<path d="M11.25 7.5V10.5" stroke="#0CE77E" strokeWidth="1.125" strokeLinecap="round" />
|
||||
</svg>
|
||||
),
|
||||
title: "Server Status",
|
||||
href: "/dashboard/server",
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
title: "Support",
|
||||
links: [
|
||||
{
|
||||
icon: (
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M3.375 7.5C3.375 4.67157 3.375 3.25736 4.25368 2.37868C5.13236 1.5 6.54657 1.5 9.375 1.5H10.5C13.3284 1.5 14.7427 1.5 15.6213 2.37868C16.5 3.25736 16.5 4.67157 16.5 7.5V10.5C16.5 13.3284 16.5 14.7427 15.6213 15.6213C14.7427 16.5 13.3284 16.5 10.5 16.5H9.375C6.54657 16.5 5.13236 16.5 4.25368 15.6213C3.375 14.7427 3.375 13.3284 3.375 10.5V7.5Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
/>
|
||||
<path
|
||||
d="M3.375 4.5H1.5M3.375 9H1.5M3.375 13.5H1.5"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M11.4559 6.36958C11.4559 7.19798 10.7844 7.86957 9.95598 7.86957C9.12761 7.86957 8.45605 7.19798 8.45605 6.36958C8.45605 5.54118 9.12761 4.86963 9.95598 4.86963C10.7844 4.86963 11.4559 5.54118 11.4559 6.36958Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
<path
|
||||
d="M6.98962 11.7872C7.7834 10.5652 9.04393 10.1073 9.95593 10.1082C10.868 10.1091 12.0916 10.5652 12.8853 11.7872C12.9367 11.8662 12.9508 11.9635 12.9045 12.0456C12.7189 12.3748 12.1425 13.028 11.7262 13.0723C11.2479 13.1232 9.99658 13.1303 9.9569 13.1305C9.91715 13.1303 8.6273 13.1232 8.14873 13.0723C7.73248 13.028 7.1561 12.3748 6.97047 12.0456C6.92416 11.9635 6.9383 11.8662 6.98962 11.7872Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
),
|
||||
title: "Contact us",
|
||||
href: "/dashboard/contact",
|
||||
},
|
||||
{
|
||||
icon: (
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M13.107 3H15.0749L10.7757 7.9137L15.8333 14.6001H11.8732L8.77152 10.5449L5.22247 14.6001H3.25342L7.85184 9.34439L3 3H7.06065L9.86431 6.70669L13.107 3ZM12.4163 13.4223H13.5068L6.46815 4.11599H5.29802L12.4163 13.4223Z"
|
||||
fill="#0CE77E"
|
||||
/>
|
||||
</svg>
|
||||
),
|
||||
title: "Twitter/X",
|
||||
href: "https://x.com/vertex_gpu",
|
||||
target: "_blank",
|
||||
},
|
||||
{
|
||||
icon: (
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M10.5 1.70215V4.80005C10.5 5.22009 10.5 5.43011 10.5818 5.59055C10.6537 5.73167 10.7683 5.8464 10.9095 5.91831C11.0699 6.00005 11.2799 6.00005 11.7 6.00005H14.7979M12 9.75H6M12 12.75H6M7.5 6.75H6M10.5 1.5H6.6C5.33988 1.5 4.70982 1.5 4.22852 1.74524C3.80516 1.96095 3.46095 2.30516 3.24524 2.72852C3 3.20982 3 3.83988 3 5.1V12.9C3 14.1602 3 14.7901 3.24524 15.2715C3.46095 15.6949 3.80516 16.0391 4.22852 16.2548C4.70982 16.5 5.33988 16.5 6.6 16.5H11.4C12.6601 16.5 13.2901 16.5 13.7715 16.2548C14.1949 16.0391 14.5391 15.6949 14.7548 15.2715C15 14.7901 15 14.1602 15 12.9V6L10.5 1.5Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.5"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
),
|
||||
title: "Docs",
|
||||
href: "https://docs.vertexgpu.com",
|
||||
target: "_blank",
|
||||
},
|
||||
],
|
||||
},
|
||||
];
|
||||
|
||||
return (
|
||||
<div className="border border-white/5 bg-[#0E1618] h-full p-5 flex flex-col justify-between">
|
||||
<div>
|
||||
<div className="pb-5 border-b border-[#0CE77E]/25 flex justify-center">
|
||||
<Link href={"/dashboard/home"}>
|
||||
<Image src={iconImg} alt="" width={32} height={32} />
|
||||
</Link>
|
||||
</div>
|
||||
|
||||
{linksParts.map((linksPart, index) => {
|
||||
return (
|
||||
<div key={index} className="mt-7">
|
||||
<p className="mb-4 text-sm uppercase text-white/50">{linksPart.title}</p>
|
||||
|
||||
<div>
|
||||
{linksPart.links.map((link, linkIndex) => {
|
||||
return (
|
||||
<Link
|
||||
key={linkIndex}
|
||||
href={link.href}
|
||||
target={link.target}
|
||||
className={`relative py-2 px-2.5 border ${
|
||||
pathname === link.href
|
||||
? "border-white/5 bg-[#0CE77E]/25"
|
||||
: "border-transparent"
|
||||
} flex items-start gap-2.5 text-sm uppercase ${
|
||||
pathname === link.href ? "text-[#0CE77E]" : "text-white/75"
|
||||
} hover:text-[#0CE77E] duration-200`}
|
||||
>
|
||||
{link.icon}
|
||||
{link.title}
|
||||
|
||||
{link.subTitle && (
|
||||
<span className="absolute top-1/2 right-2.5 -translate-y-1/2">
|
||||
{link.subTitle}
|
||||
</span>
|
||||
)}
|
||||
|
||||
{pathname === link.href && (
|
||||
<>
|
||||
<span className="absolute -top-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M5.5 0.5L1 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -left-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M1 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M5.5 4L1 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -top-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 0V4.5" stroke="#0CE77E" />
|
||||
<path d="M0.5 0.5L5 0.5" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
|
||||
<span className="absolute -bottom-px -right-px group-hover:opacity-0 duration-200">
|
||||
<svg
|
||||
width="6"
|
||||
height="5"
|
||||
viewBox="0 0 6 5"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path d="M5 4.5V0" stroke="#0CE77E" />
|
||||
<path d="M0.5 4L5 4" stroke="#0CE77E" />
|
||||
</svg>
|
||||
</span>
|
||||
</>
|
||||
)}
|
||||
</Link>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
})}
|
||||
</div>
|
||||
|
||||
<div className="flex justify-between items-center">
|
||||
<div className="flex items-center gap-2.5">
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M12 10.5C12 11.1213 12.5037 11.625 13.125 11.625C13.7463 11.625 14.25 11.1213 14.25 10.5C14.25 9.8787 13.7463 9.375 13.125 9.375C12.5037 9.375 12 9.8787 12 10.5Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
/>
|
||||
<path
|
||||
d="M7.5 5.25H12C14.1213 5.25 15.1819 5.25 15.841 5.90901C16.5 6.56802 16.5 7.6287 16.5 9.75V11.25C16.5 13.3713 16.5 14.4319 15.841 15.091C15.1819 15.75 14.1213 15.75 12 15.75H7.5C4.67157 15.75 3.25736 15.75 2.37868 14.8713C1.5 13.9927 1.5 12.5784 1.5 9.75V8.25C1.5 5.42157 1.5 4.00736 2.37868 3.12868C3.25736 2.25 4.67157 2.25 7.5 2.25H10.5C11.1975 2.25 11.5462 2.25 11.8324 2.32667C12.6088 2.53472 13.2153 3.1412 13.4234 3.91765C13.5 4.20378 13.5 4.55252 13.5 5.25"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
<div className="flex flex-col">
|
||||
{email && <span className="text-sm font-medium text-white">{email.split("@")[0]}</span>}
|
||||
{discordUsername && !email && (
|
||||
<span className="text-sm font-medium text-white">{discordUsername}</span>
|
||||
)}
|
||||
{address && !email && !discordUsername && (
|
||||
<button
|
||||
onClick={handleCopyAddress}
|
||||
className="text-sm font-medium text-white hover:text-[#0CE77E] transition-colors duration-200"
|
||||
>
|
||||
{copied ? "Copied!" : formatAddress(address)}
|
||||
</button>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="group relative">
|
||||
<button className="flex">
|
||||
<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<g opacity="0.8">
|
||||
<path
|
||||
d="M6 10.5C5.17157 10.5 4.5 11.1716 4.5 12C4.5 12.8284 5.17157 13.5 6 13.5C6.82843 13.5 7.5 12.8284 7.5 12C7.5 11.1716 6.82843 10.5 6 10.5Z"
|
||||
fill="white"
|
||||
/>
|
||||
<path
|
||||
d="M10.5 12C10.5 11.1716 11.1716 10.5 12 10.5C12.8284 10.5 13.5 11.1716 13.5 12C13.5 12.8284 12.8284 13.5 12 13.5C11.1716 13.5 10.5 12.8284 10.5 12Z"
|
||||
fill="white"
|
||||
/>
|
||||
<path
|
||||
d="M16.5 12C16.5 11.1716 17.1716 10.5 18 10.5C18.8284 10.5 19.5 11.1716 19.5 12C19.5 12.8284 18.8284 13.5 18 13.5C17.1716 13.5 16.5 12.8284 16.5 12Z"
|
||||
fill="white"
|
||||
/>
|
||||
</g>
|
||||
</svg>
|
||||
</button>
|
||||
|
||||
<div className="absolute bottom-full right-0 pb-2 opacity-0 group-focus-within:opacity-100 pointer-events-none group-focus-within:pointer-events-auto duration-200">
|
||||
<button
|
||||
onClick={logout}
|
||||
className="py-1.5 px-2 border border-white/5 bg-[#0E1618] flex items-center gap-2 text-sm whitespace-nowrap text-white"
|
||||
>
|
||||
<svg
|
||||
width="16"
|
||||
height="16"
|
||||
viewBox="0 0 16 16"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
className="w-[16px] min-w-[16px]"
|
||||
>
|
||||
<path
|
||||
d="M9.33333 2.06335C9.02867 2.02161 8.717 2 8.4 2C4.86538 2 2 4.68629 2 8C2 11.3137 4.86538 14 8.4 14C8.717 14 9.02867 13.9784 9.33333 13.9367"
|
||||
stroke="#E7400C"
|
||||
strokeLinecap="round"
|
||||
/>
|
||||
<path
|
||||
d="M14.0002 8.00004H7.3335M14.0002 8.00004C14.0002 7.53324 12.6706 6.66106 12.3335 6.33337M14.0002 8.00004C14.0002 8.46684 12.6706 9.33904 12.3335 9.66671"
|
||||
stroke="#E7400C"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
Log out
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
65
src/components/SocialLinks.tsx
Normal file
65
src/components/SocialLinks.tsx
Normal file
@ -0,0 +1,65 @@
|
||||
"use client";
|
||||
import { motion } from "framer-motion";
|
||||
|
||||
export default function SocialLinks() {
|
||||
return (
|
||||
<div className="flex items-center gap-5">
|
||||
<motion.a
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 1.2,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
href={"https://x.com/vertex_gpu"}
|
||||
target="_blank"
|
||||
className="flex"
|
||||
>
|
||||
<svg width="20" height="21" viewBox="0 0 20 21" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M15.2718 1.83659H18.0831L11.9413 8.85617L19.1666 18.4082H13.5093L9.07828 12.615L4.00821 18.4082H1.19528L7.76445 10.9L0.833252 1.83659H6.63418L10.6394 7.13187L15.2718 1.83659ZM14.2852 16.7256H15.8429L5.78775 3.43087H4.11614L14.2852 16.7256Z"
|
||||
fill="#0CE77E"
|
||||
/>
|
||||
</svg>
|
||||
</motion.a>
|
||||
|
||||
<motion.a
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 1.4,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
href={"https://docs.vertexgpu.com/"}
|
||||
target="_blank"
|
||||
className="flex"
|
||||
>
|
||||
<svg width="21" height="21" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M14 2.26953V6.40007C14 6.96012 14 7.24015 14.109 7.45406C14.2049 7.64222 14.3578 7.7952 14.546 7.89108C14.7599 8.00007 15.0399 8.00007 15.6 8.00007H19.7305M16 13H8M16 17H8M10 9H8M14 2H8.8C7.11984 2 6.27976 2 5.63803 2.32698C5.07354 2.6146 4.6146 3.07354 4.32698 3.63803C4 4.27976 4 5.11984 4 6.8V17.2C4 18.8802 4 19.7202 4.32698 20.362C4.6146 20.9265 5.07354 21.3854 5.63803 21.673C6.27976 22 7.11984 22 8.8 22H15.2C16.8802 22 17.7202 22 18.362 21.673C18.9265 21.3854 19.3854 20.9265 19.673 20.362C20 19.7202 20 18.8802 20 17.2V8L14 2Z"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="2"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
</motion.a>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
131
src/components/Topbar.tsx
Normal file
131
src/components/Topbar.tsx
Normal file
@ -0,0 +1,131 @@
|
||||
"use client";
|
||||
import { usePathname } from "next/navigation";
|
||||
import { motion } from "framer-motion";
|
||||
import { usePrivy } from "@privy-io/react-auth";
|
||||
|
||||
export default function Topbar() {
|
||||
const pathname = usePathname();
|
||||
const { user } = usePrivy();
|
||||
const email = user?.email?.address;
|
||||
const discordUsername = user?.discord?.username;
|
||||
const address = user?.wallet?.address;
|
||||
|
||||
const formatAddress = (address: string | undefined) => {
|
||||
if (!address) return "user";
|
||||
return `${address.slice(0, 4)}...${address.slice(-5)}`;
|
||||
};
|
||||
|
||||
const getUsername = () => {
|
||||
if (email) return email.split("@")[0];
|
||||
if (discordUsername) return discordUsername;
|
||||
return formatAddress(address);
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="pb-3.5 border-b border-[#0CE77E]/25 flex justify-between items-center">
|
||||
<motion.p
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="text-lg font-medium uppercase text-white"
|
||||
>
|
||||
{pathname === "/dashboard/home" && `Good Afternoon, ${getUsername()}`}
|
||||
{pathname === "/dashboard/rent" && "Rent a GPU"}
|
||||
{pathname === "/dashboard/api" && "API & Webhooks"}
|
||||
{pathname === "/dashboard/server" && "Server Status"}
|
||||
{pathname === "/dashboard/contact" && "Contact Us"}
|
||||
</motion.p>
|
||||
|
||||
<div className="flex items-center gap-2.5">
|
||||
{/* <motion.button
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.2,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
className="h-[40px] px-2.5 border border-white/5 bg-[#0E1618] flex justify-center items-center gap-1.5 text-sm font-medium uppercase text-white"
|
||||
>
|
||||
<svg
|
||||
width="19"
|
||||
height="18"
|
||||
viewBox="0 0 19 18"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M16.1848 14.5274L13.9423 8.25741C13.7848 7.84491 13.4323 7.58991 13.0273 7.58991C12.6223 7.58991 12.2773 7.84491 12.1048 8.27241L9.86984 14.5274C9.76484 14.8199 9.91484 15.1424 10.2073 15.2474C10.4998 15.3524 10.8223 15.2024 10.9273 14.9099L11.3923 13.6124H14.6548L15.1198 14.9099C15.2023 15.1424 15.4198 15.2849 15.6523 15.2849C15.7123 15.2849 15.7798 15.2774 15.8398 15.2549C16.1323 15.1499 16.2823 14.8274 16.1773 14.5349L16.1848 14.5274ZM11.8048 12.4799L13.0348 9.03741L14.2648 12.4799H11.8048ZM9.89234 5.88741C8.19734 8.56491 6.66734 10.1849 4.80734 11.2649C4.71734 11.3174 4.61984 11.3399 4.52984 11.3399C4.33484 11.3399 4.14734 11.2424 4.04234 11.0624C3.88484 10.7924 3.97484 10.4474 4.24484 10.2974C5.81984 9.38241 7.10984 8.06991 8.55734 5.89491H3.83984C3.53234 5.89491 3.27734 5.63991 3.27734 5.33241C3.27734 5.02491 3.53234 4.76991 3.83984 4.76991H6.65234V3.28491C6.65234 2.97741 6.90734 2.72241 7.21484 2.72241C7.52234 2.72241 7.77734 2.97741 7.77734 3.28491V4.76991H10.5898C10.8973 4.76991 11.1523 5.02491 11.1523 5.33241C11.1523 5.63991 10.8973 5.89491 10.5898 5.89491H9.88484L9.89234 5.88741ZM9.92234 11.3399C9.82484 11.3399 9.72734 11.3174 9.63734 11.2649C9.14984 10.9799 8.67734 10.6649 8.23484 10.3349C7.98734 10.1474 7.93484 9.79491 8.12234 9.54741C8.30984 9.29991 8.66234 9.24741 8.90984 9.43491C9.31484 9.74241 9.75734 10.0274 10.2073 10.2899C10.4773 10.4474 10.5673 10.7924 10.4098 11.0624C10.3048 11.2424 10.1173 11.3399 9.92234 11.3399Z"
|
||||
fill="#0CE77E"
|
||||
/>
|
||||
</svg>
|
||||
English
|
||||
<svg
|
||||
width="11"
|
||||
height="6"
|
||||
viewBox="0 0 11 6"
|
||||
fill="none"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
fillRule="evenodd"
|
||||
clipRule="evenodd"
|
||||
d="M10.0303 0.46967C10.3232 0.762563 10.3232 1.23744 10.0303 1.53033L6.03033 5.53033C5.73744 5.82322 5.26256 5.82322 4.96967 5.53033L0.96967 1.53033C0.676777 1.23744 0.676777 0.762564 0.96967 0.46967C1.26256 0.176777 1.73744 0.176777 2.03033 0.46967L5.5 3.93934L8.96967 0.46967C9.26256 0.176777 9.73744 0.176777 10.0303 0.46967Z"
|
||||
fill="white"
|
||||
/>
|
||||
</svg>
|
||||
</motion.button> */}
|
||||
|
||||
<motion.button
|
||||
initial={{
|
||||
y: 25,
|
||||
opacity: 0,
|
||||
}}
|
||||
whileInView={{
|
||||
y: 0,
|
||||
opacity: 1,
|
||||
}}
|
||||
transition={{
|
||||
delay: 0.2,
|
||||
}}
|
||||
viewport={{
|
||||
once: true,
|
||||
}}
|
||||
onClick={() => {
|
||||
if (document.fullscreenElement) {
|
||||
document.exitFullscreen();
|
||||
} else {
|
||||
document.documentElement.requestFullscreen();
|
||||
}
|
||||
}}
|
||||
className="w-[40px] h-[40px] border border-white/5 bg-[#0E1618] flex justify-center items-center"
|
||||
>
|
||||
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
||||
<path
|
||||
d="M11.625 15.75C12.6717 15.75 13.195 15.75 13.6208 15.6209C14.5796 15.33 15.33 14.5796 15.6209 13.6208C15.75 13.195 15.75 12.6717 15.75 11.625M15.75 6.375C15.75 5.32833 15.75 4.805 15.6209 4.37915C15.33 3.42035 14.5796 2.67003 13.6208 2.37918C13.195 2.25 12.6717 2.25 11.625 2.25M6.375 15.75C5.32833 15.75 4.805 15.75 4.37915 15.6209C3.42035 15.33 2.67003 14.5796 2.37918 13.6208C2.25 13.195 2.25 12.6717 2.25 11.625M2.25 6.375C2.25 5.32833 2.25 4.805 2.37918 4.37915C2.67003 3.42035 3.42035 2.67003 4.37915 2.37918C4.805 2.25 5.32833 2.25 6.375 2.25"
|
||||
stroke="#0CE77E"
|
||||
strokeWidth="1.125"
|
||||
strokeLinecap="round"
|
||||
strokeLinejoin="round"
|
||||
/>
|
||||
</svg>
|
||||
</motion.button>
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
193
src/components/magicui/flickering-grid.tsx
Normal file
193
src/components/magicui/flickering-grid.tsx
Normal file
@ -0,0 +1,193 @@
|
||||
"use client";
|
||||
|
||||
import React, {
|
||||
useCallback,
|
||||
useEffect,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
} from "react";
|
||||
|
||||
interface FlickeringGridProps {
|
||||
squareSize?: number;
|
||||
gridGap?: number;
|
||||
flickerChance?: number;
|
||||
color?: string;
|
||||
width?: number;
|
||||
height?: number;
|
||||
className?: string;
|
||||
maxOpacity?: number;
|
||||
}
|
||||
|
||||
export const FlickeringGrid: React.FC<FlickeringGridProps> = ({
|
||||
squareSize = 4,
|
||||
gridGap = 6,
|
||||
flickerChance = 0.3,
|
||||
color = "rgb(0, 0, 0)",
|
||||
width,
|
||||
height,
|
||||
className,
|
||||
maxOpacity = 0.3,
|
||||
}) => {
|
||||
const canvasRef = useRef<HTMLCanvasElement>(null);
|
||||
const containerRef = useRef<HTMLDivElement>(null);
|
||||
const [isInView, setIsInView] = useState(false);
|
||||
const [canvasSize, setCanvasSize] = useState({ width: 0, height: 0 });
|
||||
|
||||
const memoizedColor = useMemo(() => {
|
||||
const toRGBA = (color: string) => {
|
||||
if (typeof window === "undefined") {
|
||||
return `rgba(0, 0, 0,`;
|
||||
}
|
||||
const canvas = document.createElement("canvas");
|
||||
canvas.width = canvas.height = 1;
|
||||
const ctx = canvas.getContext("2d");
|
||||
if (!ctx) return "rgba(255, 0, 0,";
|
||||
ctx.fillStyle = color;
|
||||
ctx.fillRect(0, 0, 1, 1);
|
||||
const [r, g, b] = Array.from(ctx.getImageData(0, 0, 1, 1).data);
|
||||
return `rgba(${r}, ${g}, ${b},`;
|
||||
};
|
||||
return toRGBA(color);
|
||||
}, [color]);
|
||||
|
||||
const setupCanvas = useCallback(
|
||||
(canvas: HTMLCanvasElement, width: number, height: number) => {
|
||||
const dpr = window.devicePixelRatio || 1;
|
||||
canvas.width = width * dpr;
|
||||
canvas.height = height * dpr;
|
||||
canvas.style.width = `${width}px`;
|
||||
canvas.style.height = `${height}px`;
|
||||
const cols = Math.floor(width / (squareSize + gridGap));
|
||||
const rows = Math.floor(height / (squareSize + gridGap));
|
||||
|
||||
const squares = new Float32Array(cols * rows);
|
||||
for (let i = 0; i < squares.length; i++) {
|
||||
squares[i] = Math.random() * maxOpacity;
|
||||
}
|
||||
|
||||
return { cols, rows, squares, dpr };
|
||||
},
|
||||
[squareSize, gridGap, maxOpacity]
|
||||
);
|
||||
|
||||
const updateSquares = useCallback(
|
||||
(squares: Float32Array, deltaTime: number) => {
|
||||
for (let i = 0; i < squares.length; i++) {
|
||||
if (Math.random() < flickerChance * deltaTime) {
|
||||
squares[i] = Math.random() * maxOpacity;
|
||||
}
|
||||
}
|
||||
},
|
||||
[flickerChance, maxOpacity]
|
||||
);
|
||||
|
||||
const drawGrid = useCallback(
|
||||
(
|
||||
ctx: CanvasRenderingContext2D,
|
||||
width: number,
|
||||
height: number,
|
||||
cols: number,
|
||||
rows: number,
|
||||
squares: Float32Array,
|
||||
dpr: number
|
||||
) => {
|
||||
ctx.clearRect(0, 0, width, height);
|
||||
ctx.fillStyle = "transparent";
|
||||
ctx.fillRect(0, 0, width, height);
|
||||
|
||||
for (let i = 0; i < cols; i++) {
|
||||
for (let j = 0; j < rows; j++) {
|
||||
const opacity = squares[i * rows + j];
|
||||
ctx.fillStyle = `${memoizedColor}${opacity})`;
|
||||
ctx.fillRect(
|
||||
i * (squareSize + gridGap) * dpr,
|
||||
j * (squareSize + gridGap) * dpr,
|
||||
squareSize * dpr,
|
||||
squareSize * dpr
|
||||
);
|
||||
}
|
||||
}
|
||||
},
|
||||
[memoizedColor, squareSize, gridGap]
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
const canvas = canvasRef.current;
|
||||
const container = containerRef.current;
|
||||
if (!canvas || !container) return;
|
||||
|
||||
const ctx = canvas.getContext("2d");
|
||||
if (!ctx) return;
|
||||
|
||||
let animationFrameId: number;
|
||||
let gridParams: ReturnType<typeof setupCanvas>;
|
||||
|
||||
const updateCanvasSize = () => {
|
||||
const newWidth = width || container.clientWidth;
|
||||
const newHeight = height || container.clientHeight;
|
||||
setCanvasSize({ width: newWidth, height: newHeight });
|
||||
gridParams = setupCanvas(canvas, newWidth, newHeight);
|
||||
};
|
||||
|
||||
updateCanvasSize();
|
||||
|
||||
let lastTime = 0;
|
||||
const animate = (time: number) => {
|
||||
if (!isInView) return;
|
||||
|
||||
const deltaTime = (time - lastTime) / 1000;
|
||||
lastTime = time;
|
||||
|
||||
updateSquares(gridParams.squares, deltaTime);
|
||||
drawGrid(
|
||||
ctx,
|
||||
canvas.width,
|
||||
canvas.height,
|
||||
gridParams.cols,
|
||||
gridParams.rows,
|
||||
gridParams.squares,
|
||||
gridParams.dpr
|
||||
);
|
||||
animationFrameId = requestAnimationFrame(animate);
|
||||
};
|
||||
|
||||
const resizeObserver = new ResizeObserver(() => {
|
||||
updateCanvasSize();
|
||||
});
|
||||
|
||||
resizeObserver.observe(container);
|
||||
|
||||
const intersectionObserver = new IntersectionObserver(
|
||||
([entry]) => {
|
||||
setIsInView(entry.isIntersecting);
|
||||
},
|
||||
{ threshold: 0 }
|
||||
);
|
||||
|
||||
intersectionObserver.observe(canvas);
|
||||
|
||||
if (isInView) {
|
||||
animationFrameId = requestAnimationFrame(animate);
|
||||
}
|
||||
|
||||
return () => {
|
||||
cancelAnimationFrame(animationFrameId);
|
||||
resizeObserver.disconnect();
|
||||
intersectionObserver.disconnect();
|
||||
};
|
||||
}, [setupCanvas, updateSquares, drawGrid, width, height, isInView]);
|
||||
|
||||
return (
|
||||
<div ref={containerRef} className={`w-full h-full ${className}`}>
|
||||
<canvas
|
||||
ref={canvasRef}
|
||||
className="pointer-events-none"
|
||||
style={{
|
||||
width: canvasSize.width,
|
||||
height: canvasSize.height,
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
14
tailwind.config.ts
Normal file
14
tailwind.config.ts
Normal file
@ -0,0 +1,14 @@
|
||||
import type { Config } from "tailwindcss";
|
||||
|
||||
export default {
|
||||
content: [
|
||||
"./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./src/components/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
"./src/app/**/*.{js,ts,jsx,tsx,mdx}",
|
||||
],
|
||||
theme: {
|
||||
extend: {
|
||||
},
|
||||
},
|
||||
plugins: [],
|
||||
} satisfies Config;
|
||||
27
tsconfig.json
Normal file
27
tsconfig.json
Normal file
@ -0,0 +1,27 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "ES2017",
|
||||
"lib": ["dom", "dom.iterable", "esnext"],
|
||||
"allowJs": true,
|
||||
"skipLibCheck": true,
|
||||
"strict": true,
|
||||
"noEmit": true,
|
||||
"esModuleInterop": true,
|
||||
"module": "esnext",
|
||||
"moduleResolution": "bundler",
|
||||
"resolveJsonModule": true,
|
||||
"isolatedModules": true,
|
||||
"jsx": "preserve",
|
||||
"incremental": true,
|
||||
"plugins": [
|
||||
{
|
||||
"name": "next"
|
||||
}
|
||||
],
|
||||
"paths": {
|
||||
"@/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["next-env.d.ts", "**/*.ts", "**/*.tsx", ".next/types/**/*.ts"],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
Loading…
x
Reference in New Issue
Block a user