diff --git a/package-lock.json b/package-lock.json
index dd1e84d..909ace9 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -8,6 +8,8 @@
"name": "talkd.github.io",
"version": "0.1.0",
"dependencies": {
+ "@vercel/analytics": "^1.3.1",
+ "@vercel/speed-insights": "^1.0.12",
"next": "14.2.3",
"react": "^18",
"react-dom": "^18"
@@ -615,6 +617,60 @@
"integrity": "sha512-zuVdFrMJiuCDQUMCzQaD6KL28MjnqqN8XnAqiEq9PNm/hCPTSGfrXCOfwj1ow4LFb/tNymJPwsNbVePc1xFqrQ==",
"dev": true
},
+ "node_modules/@vercel/analytics": {
+ "version": "1.3.1",
+ "resolved": "https://registry.npmjs.org/@vercel/analytics/-/analytics-1.3.1.tgz",
+ "integrity": "sha512-xhSlYgAuJ6Q4WQGkzYTLmXwhYl39sWjoMA3nHxfkvG+WdBT25c563a7QhwwKivEOZtPJXifYHR1m2ihoisbWyA==",
+ "dependencies": {
+ "server-only": "^0.0.1"
+ },
+ "peerDependencies": {
+ "next": ">= 13",
+ "react": "^18 || ^19"
+ },
+ "peerDependenciesMeta": {
+ "next": {
+ "optional": true
+ },
+ "react": {
+ "optional": true
+ }
+ }
+ },
+ "node_modules/@vercel/speed-insights": {
+ "version": "1.0.12",
+ "resolved": "https://registry.npmjs.org/@vercel/speed-insights/-/speed-insights-1.0.12.tgz",
+ "integrity": "sha512-ZGQ+a7bcfWJD2VYEp2R1LHvRAMyyaFBYytZXsfnbOMkeOvzGNVxUL7aVUvisIrTZjXTSsxG45DKX7yiw6nq2Jw==",
+ "hasInstallScript": true,
+ "peerDependencies": {
+ "@sveltejs/kit": "^1 || ^2",
+ "next": ">= 13",
+ "react": "^18 || ^19",
+ "svelte": "^4",
+ "vue": "^3",
+ "vue-router": "^4"
+ },
+ "peerDependenciesMeta": {
+ "@sveltejs/kit": {
+ "optional": true
+ },
+ "next": {
+ "optional": true
+ },
+ "react": {
+ "optional": true
+ },
+ "svelte": {
+ "optional": true
+ },
+ "vue": {
+ "optional": true
+ },
+ "vue-router": {
+ "optional": true
+ }
+ }
+ },
"node_modules/acorn": {
"version": "8.11.3",
"resolved": "https://registry.npmjs.org/acorn/-/acorn-8.11.3.tgz",
@@ -3951,6 +4007,11 @@
"node": ">=10"
}
},
+ "node_modules/server-only": {
+ "version": "0.0.1",
+ "resolved": "https://registry.npmjs.org/server-only/-/server-only-0.0.1.tgz",
+ "integrity": "sha512-qepMx2JxAa5jjfzxG79yPPq+8BuFToHd1hm7kI+Z4zAq1ftQiP7HcxMhDDItrbtwVeLg/cY2JnKnrcFkmiswNA=="
+ },
"node_modules/set-function-length": {
"version": "1.2.2",
"resolved": "https://registry.npmjs.org/set-function-length/-/set-function-length-1.2.2.tgz",
diff --git a/package.json b/package.json
index ca59e79..b7487ee 100644
--- a/package.json
+++ b/package.json
@@ -3,12 +3,14 @@
"version": "0.1.0",
"private": true,
"scripts": {
- "dev": "next dev",
+ "dev": "next dev -H 0.0.0.0 -p 3000",
"build": "next build",
"start": "next start",
"lint": "next lint"
},
"dependencies": {
+ "@vercel/analytics": "^1.3.1",
+ "@vercel/speed-insights": "^1.0.12",
"next": "14.2.3",
"react": "^18",
"react-dom": "^18"
diff --git a/src/app/globals.css b/src/app/globals.css
index 9ae397e..0622f0a 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -4,20 +4,225 @@
@import url('https://fonts.googleapis.com/css2?family=Ubuntu+Mono:ital,wght@0,400;0,700;1,400;1,700&display=swap');
+:root {
+ --green-bg: #001F26;
+ --purple-text: #9A59FF;
+ --faq-grey: #B1C2BE;
+}
+
body {
background-color: #000;
color: #fff;
font-family: Inter;
}
-.talkd-menu{
- background-color: #001F26;
-}
.menu-item li span:hover{
- text-decoration: 1px solid underline;
+ text-decoration: 1px solid underline;
+}
+
+/* Menu.css */
+.menu {
+ background-color: var(--green-bg);
+ font-size: 16px;
+ height: 40px;
+}
+
+.menu-items {
+ display: flex;
+}
+
+.menu-item {
+ color: white;
+ cursor: pointer;
+ position: relative;
+ transition: color 0.3s ease;
+ padding: 8px;
+ font-weight: 600;
+}
+
+.menu-item.selected, .menu-item:hover {
+ color: var(--purple-text);
+}
+
+.menu-item:hover::after {
+ content: '';
+ display: block;
+ height: 2px;
+ background-color: var(--purple-text);
+ position: absolute;
+ bottom: 0;
+ left: 0;
+ right: 0;
+}
+
+.burger-menu {
+ display: none;
+ cursor: pointer;
}
-.talkdai-hero{
+.burger-icon {
+ font-size: 24px;
+ color: white;
+}
+
+.mobile-menu-items {
+ display: flex;
+ flex-direction: column;
+ position: fixed;
+ top: 0;
+ left: 0;
+ background-color: #0f1b26;
+ width: 100%;
+ height: 100%;
+ z-index: 999;
+}
+
+.mobile-menu-items {
+ transition: display 3s ease;
+}
+
+.mobile-menu-items .menu-item {
+ padding: 20px;
+ text-align: left;
+ border-bottom: 1px solid #1a2a3a;
+}
+
+.testimonials-section {
+ display: none;
+}
+
+.faq-section{
+ background-color: #001F26;
+ width: 100%;
+ min-height: 100px;
+ display: block;
+ width: 100%;
+}
+
+.faq-section h2{
+ color: var(--faq-grey);
+ font-style: normal;
+ font-weight: 600;
+ line-height: 110%; /* 44px */
+ font-size: 40px;
+}
+
+.faq-content{
+ padding: 24px 0;
+ border-bottom: 1px solid #004F61;
+}
+
+.faq-content:last-child {
+ border-bottom: none;
+}
+
+.faq-section summary{
+ display: flex;
+ color: var(--faq-grey);
+ list-style-type: none;
+ list-style: 40px solid;
+ line-height: 150%;
+}
+
+details > summary {
+ list-style: none;
+}
+details > summary::-webkit-details-marker {
+ display: none;
+}
+
+.faq-section summary h3{
+ color: var(--faq-grey);
+ font-size: 24px;
+ font-weight: 400;
+ width: 100%;
+ display: flex;
+ padding: 8px 0;
+}
+
+.faq-section p{
+ color: var(--purple-text);
+ font-size: 20px;
+ font-style: normal;
+ font-weight: 500;
+ line-height: 150%;
+ padding: 16px 0;
+}
+
+.faq-section summary span{
+ text-align: right;
+ font-size: 40px !important;
+ float: right;
+}
+
+@media (max-width: 1000px) {
+ .menu{
+ display: block;
+ padding: 0 10px;
+ position: relative;
+ border-radius: 8px;
+ justify-content: space-between;
+ align-items: center;
+
+ }
+ .menu-items {
+ display: none;
+ }
+
+ .burger-menu {
+ display: block;
+ }
+ .mobile-menu-items .menu-item::child {
+ z-index: -1;
+ }
+
+ .hero-subtext {
+ font-size: 1.1rem;
+ }
+
+ header {
+ margin-top: 0 !important;
+ }
+
+ .faq-section{
+ margin-top: 50px;
+ padding: 24px 20px;
+ }
+
+ .faq-section h2{
+ font-size: 25px;
+ }
+
+ .apps-container{
+ align-items: center;
+ }
+}
+
+@media (min-width: 1000px) {
+ .mobile-menu-items {
+ display: none;
+ }
+
+ .hero{
margin-top: 110px;
-}
\ No newline at end of file
+ }
+
+ .hero-subtext {
+ font-size: 0.875rem;
+ line-height: 1.25rem;
+ }
+
+ .faq-section{
+ padding: 24px 122px;
+ }
+
+ .faq-section h2{
+ padding-top: 20px;
+ font-size: 40px;
+ }
+
+ .apps-container a {
+ margin: 0px 25px;
+ }
+}
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index c979afd..2aa6d02 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,7 +1,9 @@
+import "./globals.css";
import type { Metadata } from "next";
import { Inter } from "next/font/google";
-import "./globals.css";
import { Header } from "@/components/Header";
+import { Analytics } from "@vercel/analytics/react";
+import { SpeedInsights } from "@vercel/speed-insights/next"
const inter = Inter({ subsets: ["latin"] });
@@ -19,7 +21,10 @@ export default function RootLayout({
- {children}
+ {children}
+
+
+