diff --git a/src/assets/images/about/tabs/team/jainam.svg b/src/assets/images/about/tabs/team/jainam.svg new file mode 100644 index 0000000..1e54030 --- /dev/null +++ b/src/assets/images/about/tabs/team/jainam.svg @@ -0,0 +1,21 @@ + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/home/grid_first_image.svg b/src/assets/images/home/grid_first_image.svg index 4632c22..03d3ff8 100644 --- a/src/assets/images/home/grid_first_image.svg +++ b/src/assets/images/home/grid_first_image.svg @@ -1,101 +1,185 @@ - - - - - - + + + + + + + + + + + + + + + + + + + + - - + + + + + + - - - - - - - - - - - - - - + + + + + + - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - - - - + + - - + + - - - - - - + + + + + + + + + + + + + + + + + + + + + - - + + + - + - - - + + + - - - - - + + + + + + - - + + + diff --git a/src/assets/images/home/grid_second_image.svg b/src/assets/images/home/grid_second_image.svg index 86fc3ea..240d949 100644 --- a/src/assets/images/home/grid_second_image.svg +++ b/src/assets/images/home/grid_second_image.svg @@ -1,84 +1,137 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - + + - - - - - - - + + + + + + + + + + + + - - - + + + - - - + + + - + - + - - + + - + + diff --git a/src/assets/images/home/grid_third_image.svg b/src/assets/images/home/grid_third_image.svg index 6b85c08..97d83a4 100644 --- a/src/assets/images/home/grid_third_image.svg +++ b/src/assets/images/home/grid_third_image.svg @@ -1,99 +1,154 @@ - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + - - - - + + + - + - + - + - - + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/home/hero_background.svg b/src/assets/images/home/hero_background.svg new file mode 100644 index 0000000..3141ca2 --- /dev/null +++ b/src/assets/images/home/hero_background.svg @@ -0,0 +1,48 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + diff --git a/src/assets/images/home/howKleoWorks/automate_flow.svg b/src/assets/images/home/howKleoWorks/automate_flow.svg new file mode 100644 index 0000000..4c8078b --- /dev/null +++ b/src/assets/images/home/howKleoWorks/automate_flow.svg @@ -0,0 +1,4 @@ + + + + diff --git a/src/assets/images/home/howKleoWorks/automation_script.svg b/src/assets/images/home/howKleoWorks/automation_script.svg new file mode 100644 index 0000000..cdf6b08 --- /dev/null +++ b/src/assets/images/home/howKleoWorks/automation_script.svg @@ -0,0 +1,11 @@ + + + + + + + + + + + diff --git a/src/assets/images/home/howKleoWorks/earn_coins.svg b/src/assets/images/home/howKleoWorks/earn_coins.svg new file mode 100644 index 0000000..77450bd --- /dev/null +++ b/src/assets/images/home/howKleoWorks/earn_coins.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/assets/images/home/partners-horizontal.svg b/src/assets/images/home/partners-horizontal.svg index 43380a8..bad68ae 100644 --- a/src/assets/images/home/partners-horizontal.svg +++ b/src/assets/images/home/partners-horizontal.svg @@ -1,50 +1,44 @@ - - - - - - - - - - - - - - - + + + + + + + + + + + + + - - + + - - + + - - + + - - + + - - + + - - + + - - + + - - - - - - - - - - + + + + + + diff --git a/src/assets/images/home/partners-vertical.svg b/src/assets/images/home/partners-vertical.svg index bc6584e..14025c7 100644 --- a/src/assets/images/home/partners-vertical.svg +++ b/src/assets/images/home/partners-vertical.svg @@ -4,7 +4,7 @@ - + @@ -12,10 +12,8 @@ - - - - + + @@ -30,16 +28,13 @@ - + - - - - + @@ -47,9 +42,8 @@ - + - diff --git a/src/pages/about/sections/aboutTabs/TeamTab.tsx b/src/pages/about/sections/aboutTabs/TeamTab.tsx index f9ac932..867d774 100644 --- a/src/pages/about/sections/aboutTabs/TeamTab.tsx +++ b/src/pages/about/sections/aboutTabs/TeamTab.tsx @@ -2,6 +2,7 @@ import VaibhavProfileImage from '../../../../assets/images/about/tabs/team/vaibh import PratikProfileImage from '../../../../assets/images/about/tabs/team/pratik.svg' import RuchiProfileImage from '../../../../assets/images/about/tabs/team/ruchi.svg' import PrinceProfileImage from '../../../../assets/images/about/tabs/team/prince.svg' +import JainamProfileImage from '../../../../assets/images/about/tabs/team/jainam.svg' import LinkedinIconPath from '../../../../assets/images/about/tabs/team/linkedinIcon.svg' import PortfolioIconPath from '../../../../assets/images/about/tabs/team/portfolioIcon.svg' @@ -73,6 +74,18 @@ const ABOUT_TEAM_TAB_DATA = { link: 'https://princedalsaniya.vercel.app/' } ] + }, + { + name: 'Jainam Shah', + profilePath: JainamProfileImage, + role: 'FRONTEND DEVELOPER', + bio: 'Recent Ahmedabad University graduate with 1 year of experience as a full stack developer, passionate about full stack development and UI/UX design. Part time on Kleo for last 2 months.', + socials: [ + { + iconPath: LinkedinIconPath, + link: 'https://www.linkedin.com/in/jainam-shah-61250020b/' + } + ] } ] } diff --git a/src/pages/home/FeatureGridSection.tsx b/src/pages/home/FeatureGridSection.tsx index 2344a65..d68d469 100644 --- a/src/pages/home/FeatureGridSection.tsx +++ b/src/pages/home/FeatureGridSection.tsx @@ -4,75 +4,73 @@ import { ReactComponent as GridThirdImage } from '../../assets/images/home/grid_ export const FeatureGridSection = () => { return ( -
-
+
+
{/* Pair - 1 */} -
+
{/* Image */} {/* Text */}
- Own A Stake For Your Data + AI agents that help you own your data
-

- Every individual generates a massive amount of data essential - for LLMs and AI models. Currently, centralized entities build - billion-dollar IPs without you receiving anything in return.{' '} -

- It's time to reclaim ownership of your data as a user. +

+ Earn from your extension! Be a part of Kleo Data DAO, +
+
+ Personalise your DAPP.

{/* Pair - 2 */} -
+
{/* Image */} {/* Text */}
- Proof of Contribution + AI agent to own your data.
-

- Earn Kleo XP points based on the intelligence and complexity of - your actions within the browser. While we're transparent about - activities that maximize your Kleo points, the exact algorithm - remains proprietary to prevent farming. +

+ Machine Learning Models / Analytics Houses want this data. Kleo + and VANA DAO will come up with a proof of contribution which + will then decide on user contribution tokens/$ amount that will + be shared based on the requirement. Rest assured no personally + identifiable information will be leaked.

- - Continue your usual activities and earn rewards based on your - engagement. - + We will be using snapshot for Kleo token holders to manage + conversation between data requirement and data liquidity + provider

{/* Pair - 3 */} -
+
{/* Image */} {/* Text */}
- Kleo SDK + Make life easier
-

- We want your users to earn from your extension! Join the Kleo - Data DAO. If you're a crypto wallet and want this feature - enabled, please reach out to us on Discord. +

+ Based on intelligence and complexity of your actions inside + the browser, kleo will reward kleo XP points. Kleo will be + transparent about the activity that helps you get the maximum + kleo points but the exact algorithm will be closed source to + ensure there is no farming. +
+
+ Just do what you do and earn rewards on the basis of the + activity.

- - Talk to us -
diff --git a/src/pages/home/FooterSection.tsx b/src/pages/home/FooterSection.tsx index 8959e38..5061591 100644 --- a/src/pages/home/FooterSection.tsx +++ b/src/pages/home/FooterSection.tsx @@ -1,17 +1,18 @@ import { ReactComponent as FooterKleoLogo } from '../../assets/images/home/footer/logo_footer.svg' -import { ReactComponent as PhoneIcon } from '../../assets/images/home/footer/phone.svg' import { ReactComponent as EmailIcon } from '../../assets/images/home/footer/email.svg' import { ReactComponent as LinkedIn } from '../../assets/images/home/footer/linkedIn.svg' -import { ReactComponent as FaceBook } from '../../assets/images/home/footer/facebook.svg' -import { ReactComponent as Instagram } from '../../assets/images/home/footer/instagram.svg' import { ReactComponent as Discord } from '../../assets/images/home/footer/discord.svg' import { ReactComponent as Grid } from '../../assets/images/home/footer/grid.svg' +import { useLocation } from 'react-router-dom' export const FooterSection = () => { + const location = useLocation() + const { pathname } = location + return (
{/* Footer section */} -
+
{/* Company Logo and Text */} @@ -21,17 +22,8 @@ export const FooterSection = () => { Kleo Network is a user owned data DAO.
- {/* Contact Number and Email */}
- {/* Phone Number Pill */} - {/*
- -
- -
-
*/} - {/* Email Pill */}
@@ -40,13 +32,16 @@ export const FooterSection = () => {
- {/* Navigation Links */} - {/* Social Media Links */} - {/* All rights reserved */} -
+
All rights reserved. www.kleo.network
@@ -101,17 +93,16 @@ export const FooterSection = () => {
{/* Text */} -
+
Still have questions?
- Can't find the answer you're looking for? Please chat to our + Can’t find the answer you’re looking for? Please chat to our friendly team. We will do our best to assist you with the questions.
- {/* Discord Button */} {

Join Our Discord
- +
diff --git a/src/pages/home/HeroSection.tsx b/src/pages/home/HeroSection.tsx index f181ddb..6c399e8 100644 --- a/src/pages/home/HeroSection.tsx +++ b/src/pages/home/HeroSection.tsx @@ -1,116 +1,28 @@ -import { useEffect, useRef, useState } from 'react' - -type BackgroundGrid = { - columns: number - rows: number -} +import { ReactComponent as HeroBackground } from '../../assets/images/home/hero_background.svg' export const HeroSection = () => { - const bgGridContainerRef = useRef(null), - [bgGrid, setBgGrid] = useState({ - columns: 0, - rows: 0 - }), - cursorRef = useRef(null) - - function calculateGridSize(): void { - if (bgGridContainerRef.current) { - const columns = Math.ceil(bgGridContainerRef.current.clientWidth / 64), - rows = Math.ceil(bgGridContainerRef.current.clientHeight / 64) - - setBgGrid({ columns, rows }) - } - } - - function moveCursorBackDrop(event: MouseEvent): void { - if (cursorRef.current && window.innerWidth >= 1280) { - const x = event.clientX, - y = event.clientY - - cursorRef.current.style.left = x + 'px' - cursorRef.current.style.top = y + 'px' - } - } - - useEffect(() => { - window.addEventListener('resize', calculateGridSize) - calculateGridSize() - - if (bgGridContainerRef.current) { - bgGridContainerRef.current.addEventListener( - 'mousemove', - moveCursorBackDrop - ) - } - - return () => { - window.removeEventListener('resize', calculateGridSize) - - if (bgGridContainerRef.current) { - bgGridContainerRef.current.removeEventListener( - 'mousemove', - moveCursorBackDrop - ) - } - } - }, []) - return ( -
- {/* Background Grid */} -
-
-
-
- {Array.from({ length: bgGrid.rows }, (_, i) => i + 1).map((row) => ( -
- {Array.from({ length: bgGrid.columns }, (_, i) => i + 1).map( - (column) => ( -
- ) - )} -
- ))} +
+ {/* Hero Background Image */} +
+
-
- {/* Hero Text */} -
- {/* Earn Your + Stack in the AI */} -
- EARN YOUR - - STAKE IN THE AI - -
- {/* Revolution + Create Account */} -
- - REVOLUTION - -
-
- Earn, Govern and Own your data. -
- - Create Account - -
-
+ {/* Hero Text */} +
+
+

AI Agents

+

+ For Your +

+

+ Browser +

+ + Create Account +
diff --git a/src/pages/home/HowKleoWorksSection.tsx b/src/pages/home/HowKleoWorksSection.tsx index 9ea183d..abedf4c 100644 --- a/src/pages/home/HowKleoWorksSection.tsx +++ b/src/pages/home/HowKleoWorksSection.tsx @@ -1,6 +1,6 @@ -import { ReactComponent as Govern } from '../../assets/images/home/howKleoWorks/govern.svg' -import { ReactComponent as Own } from '../../assets/images/home/howKleoWorks/own.svg' -import { ReactComponent as RemovePII } from '../../assets/images/home/howKleoWorks/removePII.svg' +import { ReactComponent as AutomationScript } from '../../assets/images/home/howKleoWorks/automation_script.svg' +import { ReactComponent as AutomateFlow } from '../../assets/images/home/howKleoWorks/automate_flow.svg' +import { ReactComponent as EarnCoins } from '../../assets/images/home/howKleoWorks/earn_coins.svg' export const HowKleoWorksSection = () => { return ( @@ -8,13 +8,13 @@ export const HowKleoWorksSection = () => {
{/* How Kleo Works Question & Answer */} -
+
How Kleo Works?
-
+
Kleo has a three step process to ensure that you are in control of - your data and your data earns while you sleep. + your EarnCoins data and yet get maximum benefits from it.
@@ -23,61 +23,46 @@ export const HowKleoWorksSection = () => { {/* Card - 1 */}
{/* Icon */} - + {/* Text */}
- Confidential + Developers Create Automation Scripts
-
- We prioritize your privacy. Kleo removes all personally - identifiable information, including names, emails, usernames, - addresses, specific locations, and{' '} - - more. - +
+ Skilled developers design custom automation scripts tailored + to solve specific challenges and streamline workflows.
{/* Card - 2 */}
{/* Icon */} - + {/* Text */}
- You Govern Your Data + Use those scripts to automate your flow
-
- Through decentralized smart contracts, your data can only be - accessed if approved by a majority{' '} - - vote on snapshot.org - +
+ With just a few clicks, you can integrate automation scripts + into your processes, eliminating manual tasks and boosting + productivity.
{/* Card - 3 */}
{/* Icon */} - + {/* Text */}
- Ownership + Share your data to earn coins to spend on scripts
-
- Fair Equity Ownership.
- Your rewards are determined by the quantity and quality of - your data contributions. Earn upto $400/month! +
+ Contribute your data securely to earn coins, which can be used + to access or purchase more advanced automation scripts.
diff --git a/src/pages/home/OurPartners.tsx b/src/pages/home/OurPartners.tsx index 3aeafc9..5ae9a30 100644 --- a/src/pages/home/OurPartners.tsx +++ b/src/pages/home/OurPartners.tsx @@ -7,13 +7,13 @@ export const OurPartnersSection = () => {
{/* Text Of Partners */} -
+
Our Partners
-
- We've collaborated with industry leaders to build and scale our - solution. Notable partners include. +
+ We have partnered with industry leaders to help us build and scale + this solution. Notable partners are mentioned here.
diff --git a/src/shared/navbar/Navbar.tsx b/src/shared/navbar/Navbar.tsx index 70ad155..fa54e30 100644 --- a/src/shared/navbar/Navbar.tsx +++ b/src/shared/navbar/Navbar.tsx @@ -106,13 +106,6 @@ const Navbar = () => { > About - - Memo -