├── netlify.toml ├── portfolio ├── .eslintrc ├── static │ └── .gitkeep ├── sanity.cli.js ├── schemaTypes │ ├── index.js │ ├── resume.js │ ├── skillData.js │ ├── allproject.js │ └── blockContent.js ├── tailwind.config.cjs ├── sanity.config.js ├── .gitignore ├── README.md └── package.json ├── vercel.json ├── README.md ├── postcss.config.cjs ├── src ├── client.js ├── pages │ ├── About │ │ ├── AboutPage.jsx │ │ ├── Heroabout.jsx │ │ ├── MobileAbout.jsx │ │ └── About.jsx │ ├── Skills │ │ ├── SkillsPage.jsx │ │ ├── Skills.jsx │ │ ├── Heroskills.jsx │ │ └── MobileSkills.jsx │ ├── Contact │ │ ├── ContactPage.jsx │ │ ├── Herocontact.jsx │ │ ├── Contact.jsx │ │ └── MobileContact.jsx │ ├── Projects │ │ ├── ProjectPage.jsx │ │ ├── MobileProject.jsx │ │ ├── Heroproject.jsx │ │ └── Projects.jsx │ └── Error404.jsx ├── main.jsx ├── components │ ├── useAnimationHook.jsx │ ├── Footer.jsx │ ├── TextSpan.jsx │ ├── ResumeButton.jsx │ ├── useDarkmode.jsx │ ├── Navbar.jsx │ ├── Socials.jsx │ └── MobileNav.jsx ├── index.css └── App.jsx ├── dist ├── assets │ ├── Projects-8e1a892c.css │ ├── index.esm-7ed374dd.js │ ├── Herocontact-c3296ac9.js │ ├── Skills-c0677d61.js │ ├── index-f4bd556f.js │ ├── Heroskills-9f155602.js │ ├── Heroproject-7edc4e95.js │ ├── MobileProject-b97d7e85.js │ ├── MobileAbout-0630c118.js │ ├── MobileSkills-a9c90a9c.js │ ├── index.esm-fbfd1a22.js │ ├── MobileContact-7339019b.js │ ├── index-1f971082.css │ ├── Projects-35dfc950.js │ └── Contact-d6af9908.js ├── .gitignore ├── index.html └── vite.svg ├── vite.config.js ├── .gitignore ├── package.json ├── index.html ├── tailwind.config.cjs └── public └── vite.svg /netlify.toml: -------------------------------------------------------------------------------- 1 | [[redirects]] 2 | from = "/*" 3 | to = "/" 4 | status = 200 5 | -------------------------------------------------------------------------------- /portfolio/.eslintrc: -------------------------------------------------------------------------------- 1 | { 2 | "extends": "@sanity/eslint-config-studio" 3 | } 4 | -------------------------------------------------------------------------------- /vercel.json: -------------------------------------------------------------------------------- 1 | { 2 | "rewrites": [{ "source": "/(.*)", "destination": "/" }] 3 | } 4 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # portfolio_ 2 | Portfolio 3 | 4 | # Technologies: 5 | - React + vite 6 | - Tailwind CSS 7 | -------------------------------------------------------------------------------- /portfolio/static/.gitkeep: -------------------------------------------------------------------------------- 1 | Files placed here will be served by the Sanity server under the `/static`-prefix 2 | -------------------------------------------------------------------------------- /postcss.config.cjs: -------------------------------------------------------------------------------- 1 | module.exports = { 2 | plugins: { 3 | tailwindcss: {}, 4 | autoprefixer: {}, 5 | }, 6 | } 7 | -------------------------------------------------------------------------------- /portfolio/sanity.cli.js: -------------------------------------------------------------------------------- 1 | import {defineCliConfig} from 'sanity/cli' 2 | 3 | export default defineCliConfig({ 4 | api: { 5 | projectId: 'kili4jsv', 6 | dataset: 'production' 7 | } 8 | }) 9 | -------------------------------------------------------------------------------- /src/client.js: -------------------------------------------------------------------------------- 1 | import { createClient } from "@sanity/client"; 2 | 3 | const config = { 4 | projectId: "kili4jsv", 5 | dataset: "production", 6 | useCdn: true, 7 | apiVersion: "2023-10-31", 8 | }; 9 | 10 | export const client = createClient(config); 11 | -------------------------------------------------------------------------------- /portfolio/schemaTypes/index.js: -------------------------------------------------------------------------------- 1 | import blockContent from './blockContent' 2 | import allproject from './allproject' 3 | import skillData from './skillData' 4 | import resume from './resume' 5 | 6 | export const schemaTypes = [blockContent, allproject, skillData, resume] 7 | -------------------------------------------------------------------------------- /dist/assets/Projects-8e1a892c.css: -------------------------------------------------------------------------------- 1 | .lazy-load-image-background.blur{filter:blur(15px)}.lazy-load-image-background.blur.lazy-load-image-loaded{filter:blur(0);transition:filter .3s}.lazy-load-image-background.blur>img{opacity:0}.lazy-load-image-background.blur.lazy-load-image-loaded>img{opacity:1;transition:opacity .3s} 2 | -------------------------------------------------------------------------------- /portfolio/tailwind.config.cjs: -------------------------------------------------------------------------------- 1 | /** @type {import('tailwindcss').Config} */ 2 | module.exports = { 3 | content: [ 4 | './pages/**/*.{js,ts,jsx,tsx}', 5 | './components/**/*.{js,ts,jsx,tsx}', 6 | './app/**/*.{js,ts,jsx,tsx}', 7 | ], 8 | 9 | theme: { 10 | extend: {}, 11 | }, 12 | plugins: [], 13 | } 14 | -------------------------------------------------------------------------------- /portfolio/schemaTypes/resume.js: -------------------------------------------------------------------------------- 1 | import {defineField, defineType} from 'sanity' 2 | 3 | export default defineType({ 4 | name: 'resume', 5 | title: 'Resume', 6 | type: 'document', 7 | fields: [ 8 | defineField({ 9 | name: 'link', 10 | title: 'Link', 11 | type: 'string', 12 | }), 13 | ], 14 | }) 15 | -------------------------------------------------------------------------------- /src/pages/About/AboutPage.jsx: -------------------------------------------------------------------------------- 1 | import About from "./About"; 2 | import Heroabout from "./Heroabout"; 3 | 4 | const AboutPage = () => { 5 | return ( 6 |
7 | 8 | 9 |
10 | ); 11 | }; 12 | 13 | export default AboutPage; 14 | -------------------------------------------------------------------------------- /dist/.gitignore: -------------------------------------------------------------------------------- 1 | # Logs 2 | logs 3 | *.log 4 | npm-debug.log* 5 | yarn-debug.log* 6 | yarn-error.log* 7 | pnpm-debug.log* 8 | lerna-debug.log* 9 | 10 | node_modules 11 | dist 12 | dist-ssr 13 | *.local 14 | 15 | # Editor directories and files 16 | .vscode/* 17 | !.vscode/extensions.json 18 | .idea 19 | .DS_Store 20 | *.suo 21 | *.ntvs* 22 | *.njsproj 23 | *.sln 24 | *.sw? 25 | -------------------------------------------------------------------------------- /src/pages/Skills/SkillsPage.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import Heroskills from "./Heroskills"; 3 | import Skills from "./Skills"; 4 | 5 | const SkillsPage = () => { 6 | return ( 7 |
8 | 9 | 10 |
11 | ); 12 | }; 13 | 14 | export default SkillsPage; 15 | -------------------------------------------------------------------------------- /src/pages/Contact/ContactPage.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import Herocontact from "./Herocontact"; 3 | import Contact from "./Contact"; 4 | 5 | const ContactPage = () => { 6 | return ( 7 |
8 | 9 | 10 |
11 | ); 12 | }; 13 | 14 | export default ContactPage; 15 | -------------------------------------------------------------------------------- /src/pages/Projects/ProjectPage.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import Heroproject from "./Heroproject"; 3 | import Projects from "./Projects"; 4 | 5 | const ProjectPage = () => { 6 | return ( 7 |
8 | 9 | 10 |
11 | ); 12 | }; 13 | 14 | export default ProjectPage; 15 | -------------------------------------------------------------------------------- /vite.config.js: -------------------------------------------------------------------------------- 1 | import { defineConfig } from 'vite'; 2 | import react from '@vitejs/plugin-react'; 3 | 4 | // https://vitejs.dev/config/ 5 | export default defineConfig({ 6 | plugins: [react()], 7 | server: { 8 | host: '0.0.0.0', 9 | port: 5000, 10 | open: true, 11 | origin: 'http://127.0.0.1:5000', 12 | }, 13 | preview: { 14 | host: '0.0.0.0', 15 | port: 3333, 16 | }, 17 | }); -------------------------------------------------------------------------------- /src/main.jsx: -------------------------------------------------------------------------------- 1 | import React from 'react' 2 | import ReactDOM from 'react-dom/client' 3 | import App from './App' 4 | import './index.css' 5 | import { BrowserRouter as Router } from "react-router-dom"; 6 | 7 | ReactDOM.createRoot(document.getElementById("root")).render( 8 | 9 |
10 | 11 | 12 | 13 |
14 |
15 | ); 16 | -------------------------------------------------------------------------------- /portfolio/sanity.config.js: -------------------------------------------------------------------------------- 1 | import {defineConfig} from 'sanity' 2 | import {structureTool} from 'sanity/structure' 3 | import {visionTool} from '@sanity/vision' 4 | import {schemaTypes} from './schemaTypes' 5 | 6 | export default defineConfig({ 7 | name: 'default', 8 | title: 'portfolio', 9 | 10 | projectId: 'kili4jsv', 11 | dataset: 'production', 12 | 13 | plugins: [structureTool(), visionTool()], 14 | 15 | schema: { 16 | types: schemaTypes, 17 | }, 18 | }) 19 | -------------------------------------------------------------------------------- /portfolio/.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # Dependencies 4 | node_modules 5 | /.pnp 6 | .pnp.js 7 | 8 | # Compiled Sanity Studio 9 | /dist 10 | 11 | # Temporary Sanity runtime, generated by the CLI on every dev server start 12 | /.sanity 13 | 14 | # Logs 15 | /logs 16 | *.log 17 | 18 | # Coverage directory used by testing tools 19 | /coverage 20 | 21 | # Misc 22 | .DS_Store 23 | *.pem 24 | 25 | # Typescript 26 | *.tsbuildinfo 27 | 28 | # Dotenv and similar local-only files 29 | *.local 30 | -------------------------------------------------------------------------------- /portfolio/schemaTypes/skillData.js: -------------------------------------------------------------------------------- 1 | import {defineField, defineType} from 'sanity' 2 | 3 | export default defineType({ 4 | name: 'skillData', 5 | title: 'Skills', 6 | type: 'document', 7 | fields: [ 8 | defineField({ 9 | name: 'title', 10 | title: 'Title', 11 | type: 'string', 12 | }), 13 | defineField({ 14 | name: 'color', 15 | title: 'Color', 16 | type: 'string', 17 | }), 18 | defineField({ 19 | name: 'mainImage', 20 | title: 'mainImage', 21 | type: 'image', 22 | options: { 23 | hotspot: true, 24 | }, 25 | }), 26 | ], 27 | }) 28 | -------------------------------------------------------------------------------- /src/components/useAnimationHook.jsx: -------------------------------------------------------------------------------- 1 | import { useEffect } from "react"; 2 | import { useAnimation } from "framer-motion"; 3 | 4 | const useAnimationContainer = (delay = 0.5, duration = 0.7) => { 5 | const controls = useAnimation(); 6 | 7 | useEffect(() => { 8 | const animation = async () => { 9 | await controls.start({ 10 | opacity: 1, 11 | transition: { delay, duration, ease: "easeInOut" }, 12 | }); 13 | }; 14 | 15 | animation(); 16 | 17 | return () => controls.stop(); 18 | }, [controls, delay, duration]); 19 | 20 | return controls; 21 | }; 22 | 23 | export default useAnimationContainer; 24 | -------------------------------------------------------------------------------- /.gitignore: -------------------------------------------------------------------------------- 1 | # See https://help.github.com/articles/ignoring-files/ for more about ignoring files. 2 | 3 | # dependencies 4 | /node_modules 5 | node_modules 6 | /.pnp 7 | .pnp.js 8 | 9 | # testing 10 | /coverage 11 | 12 | # production 13 | /build 14 | 15 | # misc 16 | .DS_Store 17 | .env 18 | .env.local 19 | .env.development.local 20 | .env.test.local 21 | .env.production.local 22 | 23 | 24 | # Logs 25 | logs 26 | *.log 27 | npm-debug.log* 28 | yarn-debug.log* 29 | yarn-error.log* 30 | pnpm-debug.log* 31 | lerna-debug.log* 32 | 33 | /dist 34 | dist-ssr 35 | *.local 36 | 37 | # Editor directories and files 38 | .vscode/* 39 | !.vscode/extensions.json 40 | .idea 41 | .DS_Store 42 | *.suo 43 | *.ntvs* 44 | *.njsproj 45 | *.sln 46 | *.sw? 47 | -------------------------------------------------------------------------------- /src/pages/Error404.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Link } from "react-router-dom"; 3 | 4 | const Error404 = () => { 5 | return ( 6 |
7 |

8 | 404 9 |

10 |

11 | Awwn, it looks like you're lost 🥹 12 |

{" "} 13 | 14 | 17 | 18 |
19 | ); 20 | }; 21 | 22 | export default Error404; 23 | -------------------------------------------------------------------------------- /src/components/Footer.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import Socials from "./Socials"; 3 | function Footer() { 4 | return ( 5 | <> 6 | 7 |
8 |

© 2024 PreshDev.

9 |

10 | Designed by{" "} 11 | 12 | {" "} 13 | @JolaOluwa 14 | 15 |

16 |
17 | 18 | ); 19 | } 20 | 21 | export default Footer; 22 | -------------------------------------------------------------------------------- /portfolio/README.md: -------------------------------------------------------------------------------- 1 | # Sanity Blogging Content Studio 2 | 3 | Congratulations, you have now installed the Sanity Content Studio, an open source real-time content editing environment connected to the Sanity backend. 4 | 5 | Now you can do the following things: 6 | 7 | - [Read “getting started” in the docs](https://www.sanity.io/docs/introduction/getting-started?utm_source=readme) 8 | - Check out the example frontend: [React/Next.js](https://github.com/sanity-io/tutorial-sanity-blog-react-next) 9 | - [Read the blog post about this template](https://www.sanity.io/blog/build-your-own-blog-with-sanity-and-next-js?utm_source=readme) 10 | - [Join the community Slack](https://slack.sanity.io/?utm_source=readme) 11 | - [Extend and build plugins](https://www.sanity.io/docs/content-studio/extending?utm_source=readme) 12 | -------------------------------------------------------------------------------- /dist/index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | preshDev 11 | 12 | 13 | 14 | 15 |
16 | 17 | 18 | 19 | -------------------------------------------------------------------------------- /portfolio/schemaTypes/allproject.js: -------------------------------------------------------------------------------- 1 | import {defineField, defineType} from 'sanity' 2 | 3 | export default defineType({ 4 | name: 'allproject', 5 | title: 'Project', 6 | type: 'document', 7 | fields: [ 8 | defineField({ 9 | name: 'title', 10 | title: 'Title', 11 | type: 'string', 12 | }), 13 | defineField({ 14 | name: 'subtitle', 15 | title: 'SubTitle', 16 | type: 'string', 17 | }), 18 | defineField({ 19 | name: 'language', 20 | title: 'Language', 21 | type: 'string', 22 | }), 23 | defineField({ 24 | name: 'codeLink', 25 | title: 'CodeLink', 26 | type: 'string', 27 | }), 28 | defineField({ 29 | name: 'viewLink', 30 | title: 'ViewLink', 31 | type: 'string', 32 | }), 33 | defineField({ 34 | name: 'mainImage', 35 | title: 'mainImage', 36 | type: 'image', 37 | options: { 38 | hotspot: true, 39 | }, 40 | }), 41 | ], 42 | }) 43 | -------------------------------------------------------------------------------- /portfolio/package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "portfolio", 3 | "private": true, 4 | "version": "1.0.0", 5 | "main": "package.json", 6 | "license": "UNLICENSED", 7 | "scripts": { 8 | "dev": "sanity dev", 9 | "start": "sanity start", 10 | "build": "sanity build", 11 | "deploy": "sanity deploy", 12 | "deploy-graphql": "sanity graphql deploy" 13 | }, 14 | "keywords": [ 15 | "sanity" 16 | ], 17 | "dependencies": { 18 | "@sanity/vision": "^3.32.0", 19 | "react": "^18.2.0", 20 | "react-dom": "^18.2.0", 21 | "react-is": "^18.2.0", 22 | "sanity": "^3.32.0", 23 | "styled-components": "^6.0.7" 24 | }, 25 | "devDependencies": { 26 | "@sanity/eslint-config-studio": "^3.0.1", 27 | "@types/react": "^18.0.25", 28 | "eslint": "^8.6.0", 29 | "prettier": "^3.0.2", 30 | "typescript": "^5.1.6" 31 | }, 32 | "prettier": { 33 | "semi": false, 34 | "printWidth": 100, 35 | "bracketSpacing": false, 36 | "singleQuote": true 37 | } 38 | } 39 | -------------------------------------------------------------------------------- /dist/assets/index.esm-7ed374dd.js: -------------------------------------------------------------------------------- 1 | import{G as r}from"./index-94a40de8.js";function n(t){return r({tag:"svg",attr:{viewBox:"0 0 24 24",strokeWidth:"2",stroke:"currentColor",fill:"none",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"desc",attr:{},child:[]},{tag:"path",attr:{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}},{tag:"path",attr:{d:"M9 19c-4.3 1.4 -4.3 -2.5 -6 -3m12 5v-3.5c0 -1 .1 -1.4 -.5 -2c2.8 -.3 5.5 -1.4 5.5 -6a4.6 4.6 0 0 0 -1.3 -3.2a4.2 4.2 0 0 0 -.1 -3.2s-1.1 -.3 -3.5 1.3a12.3 12.3 0 0 0 -6.2 0c-2.4 -1.6 -3.5 -1.3 -3.5 -1.3a4.2 4.2 0 0 0 -.1 3.2a4.6 4.6 0 0 0 -1.3 3.2c0 4.6 2.7 5.7 5.5 6c-.6 .6 -.6 1.2 -.5 2v3.5"}}]})(t)}function o(t){return r({tag:"svg",attr:{viewBox:"0 0 24 24",strokeWidth:"2",stroke:"currentColor",fill:"none",strokeLinecap:"round",strokeLinejoin:"round"},child:[{tag:"desc",attr:{},child:[]},{tag:"path",attr:{stroke:"none",d:"M0 0h24v24H0z",fill:"none"}},{tag:"path",attr:{d:"M9 15v-6l7.745 10.65a9 9 0 1 1 2.255 -1.993"}},{tag:"path",attr:{d:"M15 12v-3"}}]})(t)}export{o as T,n as a}; 2 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Precious", 3 | "private": true, 4 | "version": "0.0.0", 5 | "type": "module", 6 | "scripts": { 7 | "dev": "vite", 8 | "build": "vite build", 9 | "preview": "vite preview" 10 | }, 11 | "dependencies": { 12 | "@emailjs/browser": "^3.10.0", 13 | "@sanity/client": "^6.15.3", 14 | "antd": "^5.1.6", 15 | "framer-motion": "^8.5.2", 16 | "prettier": "^2.8.2", 17 | "react": "^18.2.0", 18 | "react-dom": "^18.2.0", 19 | "react-hot-toast": "^2.4.0", 20 | "react-icons": "^4.7.1", 21 | "react-lazy-load-image-component": "^1.5.6", 22 | "react-multi-carousel": "^2.8.2", 23 | "react-router-dom": "^6.6.1", 24 | "sweetalert": "^2.1.2" 25 | }, 26 | "devDependencies": { 27 | "@types/react": "^18.0.26", 28 | "@types/react-dom": "^18.0.9", 29 | "@vitejs/plugin-react": "^3.0.0", 30 | "autoprefixer": "^10.4.13", 31 | "postcss": "^8.4.20", 32 | "tailwindcss": "^3.2.4", 33 | "vite": "^4.0.0" 34 | } 35 | } 36 | -------------------------------------------------------------------------------- /src/components/TextSpan.jsx: -------------------------------------------------------------------------------- 1 | import { React, useState } from "react"; 2 | import { motion, useAnimationControls } from "framer-motion"; 3 | 4 | function TextSpan({ children }) { 5 | const [playtext, setPlayText] = useState(false); 6 | const controls = useAnimationControls(); 7 | 8 | const textBand = () => { 9 | controls.start({ 10 | transform: [ 11 | "scale3d(1, 1, 1)", 12 | "scale3d(1.4, .55, 1)", 13 | "scale3d(.75, 1.25, 1)", 14 | "scale3d(1.25, .85, 1)", 15 | "scale3d(.9, 1.05, 1)", 16 | "scale3d(1, 1, 1)", 17 | ], 18 | transition: { 19 | duration: 1 20 | }, 21 | }); 22 | setPlayText(true) 23 | }; 24 | 25 | return ( 26 | { 29 | if (!playtext) textBand(); 30 | }} 31 | onAnimationComplete={() => setPlayText(false)} 32 | > 33 | {children} 34 | 35 | ); 36 | } 37 | 38 | export default TextSpan; 39 | -------------------------------------------------------------------------------- /dist/assets/Herocontact-c3296ac9.js: -------------------------------------------------------------------------------- 1 | import{u as c,j as n,m as d,a as t,T as r}from"./index-94a40de8.js";const p=()=>{const s="Want to work with me?".split(""),o="let`s Connect".split(""),i=c();return n(d.div,{initial:{opacity:0},animate:i,exit:{opacity:0,transition:{ease:"easeInOut"}},children:[t("span",{className:"text-primary dark:text-gray lg:text-[48px] lg:leading-[64px] font-[700] w-[459px]",children:s.map((e,a)=>t(r,{children:e===" "?" ":e},a))}),t("p",{className:"name font-[700] leading-[64px] text-[48px] dark:text-white",children:o.map((e,a)=>t(r,{children:e===" "?" ":e},a))}),n("p",{className:"text-[16px] leading-[24px] text-primary dark:text-white lg:mt-[24px] w-[445px]",children:["I am open to"," ",t("span",{className:"text-secondary dark:text-gray font-bold",children:"remote"})," ","and"," ",t("span",{className:"text-secondary dark:text-gray font-bold",children:"onsite full-time,"})," ","part-time, and contract frontend web development"," ",t("span",{className:"text-secondary dark:text-gray font-bold",children:"jobs."})]})]})};export{p as default}; 2 | -------------------------------------------------------------------------------- /index.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 10 | 11 | 15 | 16 | 20 | preshDev - web developer portfolio 21 | 22 | 23 |
24 | 25 | 30 | 31 | 32 | -------------------------------------------------------------------------------- /tailwind.config.cjs: -------------------------------------------------------------------------------- 1 | /** @type {import('tailwindcss').Config} */ 2 | module.exports = { 3 | content: ["./src/**/*.{js,jsx,ts,tsx}"], 4 | darkMode: "class", 5 | theme: { 6 | screens: { 7 | sm: "480px", 8 | md: "768px", 9 | lg: "1200px", 10 | xl: "1440px", 11 | }, 12 | extend: { 13 | textShadow: { 14 | custom: 15 | "0 0 10px #fff, 0 0 20px #fff, 0 0 40px #fff, 0 0 80px #fff, 0 0 120px #fff", 16 | }, 17 | }, 18 | colors: { 19 | primary: "#494949", 20 | secondary: "#1A1A1A", 21 | resume: "#F2F2F2", 22 | para: "#878787", 23 | nav: "#5D5A5A", 24 | white: "#FFFFFF", 25 | white2: "#EEEEEE", 26 | grey2: "#F8F8F8", 27 | darkgrey: "#1E1E1E", 28 | black: "#302E2E", 29 | bgwhite: "#FOF0F0", 30 | black2: "#000000", 31 | bgblack: "#181918", 32 | blacktoggle: "#0D0C0C", 33 | gray: "#B2B2B3", 34 | }, 35 | }, 36 | plugins: [ 37 | function ({ addUtilities }) { 38 | addUtilities({ 39 | ".text-shadow-custom": { 40 | textShadow: 41 | "0 0 10px #fff, 0 0 20px #fff, 0 0 40px #fff, 0 0 80px #fff, 0 0 120px #fff", 42 | }, 43 | }); 44 | }, 45 | ], 46 | }; 47 | -------------------------------------------------------------------------------- /dist/assets/Skills-c0677d61.js: -------------------------------------------------------------------------------- 1 | import{u as r,a as t,m as n,j as l,R as d,F as x}from"./index-94a40de8.js";import{I as m,S as p,a as f,D as u,b as S,c as g,d as h}from"./index.esm-fbfd1a22.js";import{T as y}from"./index.esm-7ed374dd.js";const T=()=>{const i=r(),s=[{id:1,icons:t(m,{}),text:"Git",color:"#F05032"},{id:2,icons:t(x,{}),text:"React",color:"#60DAFB"},{id:3,icons:t(p,{}),text:"Tailwind",color:"#07B7D4"},{id:4,icons:t(f,{}),text:"HTML",color:"#F16529"},{id:5,icons:t(u,{}),text:"CSS",color:"#2965F1"},{id:6,icons:t(S,{}),text:"JavaScript",color:"#F7DF1E"},{id:7,icons:t(g,{}),text:"TypeScript",color:"#3074C0"},{id:8,icons:t(h,{}),text:"Sass",color:"#C76494"},{id:9,icons:t(y,{}),text:"NextJS",color:"#111"}];return t(n.div,{initial:{opacity:0},animate:i,exit:{opacity:0,transition:{ease:"easeInOut"}},className:"flex justify-center items-center",children:t("ul",{className:"grid grid-cols-2 gap-x-[24px] space-y-3 justify-center items-center",children:s.map(({id:e,icons:a,text:o,color:c})=>t("li",{id:e,className:"w-[200px] h-[96px] bg-white dark:bg-darkgrey flex justify-center items-center hover:scale-95 shadow-md transition-all duration-300",children:l("span",{className:"flex gap-[16px]",children:[d.cloneElement(a,{color:c,size:24}),t("p",{className:"flex justify-center items-center text-[16px] text-black2 dark:text-white leading-[24px]",children:o})]})},e))})})};export{T as default}; 2 | -------------------------------------------------------------------------------- /src/components/ResumeButton.jsx: -------------------------------------------------------------------------------- 1 | import { useEffect } from "react"; 2 | import { useState } from "react"; 3 | import { client } from "../client"; 4 | 5 | const ResumeButton = () => { 6 | const [resume, setResume] = useState([]); 7 | useEffect(() => { 8 | client 9 | .fetch( 10 | `*[_type == "resume"]{ 11 | link 12 | }` 13 | ) 14 | .then((data) => setResume(data)) 15 | 16 | .catch(console.error); 17 | }, []); 18 | return ( 19 |
20 | {resume.map(({ link }) => ( 21 | 28 | 29 | 30 | 31 | View Resumé 32 | 33 | 34 | ))} 35 |
36 | ); 37 | }; 38 | 39 | export default ResumeButton; 40 | -------------------------------------------------------------------------------- /dist/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /public/vite.svg: -------------------------------------------------------------------------------- 1 | -------------------------------------------------------------------------------- /dist/assets/index-f4bd556f.js: -------------------------------------------------------------------------------- 1 | const a={_origin:"https://api.emailjs.com"},p=(t,e="https://api.emailjs.com")=>{a._userID=t,a._origin=e},m=(t,e,i)=>{if(!t)throw"The public key is required. Visit https://dashboard.emailjs.com/admin/account";if(!e)throw"The service ID is required. Visit https://dashboard.emailjs.com/admin";if(!i)throw"The template ID is required. Visit https://dashboard.emailjs.com/admin/templates";return!0};class c{constructor(e){this.status=e?e.status:0,this.text=e?e.responseText:"Network Error"}}const u=(t,e,i={})=>new Promise((o,n)=>{const r=new XMLHttpRequest;r.addEventListener("load",({target:s})=>{const d=new c(s);d.status===200||d.text==="OK"?o(d):n(d)}),r.addEventListener("error",({target:s})=>{n(new c(s))}),r.open("POST",a._origin+t,!0),Object.keys(i).forEach(s=>{r.setRequestHeader(s,i[s])}),r.send(e)}),l=(t,e,i,o)=>{const n=o||a._userID;m(n,t,e);const r={lib_version:"3.10.0",user_id:n,service_id:t,template_id:e,template_params:i};return u("/api/v1.0/email/send",JSON.stringify(r),{"Content-type":"application/json"})},h=t=>{let e;if(typeof t=="string"?e=document.querySelector(t):e=t,!e||e.nodeName!=="FORM")throw"The 3rd parameter is expected to be the HTML form element or the style selector of form";return e},_=(t,e,i,o)=>{const n=o||a._userID,r=h(i);m(n,t,e);const s=new FormData(r);return s.append("lib_version","3.10.0"),s.append("service_id",t),s.append("template_id",e),s.append("user_id",n),u("/api/v1.0/email/send-form",s)},f={init:p,send:l,sendForm:_};export{f as e}; 2 | -------------------------------------------------------------------------------- /dist/assets/Heroskills-9f155602.js: -------------------------------------------------------------------------------- 1 | import{u as d,j as r,m as p,a as e,T as s,r as x}from"./index-94a40de8.js";const h=()=>{const n="I work mostly with".split(""),o="Frontend".split(""),i="Technologies".split(""),l=d();return r(p.div,{initial:{opacity:0},animate:l,exit:{opacity:0,transition:{ease:"easeInOut"}},children:[e("p",{className:"text-primary dark:text-gray text-[48px] leading-[64px] font-[700]",children:n.map((t,a)=>e(s,{children:t===" "?" ":t},a))}),e("p",{className:"text-secondary dark:text-white text-[48px] leading-[64px] font-[700]",children:o.map((t,a)=>e(s,{children:t===" "?" ":t},a))}),e("p",{className:"text-secondary dark:text-white text-[48px] leading-[64px] font-[700]",children:i.map((t,a)=>e(s,{children:t===" "?" ":t},a))}),r("p",{className:"text-[16px] leading-[24px] dark:text-gray text-primary mt-[24px]",children:["Here are some of the"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"tools"})," ","i've worked with over the years, for my"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"personal, professional"})," ","and"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"open source"})," ","projects."]}),e("div",{className:"mt-[32px]",children:r("a",{href:x,target:"_blank",download:"resume",className:"relative w-[160px] h-[48px] group text-center px-6 py-3 font-bold",children:[e("span",{className:"absolute inset-0 w-[160px] h-[48px] border-2 border-darkgrey dark:border-white translate-y-2 translate-x-2 transition duration-300 ease-out transform group-hover:translate-y-0 group-hover:translate-x-0"}),e("span",{className:"absolute inset-0 w-[160px] h-[48px] bg-darkgrey dark:bg-white"}),e("span",{className:"text-resume dark:text-darkgrey text-[16px] text-center font-normal leading-[24px] relative group-hover:opacity-85",children:"View Resumé"})]})})]})};export{h as default}; 2 | -------------------------------------------------------------------------------- /src/pages/Contact/Herocontact.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { motion } from "framer-motion"; 3 | import TextSpan from "../../components/TextSpan"; 4 | import useAnimationHook from "../../components/useAnimationHook"; 5 | 6 | const Herocontact = () => { 7 | const header = "Want to work with me?".split(""); 8 | const sentence = "let`s Connect".split(""); 9 | const controls = useAnimationHook(); 10 | 11 | return ( 12 | 17 | 18 | {header.map((letter, index) => { 19 | return ( 20 | 21 | {letter === " " ? "\u00A0" : letter} 22 | 23 | ); 24 | })} 25 | 26 |

27 | {sentence.map((letter, index) => { 28 | return ( 29 | 30 | {letter === " " ? "\u00A0" : letter} 31 | 32 | ); 33 | })} 34 |

35 | 36 |

37 | I am open to{" "} 38 | remote{" "} 39 | and{" "} 40 | 41 | onsite full-time, 42 | {" "} 43 | part-time, and contract frontend web development{" "} 44 | jobs. 45 |

46 |
47 | ); 48 | }; 49 | 50 | export default Herocontact; 51 | -------------------------------------------------------------------------------- /dist/assets/Heroproject-7edc4e95.js: -------------------------------------------------------------------------------- 1 | import{u as l,j as r,m as d,a as e,T as n}from"./index-94a40de8.js";const c=()=>{const s="I love working on".split(""),o="fun projects".split(""),i=l();return r(d.div,{initial:{opacity:0},animate:i,exit:{opacity:0,transition:{ease:"easeInOut"}},children:[e("span",{className:"text-primary dark:text-gray lg:text-[48px] lg:leading-[64px] font-[700] w-[409px]",children:s.map((t,a)=>e(n,{children:t===" "?" ":t},a))}),e("p",{className:"name font-[700] leading-[64px] text-[48px] dark:text-white",children:o.map((t,a)=>e(n,{children:t===" "?" ":t},a))}),r("p",{className:"text-[16px] leading-[24px] text-primary dark:text-white lg:mt-[24px]",children:["In my leisure time, I enjoy"," ",e("span",{className:"text-secondary dark:text-gray font-bold",children:"experimenting"})," ","with and building things that I find personally"," ",e("span",{className:"text-secondary dark:text-gray font-bold",children:"interesting"})," ","or"," ",e("span",{className:"text-secondary dark:text-gray font-bold",children:"useful."})," ","A few examples of these projects can be found on my"," ",e("span",{className:"text-secondary dark:text-gray font-bold",children:"GitHub page,"})," ","where you can also find other"," ",e("span",{className:"text-secondary dark:text-gray font-bold",children:"miscellaneous creations"})," ","I have worked on."]}),e("div",{className:"lg:mt-[32px]",children:r("a",{href:"https://github.com/preshpi",target:"_blank",className:"relative w-[160px] h-[48px] group text-center px-6 py-3 font-bold",children:[e("span",{className:"absolute inset-0 w-[160px] h-[48px] border-2 border-darkgrey dark:border-white translate-y-2 translate-x-2 transition duration-300 ease-out transform group-hover:translate-y-0 group-hover:translate-x-0"}),e("span",{className:"absolute inset-0 w-[160px] h-[48px] bg-darkgrey dark:bg-white text-resume"}),e("span",{className:"text-resume dark:text-darkgrey text-[16px] text-center font-normal leading-[24px] relative group-hover:opacity-85",children:"View Github"})]})})]})};export{c as default}; 2 | -------------------------------------------------------------------------------- /src/pages/Skills/Skills.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { IoLogoHtml5 } from "react-icons/io"; 3 | import { ImGit } from "react-icons/im"; 4 | import { TbBrandNextjs } from "react-icons/tb"; 5 | import { SiTypescript, SiTailwindcss } from "react-icons/si"; 6 | import { IoLogoSass } from "react-icons/io"; 7 | import { FaReact } from "react-icons/fa"; 8 | import { DiCss3Full, DiJavascript1 } from "react-icons/di"; 9 | import { motion } from "framer-motion"; 10 | import useAnimationHook from "../../components/useAnimationHook"; 11 | import { SkillsData } from "./MobileSkills"; 12 | export const data = [ 13 | { 14 | id: 1, 15 | icons: , 16 | text: "Git", 17 | color: "#F05032", 18 | }, 19 | { 20 | id: 2, 21 | icons: , 22 | text: "React", 23 | color: "#60DAFB", 24 | }, 25 | { 26 | id: 3, 27 | icons: , 28 | text: "Tailwind", 29 | color: "#07B7D4", 30 | }, 31 | { 32 | id: 4, 33 | icons: , 34 | text: "HTML", 35 | color: "#F16529", 36 | }, 37 | { 38 | id: 5, 39 | icons: , 40 | text: "CSS", 41 | color: "#2965F1", 42 | }, 43 | { 44 | id: 6, 45 | icons: , 46 | text: "JavaScript", 47 | color: "#F7DF1E", 48 | }, 49 | { 50 | id: 7, 51 | icons: , 52 | text: "TypeScript", 53 | color: "#3074C0", 54 | }, 55 | { 56 | id: 8, 57 | icons: , 58 | text: "Sass", 59 | color: "#C76494", 60 | }, 61 | { 62 | id: 9, 63 | icons: , 64 | text: "NextJS", 65 | color: "#111", 66 | }, 67 | ]; 68 | const Skills = () => { 69 | const controls = useAnimationHook(); 70 | 71 | return ( 72 | 78 | 79 | 80 | ); 81 | }; 82 | 83 | export default Skills; 84 | -------------------------------------------------------------------------------- /src/components/useDarkmode.jsx: -------------------------------------------------------------------------------- 1 | import { React, useState, useEffect } from "react"; 2 | import { BiSun, BiMoon } from "react-icons/bi"; 3 | 4 | function useDarkmode() { 5 | // It exports a function useDarkmode 6 | // that uses the useState and useEffect hooks to handle 7 | // switching between dark and light mode, and storing the 8 | // theme in the local storage. 9 | // It also uses the onClick event handler on a 10 | // button to trigger the handleThemeSwitch function that 11 | // changes the theme. And it uses the BiSun and 12 | // BiMoon components to display the appropriate icon depending 13 | // on the theme. 14 | 15 | const [theme, setTheme] = useState(localStorage.getItem("theme") || null); 16 | 17 | const handleThemeSwitch = () => { 18 | const newTheme = theme === "dark" ? "light" : "dark"; 19 | setTheme(newTheme); 20 | localStorage.setItem("theme", newTheme); 21 | }; 22 | 23 | useEffect(() => { 24 | const localTheme = localStorage.getItem("theme"); 25 | if (localTheme) { 26 | setTheme(localTheme); 27 | } else if (window.matchMedia("(prefers-color-scheme: dark)").matches) { 28 | setTheme("light"); 29 | localStorage.setItem("theme", "light"); 30 | } else { 31 | setTheme("light"); 32 | localStorage.setItem("theme", "light"); 33 | } 34 | 35 | if (theme === "dark") { 36 | document.documentElement.classList.add("dark"); 37 | } else { 38 | document.documentElement.classList.remove("dark"); 39 | } 40 | }, [theme]); 41 | return ( 42 | 53 | ); 54 | } 55 | 56 | export default useDarkmode; 57 | -------------------------------------------------------------------------------- /dist/assets/MobileProject-b97d7e85.js: -------------------------------------------------------------------------------- 1 | import{u as r,j as t,m as n,a as e}from"./index-94a40de8.js";import s from"./Projects-35dfc950.js";import"./index.esm-7ed374dd.js";function l(){const a=r();return t(n.div,{initial:{opacity:0},animate:a,exit:{opacity:0,transition:{ease:"easeInOut"}},className:"mt-[32px]",children:[t("div",{className:"text-center grid items-center justify-center place-items-center",children:[t("span",{className:"text-secondary dark:text-white font-[700] leading-[30px] md:leading-[50px] text-[24px] md:text-[35px]",children:[e("p",{className:"text-primary dark:text-gray",children:"I love working on fun"})," ","Projects"]}),t("p",{className:"text-[14px] md:text-[20px] leading-[24px] md:leading-[35px] text-para dark:text-gray word-break mt-[24px] md:w-[550px] w-[350px] whitespace-no-wrap",children:["In my leisure time, I enjoy"," ",e("span",{className:"text-secondary dark:text-white font-bold",children:"experimenting"})," ","with and building things that I find personally"," ",e("span",{className:"text-secondary dark:text-white font-bold",children:"interesting"})," ","or"," ",e("span",{className:"text-secondary dark:text-white font-bold",children:"useful."})," ","A few examples of these projects can be found on my"," ",e("span",{className:"text-secondary dark:text-white font-bold",children:"GitHub page,"})," ","where you can also find other"," ",e("span",{className:"text-secondary dark:text-white font-bold",children:"miscellaneous creations"})," ","I have worked on."]}),e("div",{className:"mt-[28px] flex items-center justify-center",children:t("a",{href:"https://github.com/preshpi",target:"_blank",className:"relative w-[160px] h-[48px] group text-center px-6 py-3 font-bold",children:[e("span",{className:"absolute inset-0 w-[160px] h-[48px] border-2 border-darkgrey dark:border-white translate-y-[6px] translate-x-[6px] transition duration-300 ease-out transform group-hover:translate-y-0 group-hover:translate-x-0"}),e("span",{className:"absolute inset-0 w-[160px] h-[48px] bg-darkgrey dark:bg-white text-resume"}),e("span",{className:"text-resume dark:text-darkgrey text-[16px] text-center font-normal leading-[24px] relative group-hover:opacity-85",children:"View Github"})]})})]}),e("div",{className:"mt-[46px]",children:e(s,{})})]})}export{l as default}; 2 | -------------------------------------------------------------------------------- /portfolio/schemaTypes/blockContent.js: -------------------------------------------------------------------------------- 1 | import {defineType, defineArrayMember} from 'sanity' 2 | 3 | /** 4 | * This is the schema definition for the rich text fields used for 5 | * for this blog studio. When you import it in schemas.js it can be 6 | * reused in other parts of the studio with: 7 | * { 8 | * name: 'someName', 9 | * title: 'Some title', 10 | * type: 'blockContent' 11 | * } 12 | */ 13 | export default defineType({ 14 | title: 'Block Content', 15 | name: 'blockContent', 16 | type: 'array', 17 | of: [ 18 | defineArrayMember({ 19 | title: 'Block', 20 | type: 'block', 21 | // Styles let you set what your user can mark up blocks with. These 22 | // correspond with HTML tags, but you can set any title or value 23 | // you want and decide how you want to deal with it where you want to 24 | // use your content. 25 | styles: [ 26 | {title: 'Normal', value: 'normal'}, 27 | {title: 'H1', value: 'h1'}, 28 | {title: 'H2', value: 'h2'}, 29 | {title: 'H3', value: 'h3'}, 30 | {title: 'H4', value: 'h4'}, 31 | {title: 'Quote', value: 'blockquote'}, 32 | ], 33 | lists: [{title: 'Bullet', value: 'bullet'}], 34 | // Marks let you mark up inline text in the block editor. 35 | marks: { 36 | // Decorators usually describe a single property – e.g. a typographic 37 | // preference or highlighting by editors. 38 | decorators: [ 39 | {title: 'Strong', value: 'strong'}, 40 | {title: 'Emphasis', value: 'em'}, 41 | ], 42 | // Annotations can be any object structure – e.g. a link or a footnote. 43 | annotations: [ 44 | { 45 | title: 'URL', 46 | name: 'link', 47 | type: 'object', 48 | fields: [ 49 | { 50 | title: 'URL', 51 | name: 'href', 52 | type: 'url', 53 | }, 54 | ], 55 | }, 56 | ], 57 | }, 58 | }), 59 | // You can add additional types here. Note that you can't use 60 | // primitive types such as 'string' and 'number' in the same array 61 | // as a block type. 62 | defineArrayMember({ 63 | type: 'image', 64 | options: {hotspot: true}, 65 | }), 66 | ], 67 | }) 68 | -------------------------------------------------------------------------------- /src/pages/About/Heroabout.jsx: -------------------------------------------------------------------------------- 1 | import { motion } from "framer-motion"; 2 | import TextSpan from "../../components/TextSpan"; 3 | import useAnimationHook from "../../components/useAnimationHook"; 4 | import ResumeButton from "../../components/ResumeButton"; 5 | function Heroabout() { 6 | const controls = useAnimationHook(); 7 | 8 | const header = "Hello, I'm".split(""); 9 | const sentence = "Precious Egwuenu".split(""); 10 | 11 | return ( 12 | 17 | 18 | {header.map((letter, index) => { 19 | return ( 20 | 21 | {letter === " " ? "\u00A0" : letter} 22 | 23 | ); 24 | })} 25 | 26 | 27 |

28 | {sentence.map((letter, index) => { 29 | return ( 30 | 31 | {letter === " " ? "\u00A0" : letter} 32 | 33 | ); 34 | })} 35 |

36 | 37 |

38 | I am a{" "} 39 | 40 | {" "} 41 | frontend developer{" "} 42 | {" "} 43 | I have a strong background in creating visually appealing and{" "} 44 | 45 | {" "} 46 | user-friendly web experiences. 47 | {" "} 48 | I am motivated to find a role where I can challenge myself{" "} 49 | 50 | and provide value to website users. 51 | {" "} 52 | I am excited to bring my knowledge and experience to a team and 53 | contribute to a company's success. 54 |

55 | 56 |
57 | 58 |
59 |
60 | ); 61 | } 62 | 63 | export default Heroabout; 64 | -------------------------------------------------------------------------------- /dist/assets/MobileAbout-0630c118.js: -------------------------------------------------------------------------------- 1 | import{u as r,j as t,m as n,a as e,r as s}from"./index-94a40de8.js";function o(){const a=r();return t(n.div,{initial:{opacity:0},animate:a,exit:{opacity:0,transition:{ease:"easeInOut"}},className:"mt-[32px] h-[65vh] md:h-[72vh] flex flex-col items-center justify-center",children:[t("div",{className:"text-center grid items-center justify-center place-items-center",children:[t("div",{className:"grid items-center justify-center text-center font-[700] leading-[30px] md:leading-[50px] text-[24px] md:text-[35px]",children:[e("span",{className:"text-primary dark:text-gray",children:"Hello, I'm"}),e("span",{className:"name dark:text-white",children:"Precious Egwuenu"})]}),t("p",{className:"m-5 text-[14px] md:text-[20px] leading-[24px] md:leading-[35px] text-para dark:text-gray word-break mt-[24px] md:w-3/5 whitespace-no-wrap",children:["I am a"," ",t("span",{className:"text-secondary font-bold dark:text-white",children:[" ","frontend developer"," "]})," ","I have a strong background in creating visually appealing and",t("span",{className:"text-secondary font-bold dark:text-white",children:[" ","user-friendly web experiences."," "]})," ","I am motivated to find a role where I can challenge myself"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"and provide value to website users."})," ","I have actively sought internships such as"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"She Code Africa training (SCA)"})," ","HNG, ZURI,"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"and many more to improve my skills."})," ","I am excited to bring my knowledge and experience to a team and contribute to a company's success."]})]}),e("div",{className:"mt-[10%] md:mt-[2%] flex justify-center items-center",children:t("a",{href:s,target:"_blank",download:"resume",className:"relative w-[160px] h-[48px] group text-center px-6 py-3 font-bold cursor-pointer",children:[e("span",{className:"absolute inset-0 w-[160px] h-[48px] border-2 border-darkgrey dark:border-white translate-y-[6px] translate-x-[6px] transition duration-300 ease-out transform group-hover:translate-y-0 group-hover:translate-x-0"}),e("span",{className:"absolute inset-0 w-[160px] h-[48px] bg-darkgrey dark:bg-white"}),e("span",{className:"text-resume dark:text-darkgrey text-[16px] text-center font-normal leading-[24px] relative group-hover:opacity-85",children:"View Resumé"})]})})]})}export{o as default}; 2 | -------------------------------------------------------------------------------- /src/pages/Skills/Heroskills.jsx: -------------------------------------------------------------------------------- 1 | import { motion } from "framer-motion"; 2 | import TextSpan from "../../components/TextSpan"; 3 | import useAnimationHook from "../../components/useAnimationHook"; 4 | import ResumeButton from "../../components/ResumeButton"; 5 | 6 | const Heroskills = () => { 7 | const header = "I work mostly with".split(""); 8 | const sentence = "Frontend".split(""); 9 | const word = "Technologies".split(""); 10 | const controls = useAnimationHook(); 11 | 12 | return ( 13 | 19 |

20 | {header.map((letter, index) => { 21 | return ( 22 | 23 | {letter === " " ? "\u00A0" : letter} 24 | 25 | ); 26 | })} 27 |

28 |

29 | {sentence.map((letter, index) => { 30 | return ( 31 | 32 | {letter === " " ? "\u00A0" : letter} 33 | 34 | ); 35 | })} 36 |

37 |

38 | {word.map((letter, index) => { 39 | return ( 40 | 41 | {letter === " " ? "\u00A0" : letter} 42 | 43 | ); 44 | })} 45 |

46 | 47 |

48 | Here are some of the{" "} 49 | tools{" "} 50 | i've worked with over the years, for my{" "} 51 | 52 | personal, professional 53 | {" "} 54 | and{" "} 55 | 56 | open source 57 | {" "} 58 | projects. 59 |

60 | 61 |
62 | 63 |
64 |
65 | ); 66 | }; 67 | 68 | export default Heroskills; 69 | -------------------------------------------------------------------------------- /src/components/Navbar.jsx: -------------------------------------------------------------------------------- 1 | import { React } from "react"; 2 | import { NavLink } from "react-router-dom"; 3 | const Navbar = () => { 4 | const navItems = [ 5 | { name: "About", path: "/" }, 6 | { name: "Skills", path: "/skills" }, 7 | { name: "Projects", path: "/projects" }, 8 | // { 9 | // name: "Video", 10 | // path: "https://preshpie.notion.site/Video-Editing-Portfolio-ea5a25af009a4423a444f0793132f244?pvs=4", 11 | // external: true, 12 | // }, 13 | { name: "Contact", path: "/contact" }, 14 | { name: "Blog", path: "https://preshblog.vercel.app/", external: true }, 15 | ]; 16 | return ( 17 |
18 |
19 |
    20 | {navItems.map((item, index) => ( 21 |
  • 22 | {item.external ? ( 23 | 29 | {item.name} 30 | 31 | 32 | ) : ( 33 | 36 | `text-xs font-semibold uppercase relative group transition-all duration-300 ${ 37 | isActive 38 | ? "dark:text-white line-through decoration-2 dark:no-underline dark:text-shadow-custom" 39 | : "" 40 | }` 41 | } 42 | > 43 | {item.name} 44 | 45 | 46 | )} 47 |
  • 48 | ))} 49 |
50 |
51 |
52 | ); 53 | }; 54 | 55 | export default Navbar; 56 | -------------------------------------------------------------------------------- /src/components/Socials.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { 3 | FaTiktok, 4 | FaLinkedinIn, 5 | FaTwitter, 6 | FaGithub, 7 | FaShareAlt, 8 | } from "react-icons/fa"; 9 | import { BsInstagram } from "react-icons/bs"; 10 | import { motion } from "framer-motion"; 11 | import { FloatButton } from "antd"; 12 | const Socials = () => { 13 | const socialcontainer = { 14 | hidden: { 15 | opacity: 0, 16 | x: "-100vw", 17 | }, 18 | animate: { 19 | opacity: 1, 20 | x: 0, 21 | transition: { 22 | type: "spring", 23 | stiffness: 50, 24 | ease: "easeInOut", 25 | }, 26 | }, 27 | }; 28 | 29 | return ( 30 | 79 | ); 80 | }; 81 | 82 | export default Socials; 83 | -------------------------------------------------------------------------------- /src/pages/About/MobileAbout.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { motion } from "framer-motion"; 3 | import useAnimationHook from "../../components/useAnimationHook"; 4 | import ResumeButton from "../../components/ResumeButton"; 5 | 6 | function MobileAbout() { 7 | const controls = useAnimationHook(); 8 | 9 | return ( 10 | 16 |
17 |
18 | Hello, I'm 19 | Precious Egwuenu 20 |
21 | 22 |

23 | I am a{" "} 24 | 25 | {" "} 26 | frontend developer{" "} 27 | {" "} 28 | I have a strong background in creating visually appealing and 29 | 30 | {" "} 31 | user-friendly web experiences.{" "} 32 | {" "} 33 | I am motivated to find a role where I can challenge myself{" "} 34 | 35 | and provide value to website users. 36 | {" "} 37 | I have actively sought internships such as{" "} 38 | 39 | She Code Africa training (SCA) 40 | {" "} 41 | HNG, ZURI,{" "} 42 | 43 | and many more to improve my skills. 44 | {" "} 45 | I am excited to bring my knowledge and experience to a team and 46 | contribute to a company's success. 47 |

48 |
49 | 50 |
51 | 52 |
53 |
54 | ); 55 | } 56 | 57 | export default MobileAbout; 58 | -------------------------------------------------------------------------------- /src/index.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; 4 | 5 | body { 6 | font-family: "Space Grotesk", sans-serif; 7 | } 8 | 9 | .navtext { 10 | position: relative; 11 | } 12 | 13 | .navtext::before { 14 | content: ""; 15 | position: absolute; 16 | bottom: -2px; 17 | left: 0; 18 | width: 0; 19 | height: 2px; 20 | background-color: #1a1a1a; 21 | transition: width 0.6s cubic-bezier(0.25, 1, 0.5, 1); 22 | } 23 | 24 | .navtext:hover::before { 25 | width: 100%; 26 | } 27 | 28 | .textGlow { 29 | color: #cfcfcf; 30 | } 31 | 32 | .textGlow:hover { 33 | color: #fff; 34 | text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 40px #fff, 0 0 80px #fff, 35 | 0 0 120px #fff; 36 | } 37 | @media (hover: hover) and (pointer: fine) { 38 | .navtext a:not(.active):hover::before { 39 | left: 0; 40 | right: auto; 41 | width: 100%; 42 | } 43 | } 44 | 45 | span { 46 | display: inline-block; 47 | } 48 | 49 | ::-webkit-scrollbar { 50 | width: 12px; 51 | } 52 | 53 | ::-webkit-scrollbar-track { 54 | background: #5d5a5a; 55 | border-radius: 6px; 56 | margin-block: 0.2rem; 57 | } 58 | 59 | ::-webkit-scrollbar-thumb { 60 | background: linear-gradient(rgb(97, 90, 90), rgb(213, 211, 211)); 61 | border-radius: 6px; 62 | } 63 | 64 | .progress { 65 | --r1: 154%; 66 | --r2: 68.5%; 67 | width: 48px; 68 | height: 48px; 69 | border-radius: 50%; 70 | background: radial-gradient( 71 | var(--r1) var(--r2) at top, 72 | #0000 79.5%, 73 | #03030d 80% 74 | ) 75 | center left, 76 | radial-gradient(var(--r1) var(--r2) at bottom, #03030d 79.5%, #0000 80%) 77 | center center, 78 | radial-gradient(var(--r1) var(--r2) at top, #0000 79.5%, #03030d 80%) center 79 | right, 80 | #dfdfe6; 81 | background-size: 50.5% 220%; 82 | background-position: -100% 0%, 0% 0%, 100% 0%; 83 | background-repeat: no-repeat; 84 | animation: progress-mbj53w 2.4s infinite linear; 85 | } 86 | 87 | .loading { 88 | height: calc(100vh - 14rem); 89 | } 90 | @keyframes progress-mbj53w { 91 | 33% { 92 | background-position: 0% 33%, 100% 33%, 200% 33%; 93 | } 94 | 95 | 66% { 96 | background-position: -100% 66%, 0% 66%, 100% 66%; 97 | } 98 | 99 | 100% { 100 | background-position: 0% 100%, 100% 100%, 200% 100%; 101 | } 102 | } 103 | 104 | .skeleton-loader { 105 | display: flex; 106 | flex-direction: column; 107 | gap: 10px; 108 | padding: 20px; 109 | background: #f0f0f0; 110 | border-radius: 8px; 111 | width: 80%; 112 | margin: 0 auto; 113 | } 114 | 115 | .skeleton-image { 116 | width: 100%; 117 | height: 200px; 118 | background: #e0e0e0; 119 | border-radius: 8px; 120 | } 121 | 122 | .skeleton-text { 123 | width: 100%; 124 | height: 20px; 125 | background: #e0e0e0; 126 | border-radius: 4px; 127 | } 128 | -------------------------------------------------------------------------------- /src/pages/Projects/MobileProject.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import Projects from "./Projects"; 3 | import { motion } from "framer-motion"; 4 | import useAnimationHook from "../../components/useAnimationHook"; 5 | 6 | function MobileProject() { 7 | const controls = useAnimationHook(); 8 | 9 | return ( 10 | 16 |
17 | 18 |

I love working on fun

{" "} 19 | Projects 20 |
21 | 22 |

23 | In my leisure time, I enjoy{" "} 24 | 25 | experimenting 26 | {" "} 27 | with and building things that I find personally{" "} 28 | 29 | interesting 30 | {" "} 31 | or{" "} 32 | 33 | useful. 34 | {" "} 35 | A few examples of these projects can be found on my{" "} 36 | 37 | GitHub page, 38 | {" "} 39 | where you can also find other{" "} 40 | 41 | miscellaneous creations 42 | {" "} 43 | I have worked on. 44 |

45 | 46 | 59 |
60 |
61 | 62 |
63 |
64 | ); 65 | } 66 | 67 | export default MobileProject; 68 | -------------------------------------------------------------------------------- /src/pages/Projects/Heroproject.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { motion } from "framer-motion"; 3 | import TextSpan from "../../components/TextSpan"; 4 | import useAnimationHook from "../../components/useAnimationHook"; 5 | 6 | const Heroproject = () => { 7 | const header = "I love working on".split(""); 8 | const sentence = "fun projects".split(""); 9 | const controls = useAnimationHook(); 10 | 11 | return ( 12 | 18 | 19 | {header.map((letter, index) => { 20 | return ( 21 | 22 | {letter === " " ? "\u00A0" : letter} 23 | 24 | ); 25 | })} 26 | 27 |

28 | {sentence.map((letter, index) => { 29 | return ( 30 | 31 | {letter === " " ? "\u00A0" : letter} 32 | 33 | ); 34 | })} 35 |

36 |

37 | In my leisure time, I enjoy{" "} 38 | 39 | experimenting 40 | {" "} 41 | with and building things that I find personally{" "} 42 | 43 | interesting 44 | {" "} 45 | or{" "} 46 | useful.{" "} 47 | A few examples of these projects can be found on my{" "} 48 | 49 | GitHub page, 50 | {" "} 51 | where you can also find other{" "} 52 | 53 | miscellaneous creations 54 | {" "} 55 | I have worked on. 56 |

57 | 58 | 71 |
72 | ); 73 | }; 74 | 75 | export default Heroproject; 76 | -------------------------------------------------------------------------------- /dist/assets/MobileSkills-a9c90a9c.js: -------------------------------------------------------------------------------- 1 | import{u as l,j as t,m as c,a as e,r as d,R as x,F as p}from"./index-94a40de8.js";import{I as m,S as h,a as y,D as f,b as w,c as g,d as u}from"./index.esm-fbfd1a22.js";import{T as k}from"./index.esm-7ed374dd.js";function j(){const s=l(),r=[{id:1,icons:e(m,{}),text:"Git",color:"#F05032"},{id:2,icons:e(p,{}),text:"React",color:"#60DAFB"},{id:3,icons:e(h,{}),text:"Tailwind",color:"#07B7D4"},{id:4,icons:e(y,{}),text:"HTML",color:"#F16529"},{id:5,icons:e(f,{}),text:"CSS",color:"#2965F1"},{id:6,icons:e(w,{}),text:"JavaScript",color:"#F7DF1E"},{id:7,icons:e(g,{}),text:"TypeScript",color:"#3074C0"},{id:8,icons:e(u,{}),text:"Sass",color:"#C76494"},{id:9,icons:e(k,{}),text:"NextJS",color:"#111"}];return t(c.div,{initial:{opacity:0},animate:s,exit:{opacity:0,transition:{ease:"easeInOut"}},className:"mt-[32px] overflow-auto",children:[t("div",{className:"grid justify-center items-center place-items-center text-center",children:[t("span",{className:"text-primary dark:text-gray text-[24px] md:text-[35px] leading-[30px] md:leading-[50px] font-[700]",children:["I work mostly with"," ",e("p",{className:"text-secondary dark:text-white",children:"Frontend Technologies"})]}),t("p",{className:"text-[14px] md:text-[20px] leading-[24px] md:leading-[35px] text-para dark:text-gray word-break mt-[24px] md:w-[550px] w-[350px] whitespace-no-wrap",children:["Here are some of the"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"tools"})," ","i`ve worked with over the years, for my"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"personal, professional"})," ","and"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"open source"})," ","projects. My"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"soft skills"})," ","have also contributed majorly to my"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"growth"})," ","and abilities"," ",e("span",{className:"text-secondary font-bold dark:text-white",children:"professionally."})]}),e("div",{className:"mt-[28px] flex items-center justify-center",children:t("a",{href:d,target:"_blank",download:"resume",className:"relative w-[160px] h-[48px] group text-center px-6 py-3 font-bold",children:[e("span",{className:"absolute inset-0 w-[160px] h-[48px] border-2 border-darkgrey dark:border-white translate-y-2 translate-x-2 transition duration-300 ease-out transform group-hover:translate-y-0 group-hover:translate-x-0"}),e("span",{className:"absolute inset-0 w-[160px] h-[48px] bg-darkgrey dark:bg-white"}),e("span",{className:"text-resume dark:text-darkgrey text-[16px] text-center font-normal leading-[24px] relative group-hover:opacity-85",children:"View Resumé"})]})})]}),e("div",{className:"flex justify-center items-center mt-[40px]",children:e("ul",{className:"grid grid-cols-2 md:grid-cols-3 gap-x-[24px] space-y-3",children:r.map(({id:a,icons:i,text:o,color:n})=>e("li",{id:a,className:"w-[163px] h-[77px] mt-3 bg-white dark:bg-darkgrey flex justify-center items-center hover:scale-95 shadow-md transition-all duration-300",children:t("span",{className:"flex gap-[16px] w-[101px] justify-evenly",children:[e("span",{className:"w-[35px] h-[35px]",children:x.cloneElement(i,{color:n,size:24})}),e("p",{className:"flex justify-center items-center text-[14px] text-black2 dark:text-white leading-[19px]",children:o})]})},a))})})]})}export{j as default}; 2 | -------------------------------------------------------------------------------- /src/components/MobileNav.jsx: -------------------------------------------------------------------------------- 1 | import React, { useState } from "react"; 2 | import { Link, NavLink } from "react-router-dom"; 3 | import { HiOutlineMenuAlt3 } from "react-icons/hi"; 4 | import { CgClose } from "react-icons/cg"; 5 | import UseDarkmode from "./useDarkmode"; 6 | import { motion } from "framer-motion"; 7 | 8 | function MobileNav() { 9 | const [nav, setNav] = useState(false); 10 | const handleClick = () => setNav(!nav); 11 | const handleClose = () => setNav(!nav); 12 | 13 | const list = [ 14 | { 15 | id: 1, 16 | text: "ABOUT", 17 | path: "/", 18 | }, 19 | { 20 | id: 2, 21 | text: "SKILLS/TOOLS", 22 | path: "/skills", 23 | }, 24 | { 25 | id: 3, 26 | text: "PROJECTS", 27 | path: "/projects", 28 | }, 29 | { 30 | id: 4, 31 | text: "CONTACT", 32 | path: "contact", 33 | }, 34 | { 35 | id: 5, 36 | blog: "BLOG", 37 | }, 38 | { 39 | id: 6, 40 | icon: , 41 | }, 42 | ]; 43 | 44 | const sidebar = { 45 | open: { 46 | opacity: 3, 47 | }, 48 | closed: { 49 | opacity: 0.2, 50 | transistion: { delay: 1.5, duration: 1.5 }, 51 | }, 52 | exit: { 53 | opacity: 1, 54 | transistion: { ease: "easeInOut" }, 55 | }, 56 | }; 57 | 58 | return ( 59 |
60 |
61 |

62 | 66 | PreshDev 67 | 68 |

69 | 70 |
71 | {!nav ? ( 72 | 73 | ) : ( 74 | 75 | )} 76 |
77 |
78 | 79 | 90 |
91 | 95 |
96 | 97 | {list.map(({ id, text, path, icon, blog, video }) => { 98 | return ( 99 | 103 | 104 | {text} 105 | 106 | 107 | {blog} 108 | 109 | {icon} 110 | 111 | ); 112 | })} 113 |
114 |
115 | ); 116 | } 117 | 118 | export default MobileNav; 119 | -------------------------------------------------------------------------------- /src/pages/About/About.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { Carousel } from "antd"; 3 | import { motion } from "framer-motion"; 4 | import useAnimationHook from "../../components/useAnimationHook"; 5 | const About = () => { 6 | const controls = useAnimationHook(); 7 | 8 | const initals = [ 9 | { 10 | id: 1, 11 | text: "FE", 12 | data: [ 13 | { 14 | id: 1, 15 | txt: "F", 16 | }, 17 | { 18 | id: 2, 19 | txt: "R", 20 | }, 21 | { 22 | id: 3, 23 | txt: "O", 24 | }, 25 | { 26 | id: 4, 27 | txt: "N", 28 | }, 29 | { 30 | id: 5, 31 | txt: "T", 32 | }, 33 | { 34 | id: 6, 35 | txt: "E", 36 | }, 37 | { 38 | id: 7, 39 | txt: "N", 40 | }, 41 | { 42 | id: 8, 43 | txt: "D", 44 | }, 45 | ], 46 | }, 47 | 48 | { 49 | id: 2, 50 | text: "PD", 51 | data: [ 52 | { 53 | id: 1, 54 | txt: "P", 55 | }, 56 | { 57 | id: 2, 58 | txt: "R", 59 | }, 60 | { 61 | id: 3, 62 | txt: "E", 63 | }, 64 | { 65 | id: 4, 66 | txt: "S", 67 | }, 68 | { 69 | id: 5, 70 | txt: "H", 71 | }, 72 | { 73 | id: 6, 74 | txt: "D", 75 | }, 76 | { 77 | id: 7, 78 | txt: "E", 79 | }, 80 | { 81 | id: 8, 82 | txt: "V", 83 | }, 84 | ], 85 | }, 86 | ]; 87 | 88 | return ( 89 | 94 |
95 | 96 | {initals.map(({ id, text, data }) => { 97 | return ( 98 |
99 |
100 | 101 |
102 |

103 | {text} 104 |

105 |
106 |
107 |
108 | {data.map(({ txt, id }) => { 109 | return ( 110 |
114 |

{txt}

115 |
116 | ); 117 | })} 118 |
119 |
120 | ); 121 | })} 122 |
123 |
124 |
125 | ); 126 | }; 127 | 128 | export default About; 129 | -------------------------------------------------------------------------------- /src/pages/Contact/Contact.jsx: -------------------------------------------------------------------------------- 1 | import { React, useRef, useState } from "react"; 2 | import emailjs from "@emailjs/browser"; 3 | import { motion } from "framer-motion"; 4 | import swal from "sweetalert"; 5 | import useAnimationHook from "../../components/useAnimationHook"; 6 | 7 | const Contact = () => { 8 | const [name, setName] = useState(""); 9 | const [email, setEmail] = useState(""); 10 | const [message, setMessage] = useState(""); 11 | const form = useRef(); 12 | const controls = useAnimationHook(); 13 | 14 | const handleSubmit = (e) => { 15 | e.preventDefault(); 16 | if (name.length === 0 || email.length === 0 || message.length === 0) { 17 | swal("Please complete filling the form", "error"); 18 | } else { 19 | swal("Successful!", "I'll get back to you!", "success"); 20 | emailjs 21 | .sendForm( 22 | "service_aakyhrk", 23 | "template_scsfe35", 24 | form.current, 25 | "rBHPqsGP1vYUCEoP9" 26 | ) 27 | .then( 28 | (result) => { 29 | console.log(result.text); 30 | console.log("sent"); 31 | }, 32 | (error) => { 33 | console.log(error.text); 34 | } 35 | ); 36 | } 37 | setName(""); 38 | setEmail(""); 39 | setMessage(""); 40 | }; 41 | 42 | return ( 43 | 48 |
53 |
54 | setName(e.target.value)} 61 | className="border-[#2D2929] dark:border-white border-[3px] p-5 outline-none w-[500px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2" 62 | /> 63 | 64 | setEmail(e.target.value)} 71 | className="border-[#2D2929] dark:border-white border-[3px] p-5 outline-none w-[500px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2" 72 | /> 73 | 82 | 83 | 95 |
96 |
97 |
98 | ); 99 | }; 100 | 101 | export default Contact; 102 | -------------------------------------------------------------------------------- /src/pages/Projects/Projects.jsx: -------------------------------------------------------------------------------- 1 | import React, { useEffect, useState } from "react"; 2 | import { TbBrandGithub } from "react-icons/tb"; 3 | import { AiFillEye } from "react-icons/ai"; 4 | import { LazyLoadImage } from "react-lazy-load-image-component"; 5 | import "react-lazy-load-image-component/src/effects/blur.css"; 6 | import { motion } from "framer-motion"; 7 | import useAnimationHook from "../../components/useAnimationHook"; 8 | import { client } from "../../client"; 9 | 10 | const Projects = () => { 11 | const controls = useAnimationHook(); 12 | const [projectData, setProjectData] = useState([]); 13 | const [loading, setLoading] = useState(true); 14 | 15 | useEffect(() => { 16 | client 17 | .fetch( 18 | `*[_type == "allproject"] | order(_createdAt desc) { 19 | title, 20 | subtitle, 21 | language, 22 | codeLink, 23 | viewLink, 24 | mainImage { 25 | asset -> { 26 | _id, 27 | url 28 | }, 29 | alt} 30 | }` 31 | ) 32 | .then((data) => { 33 | setProjectData(data); 34 | setLoading(false); 35 | }) 36 | .catch(console.error); 37 | }, []); 38 | return ( 39 | 45 | {loading 46 | ? [1, 2, 3, 4, 5, 6].map((index) => ( 47 |
48 |
49 |
50 |
51 |
52 |
53 | )) 54 | : projectData.map((projectData, index) => ( 55 |
56 | 60 | {projectData.mainImage && ( 61 | 67 | )} 68 | 69 |
70 |
71 | {projectData.title} 72 |
73 |

74 | {projectData.subtitle} 75 |

76 |

77 | {projectData.language} 78 |

79 |
80 | 81 | <> 82 | 83 | 88 | Code 89 | 90 | 91 | 92 | 93 | 94 | 95 | 100 | View 101 | 102 | 103 |
104 |
105 |
106 |
107 | ))} 108 |
109 | ); 110 | }; 111 | 112 | export default Projects; 113 | -------------------------------------------------------------------------------- /src/App.jsx: -------------------------------------------------------------------------------- 1 | import { React, Suspense, lazy } from "react"; 2 | import { Routes, Route, useLocation } from "react-router-dom"; 3 | import Navbar from "./components/Navbar"; 4 | import Socials from "./components/Socials"; 5 | import Footer from "./components/Footer"; 6 | 7 | import MobileNav from "./components/MobileNav"; 8 | const AboutPage = lazy(() => import("./pages/About/AboutPage")); 9 | const SkillsPage = lazy(() => import("./pages/Skills/SkillsPage")); 10 | const ProjectPage = lazy(() => import("./pages/Projects/ProjectPage")); 11 | const ContactPage = lazy(() => import("./pages/Contact/ContactPage")); 12 | 13 | const MobileAbout = lazy(() => import("./pages/About/MobileAbout")); 14 | const MobileProject = lazy(() => import("./pages/Projects/MobileProject")); 15 | const MobileSkills = lazy(() => import("./pages/Skills/MobileSkills")); 16 | const MobileContact = lazy(() => import("./pages/Contact/MobileContact")); 17 | 18 | import UseDarkmode from "./components/useDarkmode"; 19 | import Error404 from "./pages/Error404"; 20 | 21 | function Loading() { 22 | return ( 23 |
24 |
25 |
26 | ); 27 | } 28 | 29 | function App() { 30 | const location = useLocation(); 31 | 32 | return ( 33 | <> 34 | {/* Large screen */} 35 | 36 |
37 |
38 | 39 |
40 | 41 | }> 45 | 46 | 47 | } 48 | /> 49 | }> 53 | 54 | 55 | } 56 | /> 57 | }> 61 | 62 | 63 | } 64 | /> 65 | }> 69 | 70 | 71 | } 72 | /> 73 | }> 77 | 78 | 79 | } 80 | /> 81 | 82 |
83 |
84 | 85 | 86 |
87 |
88 |
89 | 90 | {/* small screen & tablet */} 91 |
92 | 93 | 94 | }> 98 | 99 | 100 | } 101 | /> 102 | }> 106 | 107 | 108 | } 109 | /> 110 | }> 114 | 115 | 116 | } 117 | /> 118 | }> 122 | 123 | 124 | } 125 | /> 126 | }> 130 | 131 | 132 | } 133 | /> 134 | 135 |
136 |
137 | 138 | ); 139 | } 140 | 141 | export default App; 142 | -------------------------------------------------------------------------------- /src/pages/Skills/MobileSkills.jsx: -------------------------------------------------------------------------------- 1 | import React from "react"; 2 | import { IoLogoHtml5 } from "react-icons/io"; 3 | import { ImGit } from "react-icons/im"; 4 | import { SiTypescript, SiTailwindcss, SiNextdotjs } from "react-icons/si"; 5 | import { IoLogoSass } from "react-icons/io"; 6 | import { FaReact } from "react-icons/fa"; 7 | import { DiCss3Full, DiJavascript1 } from "react-icons/di"; 8 | import { motion } from "framer-motion"; 9 | import useAnimationHook from "../../components/useAnimationHook"; 10 | import { data } from "./Skills"; 11 | import ResumeButton from "../../components/ResumeButton"; 12 | function MobileSkills() { 13 | const controls = useAnimationHook(); 14 | 15 | const data = [ 16 | { 17 | id: 1, 18 | icons: , 19 | text: "Git", 20 | color: "#F05032", 21 | }, 22 | { 23 | id: 2, 24 | icons: , 25 | text: "React", 26 | color: "#60DAFB", 27 | }, 28 | { 29 | id: 3, 30 | icons: , 31 | text: "Tailwind", 32 | color: "#07B7D4", 33 | }, 34 | { 35 | id: 4, 36 | icons: , 37 | text: "HTML", 38 | color: "#F16529", 39 | }, 40 | { 41 | id: 5, 42 | icons: , 43 | text: "CSS", 44 | color: "#2965F1", 45 | }, 46 | { 47 | id: 6, 48 | icons: , 49 | text: "JavaScript", 50 | color: "#F7DF1E", 51 | }, 52 | { 53 | id: 7, 54 | icons: , 55 | text: "TypeScript", 56 | color: "#3074C0", 57 | }, 58 | { 59 | id: 8, 60 | icons: , 61 | text: "Sass", 62 | color: "#C76494", 63 | }, 64 | { 65 | id: 9, 66 | icons: , 67 | text: "NextJS", 68 | color: "#111", 69 | }, 70 | ]; 71 | 72 | return ( 73 | 79 |
80 | 81 | I work mostly with{" "} 82 |

83 | Frontend Technologies 84 |

85 |
86 | 87 |

88 | Here are some of the{" "} 89 | 90 | tools 91 | {" "} 92 | i`ve worked with over the years, for my{" "} 93 | 94 | personal, professional 95 | {" "} 96 | and{" "} 97 | 98 | open source 99 | {" "} 100 | projects. My{" "} 101 | 102 | soft skills 103 | {" "} 104 | have also contributed majorly to my{" "} 105 | 106 | growth 107 | {" "} 108 | and abilities{" "} 109 | 110 | professionally. 111 | 112 |

113 | 114 |
115 | 116 |
117 |
118 | 119 | 120 |
121 | ); 122 | } 123 | 124 | export default MobileSkills; 125 | 126 | export const SkillsData = () => { 127 | return ( 128 |
129 |
    130 | {data.map(({ id, icons, text, color }) => ( 131 |
  • 136 |
    137 | 138 | {React.cloneElement(icons, { color: color, size: 24 })} 139 | 140 |

    141 | {text} 142 |

    143 |
    144 |
  • 145 | ))} 146 |
147 |
148 | ); 149 | }; 150 | -------------------------------------------------------------------------------- /src/pages/Contact/MobileContact.jsx: -------------------------------------------------------------------------------- 1 | import { React, useRef, useState } from "react"; 2 | import toast, { Toaster } from "react-hot-toast"; 3 | import emailjs from "@emailjs/browser"; 4 | import { motion } from "framer-motion"; 5 | import useAnimationHook from "../../components/useAnimationHook"; 6 | 7 | function MobileContact() { 8 | const [name, setName] = useState(""); 9 | const [email, setEmail] = useState(""); 10 | const [message, setMessage] = useState(""); 11 | const error = () => toast.error("Error occured!"); 12 | const success = () => toast.success("Successfully sent!"); 13 | const form = useRef(); 14 | const controls = useAnimationHook(); 15 | 16 | const changeSubmit = (e) => { 17 | e.preventDefault(); 18 | if (name.length === 0 || email.length === 0 || message.length === 0) { 19 | error(); 20 | } else { 21 | success(); 22 | 23 | emailjs 24 | .sendForm( 25 | "service_aakyhrk", 26 | "template_scsfe35", 27 | form.current, 28 | "rBHPqsGP1vYUCEoP9" 29 | ) 30 | .then( 31 | (result) => { 32 | console.log(result.text); 33 | console.log("sent"); 34 | }, 35 | (error) => { 36 | console.log(error.text); 37 | } 38 | ); 39 | } 40 | setName(""); 41 | setEmail(""); 42 | setMessage(""); 43 | }; 44 | 45 | return ( 46 | 52 |
53 | 54 | Want to work with me? 55 |

let's Connect

56 |
57 | 58 |

59 | I am open to{" "} 60 | 61 | remote 62 | {" "} 63 | and{" "} 64 | 65 | onsite full-time, part-time 66 | {" "} 67 | roles. If you've got anything you think I'd be interested in then{" "} 68 | 69 | fill the form. 70 | 71 |

72 |
73 | 74 |
75 |
76 | setName(e.target.value)} 83 | className="border-[#2D2929] dark:border-white border-[3px] p-5 outline-none w-[320px] md:w-[500px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2" 84 | /> 85 | 86 | setEmail(e.target.value)} 93 | className="border-[#2D2929] dark:border-white border-[3px] p-5 outline-none w-[320px] md:w-[500px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2" 94 | /> 95 | 104 | 105 | 117 |
118 | 130 | 131 |
132 | ); 133 | } 134 | 135 | export default MobileContact; 136 | -------------------------------------------------------------------------------- /dist/assets/index.esm-fbfd1a22.js: -------------------------------------------------------------------------------- 1 | import{G as c}from"./index-94a40de8.js";function i(t){return c({tag:"svg",attr:{viewBox:"0 0 512 512"},child:[{tag:"path",attr:{d:"M64 32l34.936 403.213L255.769 480l157.245-44.854L448 32H64zm307.997 132h-184l3.991 51h176.008l-13.505 151.386-98.5 28.094-98.682-27.976L150.545 289h48.254l3.423 39.287 53.769 14.781 53.422-14.915L314.987 264H147.986l-12.571-149.589 240.789.016L371.997 164z"}}]})(t)}function l(t){return c({tag:"svg",attr:{viewBox:"0 0 512 512"},child:[{tag:"path",attr:{d:"M511.784 329.108c-1.67-13.599-9.236-24.146-20.795-32.416 2.857 2.04 5.275 3.766-.055-.041-7.189-5.131-3.38-2.411-.047-.032-28.5-20.301-65.676-15.789-96.733-4.511-12.447-20.295-12.987-35.783-5.816-57.937.929-2.8.295-4.354-2.624-5.604-7.086-3.03-17.291-1.427-24.422.463-2.462.646-4.254 1.9-4.8 4.381-5.154 24.243-21.009 46.448-34.828 66.886-9.731-18.652-8.96-33.087-2.414-52.516.798-2.366.431-3.624-1.937-4.879-7.26-3.757-18.401-1.912-25.8.276-8.509 2.482-21.29 44.594-25.372 52.946-8.531 17.442-16.091 44.665-30.585 58.502-12.3-15.807 22.526-51.517 10.882-65.851-3.938-4.848-11.063-4.723-15.586-.616 1.085-7.608 1.648-12.609-.32-19.063-2.081-6.79-7.361-10.687-15.09-10.49-17.995.527-33.843 13.815-44.641 26.397-10.277 12.105-37.381 19.627-51.953 26.927-25.032-21.807-79.221-44.947-80.632-82.081-1.528-41.846 48.319-70.245 81.597-87.228 43.28-22.104 109.961-49.608 159.138-25.436 13.049 6.414 18.299 20.171 14.707 33.348-9.368 34.366-47.198 57.293-80.103 67.807-16.189 5.175-33.969 9.027-51.1 8.026-22.955-1.343-40.83-15.224-43.281-16.086-2.049-.389-1.888 2.261-1.347 3.664 23.816 62.433 144.417 16.681 175.956-15.371 15.189-15.421 24.413-30.365 28.351-53.894 4.616-27.583-15.634-44.842-31.004-51.957-77.918-36.072-185.636 11.168-244.553 59.327-25.568 20.901-57.552 54.11-42.874 88.946 15.93 37.805 64.736 57.19 96.503 80.312-25.704 12.773-57.862 25.983-74.518 49.933-9.524 13.729-12.903 28.359-5.811 43.966 12.572 27.568 58.285 15.622 77.573 3.471 17.67-11.13 29.563-26.07 34.7-45.228 4.455-16.609 3.541-33.866-3.856-49.512l28.585-14.458c-7.697 23.076-11.097 52.003 4.881 72.855 6.402 8.338 23.017 8.675 29.817.311 8.816-10.943 14.664-24.655 20.503-37.206-.682 9.373-1.856 19.996 1.377 28.165 3.71 9.373 12.126 11.291 20.792 5.343 26.52-18.203 43.398-68.652 56.463-98.062 3.552 12.829 7.473 24.548 13.957 36.376 1.602 2.903 1.407 4.774-.796 7.195-9.685 10.675-32.826 28.479-35.069 42.899-.524 3.371 1.713 6.599 5.686 7.37 15.573 3.108 32.838-2.531 45.482-11.078 13.188-8.922 17.446-21.087 14.245-35.515-4.576-20.771 10.993-43.98 25.801-61.03 2.719 12.908 6.816 25.331 14.143 36.606-13.075 11.483-32.58 27.764-29.779 46.939.988 6.865 7.135 11.301 14.514 9.736 15.783-3.324 29.416-10.113 39.37-22.146 9.023-10.855 5.792-22.701 1.856-34.635 23.872-6.815 48.022-8.177 71.831-.027 11.495 3.91 20.755 10.5 26.248 20.818 6.726 12.644 2.939 24.292-10.05 32.604-3.287 2.104-5.562 3.833-4.45 4.743 1.112.911 4.9 2.113 13.284-3.152 8.384-5.267 13.51-12.383 14.823-21.725a37.09 37.09 0 0 0-.024-7.755zm-398.838 25.259c-1.358 16.673-9.636 30.193-23.175 41.114-7.617 6.158-17.102 11.176-26.52 12.092-9.418.917-16.751-1.461-17.378-11.23-1.764-27.493 40.923-54.424 64.625-62.533 2.02 6.86 3.011 13.666 2.432 20.587l.016-.03zm103.102-72.453c-3.903 22.309-14.83 62.347-32.314 78.336-2.356 2.143-4.61 2.018-5.809-.771-10.345-24.059 3.671-73.669 33.082-81.328 3.457-.889 5.602.582 5.041 3.763zm70.311 81.768c8.422-8.962 16.834-17.916 25.269-26.927 1.043 10.021-17.571 29.964-25.269 26.927zm80.714-17.696c-2.348 1.273-7.621 2.515-7.827.835-1.482-12.085 11.816-24.874 20.067-30.867 4.453 11.343-.818 23.834-12.24 30.032z"}}]})(t)}function r(t){return c({tag:"svg",attr:{version:"1.1",viewBox:"0 0 16 16"},child:[{tag:"path",attr:{d:"M15.698 7.287l-6.986-6.986c-0.402-0.402-1.055-0.402-1.457 0l-1.623 1.623 1.221 1.221c0.196-0.094 0.415-0.146 0.647-0.146 0.828 0 1.5 0.672 1.5 1.5 0 0.232-0.053 0.451-0.146 0.647l2 2c0.196-0.094 0.415-0.146 0.647-0.146 0.828 0 1.5 0.672 1.5 1.5s-0.672 1.5-1.5 1.5-1.5-0.672-1.5-1.5c0-0.232 0.053-0.451 0.146-0.647l-2-2c-0.048 0.023-0.097 0.043-0.147 0.061v4.171c0.583 0.206 1 0.761 1 1.414 0 0.828-0.672 1.5-1.5 1.5s-1.5-0.672-1.5-1.5c0-0.653 0.417-1.208 1-1.414v-4.171c-0.583-0.206-1-0.761-1-1.414 0-0.232 0.053-0.451 0.146-0.647l-1.221-1.221-4.623 4.623c-0.402 0.403-0.402 1.055 0 1.458l6.986 6.986c0.402 0.402 1.054 0.402 1.457 0l6.953-6.953c0.402-0.403 0.402-1.055-0-1.458z"}}]})(t)}function o(t){return c({tag:"svg",attr:{role:"img",viewBox:"0 0 24 24"},child:[{tag:"title",attr:{},child:[]},{tag:"path",attr:{d:"M12.001,4.8c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 C13.666,10.618,15.027,12,18.001,12c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C16.337,6.182,14.976,4.8,12.001,4.8z M6.001,12c-3.2,0-5.2,1.6-6,4.8c1.2-1.6,2.6-2.2,4.2-1.8c0.913,0.228,1.565,0.89,2.288,1.624 c1.177,1.194,2.538,2.576,5.512,2.576c3.2,0,5.2-1.6,6-4.8c-1.2,1.6-2.6,2.2-4.2,1.8c-0.913-0.228-1.565-0.89-2.288-1.624 C10.337,13.382,8.976,12,6.001,12z"}}]})(t)}function s(t){return c({tag:"svg",attr:{role:"img",viewBox:"0 0 24 24"},child:[{tag:"title",attr:{},child:[]},{tag:"path",attr:{d:"M1.125 0C.502 0 0 .502 0 1.125v21.75C0 23.498.502 24 1.125 24h21.75c.623 0 1.125-.502 1.125-1.125V1.125C24 .502 23.498 0 22.875 0zm17.363 9.75c.612 0 1.154.037 1.627.111a6.38 6.38 0 0 1 1.306.34v2.458a3.95 3.95 0 0 0-.643-.361 5.093 5.093 0 0 0-.717-.26 5.453 5.453 0 0 0-1.426-.2c-.3 0-.573.028-.819.086a2.1 2.1 0 0 0-.623.242c-.17.104-.3.229-.393.374a.888.888 0 0 0-.14.49c0 .196.053.373.156.529.104.156.252.304.443.444s.423.276.696.41c.273.135.582.274.926.416.47.197.892.407 1.266.628.374.222.695.473.963.753.268.279.472.598.614.957.142.359.214.776.214 1.253 0 .657-.125 1.21-.373 1.656a3.033 3.033 0 0 1-1.012 1.085 4.38 4.38 0 0 1-1.487.596c-.566.12-1.163.18-1.79.18a9.916 9.916 0 0 1-1.84-.164 5.544 5.544 0 0 1-1.512-.493v-2.63a5.033 5.033 0 0 0 3.237 1.2c.333 0 .624-.03.872-.09.249-.06.456-.144.623-.25.166-.108.29-.234.373-.38a1.023 1.023 0 0 0-.074-1.089 2.12 2.12 0 0 0-.537-.5 5.597 5.597 0 0 0-.807-.444 27.72 27.72 0 0 0-1.007-.436c-.918-.383-1.602-.852-2.053-1.405-.45-.553-.676-1.222-.676-2.005 0-.614.123-1.141.369-1.582.246-.441.58-.804 1.004-1.089a4.494 4.494 0 0 1 1.47-.629 7.536 7.536 0 0 1 1.77-.201zm-15.113.188h9.563v2.166H9.506v9.646H6.789v-9.646H3.375z"}}]})(t)}function v(t){return c({tag:"svg",attr:{version:"1.1",viewBox:"0 0 32 32"},child:[{tag:"path",attr:{d:"M8.054 6.045l-0.76 3.799h15.462l-0.483 2.454h-15.472l-0.749 3.799h15.462l-0.862 4.333-6.232 2.064-5.4-2.064 0.37-1.879h-3.799l-0.904 4.558 8.932 3.419 10.297-3.419 1.366-6.858 0.277-1.376 1.756-8.829h-19.26z"}}]})(t)}function g(t){return c({tag:"svg",attr:{version:"1.1",viewBox:"0 0 32 32"},child:[{tag:"path",attr:{d:"M9.633 7.968h3.751v10.514c0 4.738-2.271 6.392-5.899 6.392-0.888 0-2.024-0.148-2.764-0.395l0.42-3.036c0.518 0.173 1.185 0.296 1.925 0.296 1.58 0 2.567-0.716 2.567-3.282v-10.489zM16.641 20.753c0.987 0.518 2.567 1.037 4.171 1.037 1.728 0 2.641-0.716 2.641-1.826 0-1.012-0.79-1.629-2.789-2.32-2.764-0.987-4.59-2.517-4.59-4.961 0-2.838 2.394-4.985 6.293-4.985 1.9 0 3.258 0.37 4.245 0.839l-0.839 3.011c-0.642-0.321-1.851-0.79-3.455-0.79-1.629 0-2.419 0.765-2.419 1.604 0 1.061 0.913 1.53 3.085 2.369 2.937 1.086 4.294 2.616 4.294 4.985 0 2.789-2.122 5.158-6.688 5.158-1.9 0-3.776-0.518-4.714-1.037l0.765-3.085z"}}]})(t)}export{v as D,r as I,o as S,i as a,g as b,s as c,l as d}; 2 | -------------------------------------------------------------------------------- /dist/assets/MobileContact-7339019b.js: -------------------------------------------------------------------------------- 1 | import{b as c,u as q,j as w,m as L,a as f}from"./index-94a40de8.js";import{e as U}from"./index-f4bd556f.js";let R={data:""},Y=e=>typeof window=="object"?((e?e.querySelector("#_goober"):window._goober)||Object.assign((e||document.head).appendChild(document.createElement("style")),{innerHTML:" ",id:"_goober"})).firstChild:e||R,B=/(?:([\u0080-\uFFFF\w-%@]+) *:? *([^{;]+?);|([^;}{]*?) *{)|(}\s*)/g,G=/\/\*[^]*?\*\/| +/g,S=/\n+/g,b=(e,t)=>{let a="",o="",s="";for(let r in e){let n=e[r];r[0]=="@"?r[1]=="i"?a=r+" "+n+";":o+=r[1]=="f"?b(n,r):r+"{"+b(n,r[1]=="k"?"":t)+"}":typeof n=="object"?o+=b(n,t?t.replace(/([^,])+/g,i=>r.replace(/(^:.*)|([^,])+/g,l=>/&/.test(l)?l.replace(/&/g,i):i?i+" "+l:l)):r):n!=null&&(r=/^--/.test(r)?r:r.replace(/[A-Z]/g,"-$&").toLowerCase(),s+=b.p?b.p(r,n):r+":"+n+";")}return a+(t&&s?t+"{"+s+"}":s)+o},h={},T=e=>{if(typeof e=="object"){let t="";for(let a in e)t+=a+T(e[a]);return t}return e},W=(e,t,a,o,s)=>{let r=T(e),n=h[r]||(h[r]=(l=>{let d=0,p=11;for(;d>>0;return"go"+p})(r));if(!h[n]){let l=r!==e?e:(d=>{let p,u,m=[{}];for(;p=B.exec(d.replace(G,""));)p[4]?m.shift():p[3]?(u=p[3].replace(S," ").trim(),m.unshift(m[0][u]=m[0][u]||{})):m[0][p[1]]=p[2].replace(S," ").trim();return m[0]})(e);h[n]=b(s?{["@keyframes "+n]:l}:l,a?"":"."+n)}let i=a&&h.g?h.g:null;return a&&(h.g=h[n]),((l,d,p,u)=>{u?d.data=d.data.replace(u,l):d.data.indexOf(l)===-1&&(d.data=p?l+d.data:d.data+l)})(h[n],t,o,i),n},Z=(e,t,a)=>e.reduce((o,s,r)=>{let n=t[r];if(n&&n.call){let i=n(a),l=i&&i.props&&i.props.className||/^go/.test(i)&&i;n=l?"."+l:i&&typeof i=="object"?i.props?"":b(i,""):i===!1?"":i}return o+s+(n??"")},"");function F(e){let t=this||{},a=e.call?e(t.p):e;return W(a.unshift?a.raw?Z(a,[].slice.call(arguments,1),t.p):a.reduce((o,s)=>Object.assign(o,s&&s.call?s(t.p):s),{}):a,Y(t.target),t.g,t.o,t.k)}let _,I,A;F.bind({g:1});let y=F.bind({k:1});function J(e,t,a,o){b.p=t,_=e,I=a,A=o}function v(e,t){let a=this||{};return function(){let o=arguments;function s(r,n){let i=Object.assign({},r),l=i.className||s.className;a.p=Object.assign({theme:I&&I()},i),a.o=/ *go\d+/.test(l),i.className=F.apply(a,o)+(l?" "+l:""),t&&(i.ref=n);let d=e;return e[0]&&(d=i.as||e,delete i.as),A&&d[0]&&A(i),_(d,i)}return t?t(s):s}}var Q=e=>typeof e=="function",O=(e,t)=>Q(e)?e(t):e,V=(()=>{let e=0;return()=>(++e).toString()})(),H=(()=>{let e;return()=>{if(e===void 0&&typeof window<"u"){let t=matchMedia("(prefers-reduced-motion: reduce)");e=!t||t.matches}return e}})(),X=20,$=new Map,K=1e3,z=e=>{if($.has(e))return;let t=setTimeout(()=>{$.delete(e),k({type:4,toastId:e})},K);$.set(e,t)},ee=e=>{let t=$.get(e);t&&clearTimeout(t)},P=(e,t)=>{switch(t.type){case 0:return{...e,toasts:[t.toast,...e.toasts].slice(0,X)};case 1:return t.toast.id&&ee(t.toast.id),{...e,toasts:e.toasts.map(r=>r.id===t.toast.id?{...r,...t.toast}:r)};case 2:let{toast:a}=t;return e.toasts.find(r=>r.id===a.id)?P(e,{type:1,toast:a}):P(e,{type:0,toast:a});case 3:let{toastId:o}=t;return o?z(o):e.toasts.forEach(r=>{z(r.id)}),{...e,toasts:e.toasts.map(r=>r.id===o||o===void 0?{...r,visible:!1}:r)};case 4:return t.toastId===void 0?{...e,toasts:[]}:{...e,toasts:e.toasts.filter(r=>r.id!==t.toastId)};case 5:return{...e,pausedAt:t.time};case 6:let s=t.time-(e.pausedAt||0);return{...e,pausedAt:void 0,toasts:e.toasts.map(r=>({...r,pauseDuration:r.pauseDuration+s}))}}},j=[],C={toasts:[],pausedAt:void 0},k=e=>{C=P(C,e),j.forEach(t=>{t(C)})},te={blank:4e3,error:4e3,success:2e3,loading:1/0,custom:4e3},ae=(e={})=>{let[t,a]=c.useState(C);c.useEffect(()=>(j.push(a),()=>{let s=j.indexOf(a);s>-1&&j.splice(s,1)}),[t]);let o=t.toasts.map(s=>{var r,n;return{...e,...e[s.type],...s,duration:s.duration||((r=e[s.type])==null?void 0:r.duration)||(e==null?void 0:e.duration)||te[s.type],style:{...e.style,...(n=e[s.type])==null?void 0:n.style,...s.style}}});return{...t,toasts:o}},re=(e,t="blank",a)=>({createdAt:Date.now(),visible:!0,type:t,ariaProps:{role:"status","aria-live":"polite"},message:e,pauseDuration:0,...a,id:(a==null?void 0:a.id)||V()}),E=e=>(t,a)=>{let o=re(t,e,a);return k({type:2,toast:o}),o.id},g=(e,t)=>E("blank")(e,t);g.error=E("error");g.success=E("success");g.loading=E("loading");g.custom=E("custom");g.dismiss=e=>{k({type:3,toastId:e})};g.remove=e=>k({type:4,toastId:e});g.promise=(e,t,a)=>{let o=g.loading(t.loading,{...a,...a==null?void 0:a.loading});return e.then(s=>(g.success(O(t.success,s),{id:o,...a,...a==null?void 0:a.success}),s)).catch(s=>{g.error(O(t.error,s),{id:o,...a,...a==null?void 0:a.error})}),e};var se=(e,t)=>{k({type:1,toast:{id:e,height:t}})},oe=()=>{k({type:5,time:Date.now()})},ie=e=>{let{toasts:t,pausedAt:a}=ae(e);c.useEffect(()=>{if(a)return;let r=Date.now(),n=t.map(i=>{if(i.duration===1/0)return;let l=(i.duration||0)+i.pauseDuration-(r-i.createdAt);if(l<0){i.visible&&g.dismiss(i.id);return}return setTimeout(()=>g.dismiss(i.id),l)});return()=>{n.forEach(i=>i&&clearTimeout(i))}},[t,a]);let o=c.useCallback(()=>{a&&k({type:6,time:Date.now()})},[a]),s=c.useCallback((r,n)=>{let{reverseOrder:i=!1,gutter:l=8,defaultPosition:d}=n||{},p=t.filter(x=>(x.position||d)===(r.position||d)&&x.height),u=p.findIndex(x=>x.id===r.id),m=p.filter((x,D)=>Dx.visible).slice(...i?[m+1]:[0,m]).reduce((x,D)=>x+(D.height||0)+l,0)},[t]);return{toasts:t,handlers:{updateHeight:se,startPause:oe,endPause:o,calculateOffset:s}}},ne=y` 2 | from { 3 | transform: scale(0) rotate(45deg); 4 | opacity: 0; 5 | } 6 | to { 7 | transform: scale(1) rotate(45deg); 8 | opacity: 1; 9 | }`,le=y` 10 | from { 11 | transform: scale(0); 12 | opacity: 0; 13 | } 14 | to { 15 | transform: scale(1); 16 | opacity: 1; 17 | }`,de=y` 18 | from { 19 | transform: scale(0) rotate(90deg); 20 | opacity: 0; 21 | } 22 | to { 23 | transform: scale(1) rotate(90deg); 24 | opacity: 1; 25 | }`,ce=v("div")` 26 | width: 20px; 27 | opacity: 0; 28 | height: 20px; 29 | border-radius: 10px; 30 | background: ${e=>e.primary||"#ff4b4b"}; 31 | position: relative; 32 | transform: rotate(45deg); 33 | 34 | animation: ${ne} 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 35 | forwards; 36 | animation-delay: 100ms; 37 | 38 | &:after, 39 | &:before { 40 | content: ''; 41 | animation: ${le} 0.15s ease-out forwards; 42 | animation-delay: 150ms; 43 | position: absolute; 44 | border-radius: 3px; 45 | opacity: 0; 46 | background: ${e=>e.secondary||"#fff"}; 47 | bottom: 9px; 48 | left: 4px; 49 | height: 2px; 50 | width: 12px; 51 | } 52 | 53 | &:before { 54 | animation: ${de} 0.15s ease-out forwards; 55 | animation-delay: 180ms; 56 | transform: rotate(90deg); 57 | } 58 | `,pe=y` 59 | from { 60 | transform: rotate(0deg); 61 | } 62 | to { 63 | transform: rotate(360deg); 64 | } 65 | `,ue=v("div")` 66 | width: 12px; 67 | height: 12px; 68 | box-sizing: border-box; 69 | border: 2px solid; 70 | border-radius: 100%; 71 | border-color: ${e=>e.secondary||"#e0e0e0"}; 72 | border-right-color: ${e=>e.primary||"#616161"}; 73 | animation: ${pe} 1s linear infinite; 74 | `,me=y` 75 | from { 76 | transform: scale(0) rotate(45deg); 77 | opacity: 0; 78 | } 79 | to { 80 | transform: scale(1) rotate(45deg); 81 | opacity: 1; 82 | }`,ge=y` 83 | 0% { 84 | height: 0; 85 | width: 0; 86 | opacity: 0; 87 | } 88 | 40% { 89 | height: 0; 90 | width: 6px; 91 | opacity: 1; 92 | } 93 | 100% { 94 | opacity: 1; 95 | height: 10px; 96 | }`,fe=v("div")` 97 | width: 20px; 98 | opacity: 0; 99 | height: 20px; 100 | border-radius: 10px; 101 | background: ${e=>e.primary||"#61d345"}; 102 | position: relative; 103 | transform: rotate(45deg); 104 | 105 | animation: ${me} 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 106 | forwards; 107 | animation-delay: 100ms; 108 | &:after { 109 | content: ''; 110 | box-sizing: border-box; 111 | animation: ${ge} 0.2s ease-out forwards; 112 | opacity: 0; 113 | animation-delay: 200ms; 114 | position: absolute; 115 | border-right: 2px solid; 116 | border-bottom: 2px solid; 117 | border-color: ${e=>e.secondary||"#fff"}; 118 | bottom: 6px; 119 | left: 6px; 120 | height: 10px; 121 | width: 6px; 122 | } 123 | `,xe=v("div")` 124 | position: absolute; 125 | `,he=v("div")` 126 | position: relative; 127 | display: flex; 128 | justify-content: center; 129 | align-items: center; 130 | min-width: 20px; 131 | min-height: 20px; 132 | `,ye=y` 133 | from { 134 | transform: scale(0.6); 135 | opacity: 0.4; 136 | } 137 | to { 138 | transform: scale(1); 139 | opacity: 1; 140 | }`,be=v("div")` 141 | position: relative; 142 | transform: scale(0.6); 143 | opacity: 0.4; 144 | min-width: 20px; 145 | animation: ${ye} 0.3s 0.12s cubic-bezier(0.175, 0.885, 0.32, 1.275) 146 | forwards; 147 | `,ve=({toast:e})=>{let{icon:t,type:a,iconTheme:o}=e;return t!==void 0?typeof t=="string"?c.createElement(be,null,t):t:a==="blank"?null:c.createElement(he,null,c.createElement(ue,{...o}),a!=="loading"&&c.createElement(xe,null,a==="error"?c.createElement(ce,{...o}):c.createElement(fe,{...o})))},we=e=>` 148 | 0% {transform: translate3d(0,${e*-200}%,0) scale(.6); opacity:.5;} 149 | 100% {transform: translate3d(0,0,0) scale(1); opacity:1;} 150 | `,ke=e=>` 151 | 0% {transform: translate3d(0,0,-1px) scale(1); opacity:1;} 152 | 100% {transform: translate3d(0,${e*-150}%,-1px) scale(.6); opacity:0;} 153 | `,Ee="0%{opacity:0;} 100%{opacity:1;}",Ne="0%{opacity:1;} 100%{opacity:0;}",$e=v("div")` 154 | display: flex; 155 | align-items: center; 156 | background: #fff; 157 | color: #363636; 158 | line-height: 1.3; 159 | will-change: transform; 160 | box-shadow: 0 3px 10px rgba(0, 0, 0, 0.1), 0 3px 3px rgba(0, 0, 0, 0.05); 161 | max-width: 350px; 162 | pointer-events: auto; 163 | padding: 8px 10px; 164 | border-radius: 8px; 165 | `,je=v("div")` 166 | display: flex; 167 | justify-content: center; 168 | margin: 4px 10px; 169 | color: inherit; 170 | flex: 1 1 auto; 171 | white-space: pre-line; 172 | `,Ce=(e,t)=>{let a=e.includes("top")?1:-1,[o,s]=H()?[Ee,Ne]:[we(a),ke(a)];return{animation:t?`${y(o)} 0.35s cubic-bezier(.21,1.02,.73,1) forwards`:`${y(s)} 0.4s forwards cubic-bezier(.06,.71,.55,1)`}},Oe=c.memo(({toast:e,position:t,style:a,children:o})=>{let s=e.height?Ce(e.position||t||"top-center",e.visible):{opacity:0},r=c.createElement(ve,{toast:e}),n=c.createElement(je,{...e.ariaProps},O(e.message,e));return c.createElement($e,{className:e.className,style:{...s,...a,...e.style}},typeof o=="function"?o({icon:r,message:n}):c.createElement(c.Fragment,null,r,n))});J(c.createElement);var Fe=({id:e,className:t,style:a,onHeightUpdate:o,children:s})=>{let r=c.useCallback(n=>{if(n){let i=()=>{let l=n.getBoundingClientRect().height;o(e,l)};i(),new MutationObserver(i).observe(n,{subtree:!0,childList:!0,characterData:!0})}},[e,o]);return c.createElement("div",{ref:r,className:t,style:a},s)},De=(e,t)=>{let a=e.includes("top"),o=a?{top:0}:{bottom:0},s=e.includes("center")?{justifyContent:"center"}:e.includes("right")?{justifyContent:"flex-end"}:{};return{left:0,right:0,display:"flex",position:"absolute",transition:H()?void 0:"all 230ms cubic-bezier(.21,1.02,.73,1)",transform:`translateY(${t*(a?1:-1)}px)`,...o,...s}},Ie=F` 173 | z-index: 9999; 174 | > * { 175 | pointer-events: auto; 176 | } 177 | `,N=16,Ae=({reverseOrder:e,position:t="top-center",toastOptions:a,gutter:o,children:s,containerStyle:r,containerClassName:n})=>{let{toasts:i,handlers:l}=ie(a);return c.createElement("div",{style:{position:"fixed",zIndex:9999,top:N,left:N,right:N,bottom:N,pointerEvents:"none",...r},className:n,onMouseEnter:l.startPause,onMouseLeave:l.endPause},i.map(d=>{let p=d.position||t,u=l.calculateOffset(d,{reverseOrder:e,gutter:o,defaultPosition:t}),m=De(p,u);return c.createElement(Fe,{id:d.id,key:d.id,onHeightUpdate:l.updateHeight,className:d.visible?Ie:"",style:m},d.type==="custom"?O(d.message,d):s?s(d):c.createElement(Oe,{toast:d,position:p}))}))},M=g;function ze(){const[e,t]=c.useState(""),[a,o]=c.useState(""),[s,r]=c.useState(""),n=()=>M.error("Error occured!"),i=()=>M.success("Successfully sent!"),l=c.useRef(),d=q(),p=u=>{u.preventDefault(),e.length===0||a.length===0||s.length===0?n():(i(),U.sendForm("service_aakyhrk","template_scsfe35",l.current,"rBHPqsGP1vYUCEoP9").then(m=>{console.log(m.text),console.log("sent")},m=>{console.log(m.text)})),t(""),o(""),r("")};return w(L.div,{initial:{opacity:0},animate:d,exit:{opacity:0,transition:{ease:"easeInOut"}},className:"mt-[32px] mx-auto w-[80%]",children:[w("div",{className:"text-center grid items-center justify-center place-items-center",children:[w("span",{className:"text-primary dark:text-gray leading-[30px] font-[700] md:leading-[50px] text-[24px] md:text-[35px]",children:["Want to work with me?",f("p",{className:"text-secondary dark:text-white mt-2",children:"let's Connect"})]}),w("p",{className:"text-[14px] md:text-[20px] leading-[24px] md:leading-[35px] text-para dark:text-gray word-break mt-[24px] md:w-[550px] w-[350px] whitespace-no-wrap",children:["I am open to"," ",f("span",{className:"text-secondary dark:text-gray font-bold",children:"remote"})," ","and"," ",f("span",{className:"text-secondary dark:text-gray font-bold",children:"onsite full-time, part-time"})," ","roles. If you've got anything you think I'd be interested in then"," ",f("span",{className:"text-secondary dark:text-gray font-bold",children:"fill the form."})]})]}),w("form",{ref:l,className:"space-y-6 mt-[34px]",onSubmit:p,children:[w("div",{className:"items-center justify-center place-items-center grid gap-8",children:[f("input",{type:"text",name:"user_name",value:e,placeholder:"Enter your name",required:!0,onChange:u=>t(u.target.value),className:"border-[#2D2929] dark:border-white border-[3px] p-5 outline-none w-[320px] md:w-[500px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2"}),f("input",{type:"email",name:"user_email",value:a,placeholder:"Enter your mail",required:!0,onChange:u=>o(u.target.value),className:"border-[#2D2929] dark:border-white border-[3px] p-5 outline-none w-[320px] md:w-[500px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2"}),f("textarea",{name:"message",id:"message",value:s,placeholder:"Message",required:!0,onChange:u=>r(u.target.value),className:"border-[#2D2929] dark:border-white border-[3px] p-4 outline-none w-[320px] md:w-[500px] h-[100px] md:h-[150px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2"}),f("button",{className:"items-center justify-center place-items-center grid",type:"submit",children:w("span",{className:"relative w-[320px] md:w-[500px] h-[60px] group px-6 py-3 font-bold",children:[f("span",{className:"absolute inset-0 w-[320px] md:w-[500px] h-[60px] border-2 border-darkgrey dark:border-white translate-y-2 translate-x-2 transition duration-300 ease-out transform group-hover:translate-y-0 group-hover:translate-x-0"}),f("span",{className:"absolute inset-0 w-[320px] md:w-[500px] h-[60px] bg-darkgrey dark:bg-white"}),f("span",{className:"text-resume dark:text-darkgrey text-[16px] text-center font-[700] leading-[24px] relative group-hover:opacity-85",children:"CONNECT"})]})})]}),f(Ae,{position:"top-center",toastOptions:{duration:3e3,iconTheme:{primary:"green",secondary:"white"},role:"status",ariaLive:"polite"}})]})]})}export{ze as default}; 178 | -------------------------------------------------------------------------------- /dist/assets/index-1f971082.css: -------------------------------------------------------------------------------- 1 | *,:before,:after{box-sizing:border-box;border-width:0;border-style:solid;border-color:currentColor}:before,:after{--tw-content: ""}html{line-height:1.5;-webkit-text-size-adjust:100%;-moz-tab-size:4;-o-tab-size:4;tab-size:4;font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";font-feature-settings:normal}body{margin:0;line-height:inherit}hr{height:0;color:inherit;border-top-width:1px}abbr:where([title]){-webkit-text-decoration:underline dotted;text-decoration:underline dotted}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit}a{color:inherit;text-decoration:inherit}b,strong{font-weight:bolder}code,kbd,samp,pre{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,Liberation Mono,Courier New,monospace;font-size:1em}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}table{text-indent:0;border-color:inherit;border-collapse:collapse}button,input,optgroup,select,textarea{font-family:inherit;font-size:100%;font-weight:inherit;line-height:inherit;color:inherit;margin:0;padding:0}button,select{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;background-color:transparent;background-image:none}:-moz-focusring{outline:auto}:-moz-ui-invalid{box-shadow:none}progress{vertical-align:baseline}::-webkit-inner-spin-button,::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}blockquote,dl,dd,h1,h2,h3,h4,h5,h6,hr,figure,p,pre{margin:0}fieldset{margin:0;padding:0}legend{padding:0}ol,ul,menu{list-style:none;margin:0;padding:0}textarea{resize:vertical}input::-moz-placeholder,textarea::-moz-placeholder{opacity:1;color:#9ca3af}input::placeholder,textarea::placeholder{opacity:1;color:#9ca3af}button,[role=button]{cursor:pointer}:disabled{cursor:default}img,svg,video,canvas,audio,iframe,embed,object{display:block;vertical-align:middle}img,video{max-width:100%;height:auto}[hidden]{display:none}*,:before,:after{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }::backdrop{--tw-border-spacing-x: 0;--tw-border-spacing-y: 0;--tw-translate-x: 0;--tw-translate-y: 0;--tw-rotate: 0;--tw-skew-x: 0;--tw-skew-y: 0;--tw-scale-x: 1;--tw-scale-y: 1;--tw-pan-x: ;--tw-pan-y: ;--tw-pinch-zoom: ;--tw-scroll-snap-strictness: proximity;--tw-ordinal: ;--tw-slashed-zero: ;--tw-numeric-figure: ;--tw-numeric-spacing: ;--tw-numeric-fraction: ;--tw-ring-inset: ;--tw-ring-offset-width: 0px;--tw-ring-offset-color: #fff;--tw-ring-color: rgb(59 130 246 / .5);--tw-ring-offset-shadow: 0 0 #0000;--tw-ring-shadow: 0 0 #0000;--tw-shadow: 0 0 #0000;--tw-shadow-colored: 0 0 #0000;--tw-blur: ;--tw-brightness: ;--tw-contrast: ;--tw-grayscale: ;--tw-hue-rotate: ;--tw-invert: ;--tw-saturate: ;--tw-sepia: ;--tw-drop-shadow: ;--tw-backdrop-blur: ;--tw-backdrop-brightness: ;--tw-backdrop-contrast: ;--tw-backdrop-grayscale: ;--tw-backdrop-hue-rotate: ;--tw-backdrop-invert: ;--tw-backdrop-opacity: ;--tw-backdrop-saturate: ;--tw-backdrop-sepia: }.fixed{position:fixed}.absolute{position:absolute}.relative{position:relative}.sticky{position:sticky}.inset-0{top:0px;right:0px;bottom:0px;left:0px}.top-\[100\%\]{top:100%}.top-0{top:0px}.right-\[0px\]{right:0px}.left-0{left:0px}.z-10{z-index:10}.z-50{z-index:50}.m-5{margin:1.25rem}.mx-auto{margin-left:auto;margin-right:auto}.mx-3{margin-left:.75rem;margin-right:.75rem}.mt-\[70px\]{margin-top:70px}.ml-auto{margin-left:auto}.mt-16{margin-top:4rem}.mt-\[35px\]{margin-top:35px}.mt-\[24px\]{margin-top:24px}.mt-\[20px\]{margin-top:20px}.mt-\[32px\]{margin-top:32px}.mt-\[10\%\]{margin-top:10%}.mt-2{margin-top:.5rem}.mt-\[34px\]{margin-top:34px}.mt-\[28px\]{margin-top:28px}.mt-\[46px\]{margin-top:46px}.mb-\[24px\]{margin-bottom:24px}.mt-\[12px\]{margin-top:12px}.mt-\[40px\]{margin-top:40px}.mt-3{margin-top:.75rem}.block{display:block}.flex{display:flex}.grid{display:grid}.hidden{display:none}.h-screen{height:100vh}.h-full,.h-\[100\%\]{height:100%}.h-\[80px\]{height:80px}.h-36{height:9rem}.h-60{height:15rem}.h-\[40px\]{height:40px}.h-\[330px\]{height:330px}.h-\[54px\]{height:54px}.h-\[192px\]{height:192px}.h-\[48px\]{height:48px}.h-\[65vh\]{height:65vh}.h-\[500px\]{height:500px}.h-\[150px\]{height:150px}.h-\[60px\]{height:60px}.h-\[100px\]{height:100px}.h-\[77px\]{height:77px}.h-\[35px\]{height:35px}.h-\[96px\]{height:96px}.min-h-screen{min-height:100vh}.w-full{width:100%}.w-\[80\%\]{width:80%}.w-1\/2{width:50%}.w-\[95\%\]{width:95%}.w-\[50\%\]{width:50%}.w-\[40px\]{width:40px}.w-0\.5{width:.125rem}.w-0{width:0px}.w-\[350px\]{width:350px}.w-\[54px\]{width:54px}.w-\[500px\]{width:500px}.w-\[160px\]{width:160px}.w-\[490px\]{width:490px}.w-\[459px\]{width:459px}.w-\[445px\]{width:445px}.w-\[320px\]{width:320px}.w-\[409px\]{width:409px}.w-80{width:20rem}.w-\[163px\]{width:163px}.w-\[101px\]{width:101px}.w-\[35px\]{width:35px}.w-\[200px\]{width:200px}.max-w-\[500px\]{max-width:500px}.translate-y-4{--tw-translate-y: 1rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-14{--tw-translate-x: 3.5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-2{--tw-translate-y: .5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-2{--tw-translate-x: .5rem;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-y-\[6px\]{--tw-translate-y: 6px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.translate-x-\[6px\]{--tw-translate-x: 6px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.-rotate-90{--tw-rotate: -90deg;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.transform{transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.cursor-pointer{cursor:pointer}.list-none{list-style-type:none}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.flex-col{flex-direction:column}.flex-wrap{flex-wrap:wrap}.place-items-center{place-items:center}.items-end{align-items:flex-end}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.justify-evenly{justify-content:space-evenly}.gap-5{gap:1.25rem}.gap-8{gap:2rem}.gap-\[30px\]{gap:30px}.gap-\[8px\]{gap:8px}.gap-\[16px\]{gap:16px}.gap-x-\[44px\]{-moz-column-gap:44px;column-gap:44px}.gap-y-\[5px\]{row-gap:5px}.gap-x-\[24px\]{-moz-column-gap:24px;column-gap:24px}.space-y-6>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(1.5rem * var(--tw-space-y-reverse))}.space-y-3>:not([hidden])~:not([hidden]){--tw-space-y-reverse: 0;margin-top:calc(.75rem * calc(1 - var(--tw-space-y-reverse)));margin-bottom:calc(.75rem * var(--tw-space-y-reverse))}.overflow-auto{overflow:auto}.overflow-y-scroll{overflow-y:scroll}.rounded-full{border-radius:9999px}.rounded{border-radius:.25rem}.border-2{border-width:2px}.border-\[3px\]{border-width:3px}.border-t{border-top-width:1px}.border-darkgrey{--tw-border-opacity: 1;border-color:rgb(30 30 30 / var(--tw-border-opacity))}.border-\[\#2D2929\]{--tw-border-opacity: 1;border-color:rgb(45 41 41 / var(--tw-border-opacity))}.bg-resume{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.bg-grey2{--tw-bg-opacity: 1;background-color:rgb(248 248 248 / var(--tw-bg-opacity))}.bg-secondary{--tw-bg-opacity: 1;background-color:rgb(26 26 26 / var(--tw-bg-opacity))}.bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.bg-darkgrey{--tw-bg-opacity: 1;background-color:rgb(30 30 30 / var(--tw-bg-opacity))}.bg-\[\#F2F2F2\]{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.fill-black2{fill:#000}.p-5{padding:1.25rem}.p-2{padding:.5rem}.p-4{padding:1rem}.py-2{padding-top:.5rem;padding-bottom:.5rem}.px-2{padding-left:.5rem;padding-right:.5rem}.py-4{padding-top:1rem;padding-bottom:1rem}.px-12{padding-left:3rem;padding-right:3rem}.px-6{padding-left:1.5rem;padding-right:1.5rem}.py-3{padding-top:.75rem;padding-bottom:.75rem}.pt-4{padding-top:1rem}.pt-2{padding-top:.5rem}.text-center{text-align:center}.text-\[24px\]{font-size:24px}.text-\[38px\]{font-size:38px}.text-xs{font-size:.75rem;line-height:1rem}.text-\[100px\]{font-size:100px}.text-\[16px\]{font-size:16px}.text-\[226px\]{font-size:226px}.text-\[48px\]{font-size:48px}.text-\[14px\]{font-size:14px}.text-\[18px\]{font-size:18px}.font-\[700\]{font-weight:700}.font-\[500\]{font-weight:500}.font-semibold{font-weight:600}.font-extrabold{font-weight:800}.font-bold{font-weight:700}.font-normal{font-weight:400}.uppercase{text-transform:uppercase}.leading-\[30\.62px\]{line-height:30.62px}.leading-\[64px\]{line-height:64px}.leading-\[26px\]{line-height:26px}.leading-\[24px\]{line-height:24px}.leading-\[30px\]{line-height:30px}.leading-\[22\.97px\]{line-height:22.97px}.leading-\[20\.42px\]{line-height:20.42px}.leading-\[19px\]{line-height:19px}.text-darkgrey{--tw-text-opacity: 1;color:rgb(30 30 30 / var(--tw-text-opacity))}.text-secondary{--tw-text-opacity: 1;color:rgb(26 26 26 / var(--tw-text-opacity))}.text-black{--tw-text-opacity: 1;color:rgb(48 46 46 / var(--tw-text-opacity))}.text-\[\#292929\]{--tw-text-opacity: 1;color:rgb(41 41 41 / var(--tw-text-opacity))}.text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.text-black2{--tw-text-opacity: 1;color:rgb(0 0 0 / var(--tw-text-opacity))}.text-primary{--tw-text-opacity: 1;color:rgb(73 73 73 / var(--tw-text-opacity))}.text-para{--tw-text-opacity: 1;color:rgb(135 135 135 / var(--tw-text-opacity))}.text-resume{--tw-text-opacity: 1;color:rgb(242 242 242 / var(--tw-text-opacity))}.text-gray{--tw-text-opacity: 1;color:rgb(178 178 179 / var(--tw-text-opacity))}.text-\[\#222222\]{--tw-text-opacity: 1;color:rgb(34 34 34 / var(--tw-text-opacity))}.underline{text-decoration-line:underline}.shadow-lg{--tw-shadow: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--tw-shadow-colored: 0 10px 15px -3px var(--tw-shadow-color), 0 4px 6px -4px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-md{--tw-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);box-shadow:var(--tw-ring-offset-shadow, 0 0 #0000),var(--tw-ring-shadow, 0 0 #0000),var(--tw-shadow)}.shadow-white{--tw-shadow-color: #FFFFFF;--tw-shadow: var(--tw-shadow-colored)}.shadow-darkgrey{--tw-shadow-color: #1E1E1E;--tw-shadow: var(--tw-shadow-colored)}.outline-none{outline:2px solid transparent;outline-offset:2px}.blur{--tw-blur: blur(8px);filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.drop-shadow-lg{--tw-drop-shadow: drop-shadow(0 10px 8px rgb(0 0 0 / .04)) drop-shadow(0 4px 3px rgb(0 0 0 / .1));filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition-all{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.transition{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,-webkit-backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter;transition-property:color,background-color,border-color,text-decoration-color,fill,stroke,opacity,box-shadow,transform,filter,backdrop-filter,-webkit-backdrop-filter;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.15s}.duration-300{transition-duration:.3s}.duration-500{transition-duration:.5s}.ease-out{transition-timing-function:cubic-bezier(0,0,.2,1)}body{font-family:Space Grotesk,sans-serif}.active .navtext{text-decoration:line-through;text-decoration-thickness:1px}.navtext{position:relative}.navtext:before{content:"";position:absolute;bottom:-2px;left:0;width:0;height:2px;background-color:#1a1a1a;transition:width .6s cubic-bezier(.25,1,.5,1)}.navtext:hover:before{width:100%}@media (hover: hover) and (pointer: fine){.navtext a:not(.active):hover:before{left:0;right:auto;width:100%}}span{display:inline-block}::-webkit-scrollbar{width:12px}::-webkit-scrollbar-track{background:#5d5a5a;border-radius:6px;margin-block:.2rem}::-webkit-scrollbar-thumb{background:linear-gradient(rgb(97,90,90),rgb(213,211,211));border-radius:6px}.progress{--r1: 154%;--r2: 68.5%;width:48px;height:48px;border-radius:50%;background:radial-gradient(var(--r1) var(--r2) at top,#0000 79.5%,#03030d 80%) center left,radial-gradient(var(--r1) var(--r2) at bottom,#03030d 79.5%,#0000 80%) center center,radial-gradient(var(--r1) var(--r2) at top,#0000 79.5%,#03030d 80%) center right,#dfdfe6;background-size:50.5% 220%;background-position:-100% 0%,0% 0%,100% 0%;background-repeat:no-repeat;animation:progress-mbj53w 2.4s infinite linear}.loading{height:calc(100vh - 14rem)}@keyframes progress-mbj53w{33%{background-position:0% 33%,100% 33%,200% 33%}66%{background-position:-100% 66%,0% 66%,100% 66%}to{background-position:0% 100%,100% 100%,200% 100%}}.hover\:scale-110:hover{--tw-scale-x: 1.1;--tw-scale-y: 1.1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:scale-95:hover{--tw-scale-x: .95;--tw-scale-y: .95;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.hover\:opacity-75:hover{opacity:.75}.group:hover .group-hover\:translate-y-0{--tw-translate-y: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.group:hover .group-hover\:translate-x-0{--tw-translate-x: 0px;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skew(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.dark .dark\:border-resume{--tw-border-opacity: 1;border-color:rgb(242 242 242 / var(--tw-border-opacity))}.dark .dark\:border-white{--tw-border-opacity: 1;border-color:rgb(255 255 255 / var(--tw-border-opacity))}.dark .dark\:bg-bgblack{--tw-bg-opacity: 1;background-color:rgb(24 25 24 / var(--tw-bg-opacity))}.dark .dark\:bg-secondary{--tw-bg-opacity: 1;background-color:rgb(26 26 26 / var(--tw-bg-opacity))}.dark .dark\:bg-resume{--tw-bg-opacity: 1;background-color:rgb(242 242 242 / var(--tw-bg-opacity))}.dark .dark\:bg-white{--tw-bg-opacity: 1;background-color:rgb(255 255 255 / var(--tw-bg-opacity))}.dark .dark\:bg-darkgrey{--tw-bg-opacity: 1;background-color:rgb(30 30 30 / var(--tw-bg-opacity))}.dark .dark\:fill-white{fill:#fff}.dark .dark\:text-resume{--tw-text-opacity: 1;color:rgb(242 242 242 / var(--tw-text-opacity))}.dark .dark\:text-white{--tw-text-opacity: 1;color:rgb(255 255 255 / var(--tw-text-opacity))}.dark .dark\:text-darkgrey{--tw-text-opacity: 1;color:rgb(30 30 30 / var(--tw-text-opacity))}.dark .dark\:text-gray{--tw-text-opacity: 1;color:rgb(178 178 179 / var(--tw-text-opacity))}.dark .dark\:text-grey2{--tw-text-opacity: 1;color:rgb(248 248 248 / var(--tw-text-opacity))}.dark .dark\:text-white2{--tw-text-opacity: 1;color:rgb(238 238 238 / var(--tw-text-opacity))}@media (min-width: 768px){.md\:left-6{left:1.5rem}.md\:mt-\[2\%\]{margin-top:2%}.md\:h-\[72vh\]{height:72vh}.md\:h-\[150px\]{height:150px}.md\:w-3\/5{width:60%}.md\:w-\[550px\]{width:550px}.md\:w-\[500px\]{width:500px}.md\:grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.md\:text-\[35px\]{font-size:35px}.md\:text-\[20px\]{font-size:20px}.md\:leading-\[50px\]{line-height:50px}.md\:leading-\[35px\]{line-height:35px}}@media (min-width: 1200px){.lg\:mt-\[24px\]{margin-top:24px}.lg\:mt-\[32px\]{margin-top:32px}.lg\:block{display:block}.lg\:hidden{display:none}.lg\:h-\[600px\]{height:600px}.lg\:items-start{align-items:flex-start}.lg\:justify-start{justify-content:flex-start}.lg\:overflow-auto{overflow:auto}.lg\:overflow-hidden{overflow:hidden}.lg\:text-\[160px\]{font-size:160px}.lg\:text-\[48px\]{font-size:48px}.lg\:leading-\[64px\]{line-height:64px}} 2 | -------------------------------------------------------------------------------- /dist/assets/Projects-35dfc950.js: -------------------------------------------------------------------------------- 1 | import{G as ze,b as We,c as Fe,u as qe,a as X,m as Re,j as be,d as Ue}from"./index-94a40de8.js";import{a as $e}from"./index.esm-7ed374dd.js";const He=[{id:1,img:"https://res.cloudinary.com/dgtc1iood/image/upload/v1697973810/noteey_hb6czf.png",title:"Noteey",subtitle:"Note Taking Tool",language:"NextJs + Tailwind + TypeScript",codeLink:"https://github.com/preshpi/noteey",viewLink:"https://noteeey.vercel.app/",view:"View Site",code:"Code"},{id:2,img:"https://res.cloudinary.com/dpokiomqq/image/upload/v1675030839/MicroURL_vldrk4.png",title:"MicroURL",subtitle:"Tools for shorten Url",language:"React + Tailwind",code:"Code",codeLink:"https://github.com/preshpi/url_shortener",viewLink:"https://url-shortener-omega-liard.vercel.app/",view:"View Site"},{id:3,img:"https://res.cloudinary.com/dpokiomqq/image/upload/v1681796171/Pinterest_Clone___Home_o79avk.png",title:"mediaSurf",subtitle:"Get images and videos of your choice from mediaSurf.",language:"Next.js + Tailwind + pexels API",code:"Code",codeLink:"https://github.com/preshpi/pinterest-clon",viewLink:"https://mediasurff.netlify.app/",view:"View Site"},{id:4,img:"https://res.cloudinary.com/dpokiomqq/image/upload/v1681463578/FlairStyle___Home_1_wotksb.png",title:"FlairStyle",code:"Code",codeLink:"https://github.com/preshpi/commerce",subtitle:"Fashion E-commerce website",language:"Next.js + Tailwind + Commerce.js(cms)",viewLink:"https://flairstyle.vercel.app/",view:"View Site"},{id:5,img:"https://res.cloudinary.com/dgtc1iood/image/upload/v1673940945/Frame_48_wlu0wt.png",title:"Password Generator",subtitle:"Creates unique, secure passwords for online accounts.",language:"React + Tailwind",code:"Code",codeLink:"https://github.com/preshpi/password",viewLink:"https://password-preshpi.vercel.app/",view:"View Site"}];function Ge(oe){return ze({tag:"svg",attr:{viewBox:"0 0 1024 1024"},child:[{tag:"path",attr:{d:"M396 512a112 112 0 1 0 224 0 112 112 0 1 0-224 0zm546.2-25.8C847.4 286.5 704.1 186 512 186c-192.2 0-335.4 100.5-430.2 300.3a60.3 60.3 0 0 0 0 51.5C176.6 737.5 319.9 838 512 838c192.2 0 335.4-100.5 430.2-300.3 7.7-16.2 7.7-35 0-51.5zM508 688c-97.2 0-176-78.8-176-176s78.8-176 176-176 176 78.8 176 176-78.8 176-176 176z"}}]})(oe)}var Te={},Ae={get exports(){return Te},set exports(oe){Te=oe}};(()=>{var oe={296:(p,f,a)=>{var J=/^\s+|\s+$/g,V=/^[-+]0x[0-9a-f]+$/i,z=/^0b[01]+$/i,P=/^0o[0-7]+$/i,R=parseInt,te=typeof a.g=="object"&&a.g&&a.g.Object===Object&&a.g,ce=typeof self=="object"&&self&&self.Object===Object&&self,ie=te||ce||Function("return this")(),le=Object.prototype.toString,ne=Math.max,ue=Math.min,$=function(){return ie.Date.now()};function C(y){var l=typeof y;return!!y&&(l=="object"||l=="function")}function K(y){if(typeof y=="number")return y;if(function(T){return typeof T=="symbol"||function(k){return!!k&&typeof k=="object"}(T)&&le.call(T)=="[object Symbol]"}(y))return NaN;if(C(y)){var l=typeof y.valueOf=="function"?y.valueOf():y;y=C(l)?l+"":l}if(typeof y!="string")return y===0?y:+y;y=y.replace(J,"");var j=z.test(y);return j||P.test(y)?R(y.slice(2),j?2:8):V.test(y)?NaN:+y}p.exports=function(y,l,j){var T,k,D,H,w,L,M=0,G=!1,W=!1,F=!0;if(typeof y!="function")throw new TypeError("Expected a function");function S(m){var B=T,Y=k;return T=k=void 0,M=m,H=y.apply(Y,B)}function q(m){return M=m,w=setTimeout(Q,l),G?S(m):H}function A(m){var B=m-L;return L===void 0||B>=l||B<0||W&&m-M>=D}function Q(){var m=$();if(A(m))return Z(m);w=setTimeout(Q,function(B){var Y=l-(B-L);return W?ue(Y,D-(B-M)):Y}(m))}function Z(m){return w=void 0,F&&T?S(m):(T=k=void 0,H)}function re(){var m=$(),B=A(m);if(T=arguments,k=this,L=m,B){if(w===void 0)return q(L);if(W)return w=setTimeout(Q,l),S(L)}return w===void 0&&(w=setTimeout(Q,l)),H}return l=K(l)||0,C(j)&&(G=!!j.leading,D=(W="maxWait"in j)?ne(K(j.maxWait)||0,l):D,F="trailing"in j?!!j.trailing:F),re.cancel=function(){w!==void 0&&clearTimeout(w),M=0,T=L=k=w=void 0},re.flush=function(){return w===void 0?H:Z($())},re}},96:(p,f,a)=>{var J="Expected a function",V=/^\s+|\s+$/g,z=/^[-+]0x[0-9a-f]+$/i,P=/^0b[01]+$/i,R=/^0o[0-7]+$/i,te=parseInt,ce=typeof a.g=="object"&&a.g&&a.g.Object===Object&&a.g,ie=typeof self=="object"&&self&&self.Object===Object&&self,le=ce||ie||Function("return this")(),ne=Object.prototype.toString,ue=Math.max,$=Math.min,C=function(){return le.Date.now()};function K(l){var j=typeof l;return!!l&&(j=="object"||j=="function")}function y(l){if(typeof l=="number")return l;if(function(k){return typeof k=="symbol"||function(D){return!!D&&typeof D=="object"}(k)&&ne.call(k)=="[object Symbol]"}(l))return NaN;if(K(l)){var j=typeof l.valueOf=="function"?l.valueOf():l;l=K(j)?j+"":j}if(typeof l!="string")return l===0?l:+l;l=l.replace(V,"");var T=P.test(l);return T||R.test(l)?te(l.slice(2),T?2:8):z.test(l)?NaN:+l}p.exports=function(l,j,T){var k=!0,D=!0;if(typeof l!="function")throw new TypeError(J);return K(T)&&(k="leading"in T?!!T.leading:k,D="trailing"in T?!!T.trailing:D),function(H,w,L){var M,G,W,F,S,q,A=0,Q=!1,Z=!1,re=!0;if(typeof H!="function")throw new TypeError(J);function m(_){var U=M,ye=G;return M=G=void 0,A=_,F=H.apply(ye,U)}function B(_){return A=_,S=setTimeout(fe,w),Q?m(_):F}function Y(_){var U=_-q;return q===void 0||U>=w||U<0||Z&&_-A>=W}function fe(){var _=C();if(Y(_))return me(_);S=setTimeout(fe,function(U){var ye=w-(U-q);return Z?$(ye,W-(U-A)):ye}(_))}function me(_){return S=void 0,re&&M?m(_):(M=G=void 0,F)}function pe(){var _=C(),U=Y(_);if(M=arguments,G=this,q=_,U){if(S===void 0)return B(q);if(Z)return S=setTimeout(fe,w),m(q)}return S===void 0&&(S=setTimeout(fe,w)),F}return w=y(w)||0,K(L)&&(Q=!!L.leading,W=(Z="maxWait"in L)?ue(y(L.maxWait)||0,w):W,re="trailing"in L?!!L.trailing:re),pe.cancel=function(){S!==void 0&&clearTimeout(S),A=0,M=q=G=S=void 0},pe.flush=function(){return S===void 0?F:me(C())},pe}(l,j,{leading:k,maxWait:j,trailing:D})}},703:(p,f,a)=>{var J=a(414);function V(){}function z(){}z.resetWarningCache=V,p.exports=function(){function P(ce,ie,le,ne,ue,$){if($!==J){var C=new Error("Calling PropTypes validators directly is not supported by the `prop-types` package. Use PropTypes.checkPropTypes() to call them. Read more at http://fb.me/use-check-prop-types");throw C.name="Invariant Violation",C}}function R(){return P}P.isRequired=P;var te={array:P,bool:P,func:P,number:P,object:P,string:P,symbol:P,any:P,arrayOf:R,element:P,elementType:P,instanceOf:R,node:P,objectOf:R,oneOf:R,oneOfType:R,shape:R,exact:R,checkPropTypes:z,resetWarningCache:V};return te.PropTypes=te,te}},697:(p,f,a)=>{p.exports=a(703)()},414:p=>{p.exports="SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED"}},he={};function O(p){var f=he[p];if(f!==void 0)return f.exports;var a=he[p]={exports:{}};return oe[p](a,a.exports,O),a.exports}O.n=p=>{var f=p&&p.__esModule?()=>p.default:()=>p;return O.d(f,{a:f}),f},O.d=(p,f)=>{for(var a in f)O.o(f,a)&&!O.o(p,a)&&Object.defineProperty(p,a,{enumerable:!0,get:f[a]})},O.g=function(){if(typeof globalThis=="object")return globalThis;try{return this||new Function("return this")()}catch{if(typeof window=="object")return window}}(),O.o=(p,f)=>Object.prototype.hasOwnProperty.call(p,f),O.r=p=>{typeof Symbol<"u"&&Symbol.toStringTag&&Object.defineProperty(p,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(p,"__esModule",{value:!0})};var ae={};(()=>{O.r(ae),O.d(ae,{LazyLoadComponent:()=>Se,LazyLoadImage:()=>Ve,trackWindowScroll:()=>Q});const p=We;var f=O.n(p),a=O(697);const J=Fe;var V=O.n(J);function z(){return typeof window<"u"&&"IntersectionObserver"in window&&"isIntersecting"in window.IntersectionObserverEntry.prototype}function P(r){return(P=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(e){return typeof e}:function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(r)}function R(r,e){var i=Object.keys(r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(r);e&&(o=o.filter(function(E){return Object.getOwnPropertyDescriptor(r,E).enumerable})),i.push.apply(i,o)}return i}function te(r,e,i){return e in r?Object.defineProperty(r,e,{value:i,enumerable:!0,configurable:!0,writable:!0}):r[e]=i,r}function ce(r,e){for(var i=0;i"u"||!Reflect.construct||Reflect.construct.sham)return!1;if(typeof Proxy=="function")return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){})),!0}catch{return!1}}(),function(){var t,n=ne(o);if(E){var s=ne(this).constructor;t=Reflect.construct(n,arguments,s)}else t=n.apply(this,arguments);return le(this,t)});function h(t){var n;if(function(c,u){if(!(c instanceof u))throw new TypeError("Cannot call a class as a function")}(this,h),(n=ee.call(this,t)).supportsObserver=!t.scrollPosition&&t.useIntersectionObserver&&z(),n.supportsObserver){var s=t.threshold;n.observer=function(c){return $[c]=$[c]||new IntersectionObserver(ue,{rootMargin:c+"px"}),$[c]}(s)}return n}return e=h,(i=[{key:"componentDidMount",value:function(){this.placeholder&&this.observer&&(this.placeholder.onVisible=this.props.onVisible,this.observer.observe(this.placeholder)),this.supportsObserver||this.updateVisibility()}},{key:"componentWillUnmount",value:function(){this.observer&&this.placeholder&&this.observer.unobserve(this.placeholder)}},{key:"componentDidUpdate",value:function(){this.supportsObserver||this.updateVisibility()}},{key:"getPlaceholderBoundingBox",value:function(){var t=arguments.length>0&&arguments[0]!==void 0?arguments[0]:this.props.scrollPosition,n=this.placeholder.getBoundingClientRect(),s=V().findDOMNode(this.placeholder).style,c={left:parseInt(s.getPropertyValue("margin-left"),10)||0,top:parseInt(s.getPropertyValue("margin-top"),10)||0};return{bottom:t.y+n.bottom+c.top,left:t.x+n.left+c.left,right:t.x+n.right+c.left,top:t.y+n.top+c.top}}},{key:"isPlaceholderInViewport",value:function(){if(typeof window>"u"||!this.placeholder)return!1;var t=this.props,n=t.scrollPosition,s=t.threshold,c=this.getPlaceholderBoundingBox(n),u=n.y+window.innerHeight,d=n.x,v=n.x+window.innerWidth,g=n.y;return Boolean(g-s<=c.bottom&&u+s>=c.top&&d-s<=c.right&&v+s>=c.left)}},{key:"updateVisibility",value:function(){this.isPlaceholderInViewport()&&this.props.onVisible()}},{key:"render",value:function(){var t=this,n=this.props,s=n.className,c=n.height,u=n.placeholder,d=n.style,v=n.width;if(u&&typeof u.type!="function")return f().cloneElement(u,{ref:function(b){return t.placeholder=b}});var g=function(b){for(var I=1;I"u"?0:window.scrollX||window.pageXOffset},A=function(){return typeof window>"u"?0:window.scrollY||window.pageYOffset};const Q=function(r){var e=function(i){(function(s,c){if(typeof c!="function"&&c!==null)throw new TypeError("Super expression must either be null or a function");s.prototype=Object.create(c&&c.prototype,{constructor:{value:s,writable:!0,configurable:!0}}),c&&G(s,c)})(n,i);var o,E,ee,h,t=(ee=n,h=function(){if(typeof Reflect>"u"||!Reflect.construct||Reflect.construct.sham)return!1;if(typeof Proxy=="function")return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){})),!0}catch{return!1}}(),function(){var s,c=S(ee);if(h){var u=S(this).constructor;s=Reflect.construct(c,arguments,u)}else s=c.apply(this,arguments);return W(this,s)});function n(s){var c;if(function(d,v){if(!(d instanceof v))throw new TypeError("Cannot call a class as a function")}(this,n),(c=t.call(this,s)).useIntersectionObserver=s.useIntersectionObserver&&z(),c.useIntersectionObserver)return W(c);var u=c.onChangeScroll.bind(F(c));return s.delayMethod==="debounce"?c.delayedScroll=l()(u,s.delayTime):s.delayMethod==="throttle"&&(c.delayedScroll=T()(u,s.delayTime)),c.state={scrollPosition:{x:q(),y:A()}},c.baseComponentRef=f().createRef(),c}return o=n,(E=[{key:"componentDidMount",value:function(){this.addListeners()}},{key:"componentWillUnmount",value:function(){this.removeListeners()}},{key:"componentDidUpdate",value:function(){typeof window>"u"||this.useIntersectionObserver||D(V().findDOMNode(this.baseComponentRef.current))!==this.scrollElement&&(this.removeListeners(),this.addListeners())}},{key:"addListeners",value:function(){typeof window>"u"||this.useIntersectionObserver||(this.scrollElement=D(V().findDOMNode(this.baseComponentRef.current)),this.scrollElement.addEventListener("scroll",this.delayedScroll,{passive:!0}),window.addEventListener("resize",this.delayedScroll,{passive:!0}),this.scrollElement!==window&&window.addEventListener("scroll",this.delayedScroll,{passive:!0}))}},{key:"removeListeners",value:function(){typeof window>"u"||this.useIntersectionObserver||(this.scrollElement.removeEventListener("scroll",this.delayedScroll),window.removeEventListener("resize",this.delayedScroll),this.scrollElement!==window&&window.removeEventListener("scroll",this.delayedScroll))}},{key:"onChangeScroll",value:function(){this.useIntersectionObserver||this.setState({scrollPosition:{x:q(),y:A()}})}},{key:"render",value:function(){var s=this.props,c=(s.delayMethod,s.delayTime,function(d,v){if(d==null)return{};var g,b,I=function(N,de){if(N==null)return{};var se,ve,Ie={},Ne=Object.keys(N);for(ve=0;ve=0||(Ie[se]=N[se]);return Ie}(d,v);if(Object.getOwnPropertySymbols){var x=Object.getOwnPropertySymbols(d);for(b=0;b=0||Object.prototype.propertyIsEnumerable.call(d,g)&&(I[g]=d[g])}return I}(s,w)),u=this.useIntersectionObserver?null:this.state.scrollPosition;return f().createElement(r,L({forwardRef:this.baseComponentRef,scrollPosition:u},c))}}])&&M(o.prototype,E),n}(f().Component);return e.propTypes={delayMethod:a.PropTypes.oneOf(["debounce","throttle"]),delayTime:a.PropTypes.number,useIntersectionObserver:a.PropTypes.bool},e.defaultProps={delayMethod:"throttle",delayTime:300,useIntersectionObserver:!0},e};function Z(r){return(Z=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(e){return typeof e}:function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(r)}function re(r,e){for(var i=0;i"u"||!Reflect.construct||Reflect.construct.sham)return!1;if(typeof Proxy=="function")return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){})),!0}catch{return!1}}(),function(){var t,n=Y(o);if(E){var s=Y(this).constructor;t=Reflect.construct(n,arguments,s)}else t=n.apply(this,arguments);return B(this,t)});function h(t){return function(n,s){if(!(n instanceof s))throw new TypeError("Cannot call a class as a function")}(this,h),ee.call(this,t)}return e=h,(i=[{key:"render",value:function(){return f().createElement(K,this.props)}}])&&re(e.prototype,i),h}(f().Component);const me=Q(fe);function pe(r){return(pe=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(e){return typeof e}:function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(r)}function _(r,e){for(var i=0;i"u"||!Reflect.construct||Reflect.construct.sham)return!1;if(typeof Proxy=="function")return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){})),!0}catch{return!1}}(),function(){var t,n=ge(o);if(E){var s=ge(this).constructor;t=Reflect.construct(n,arguments,s)}else t=n.apply(this,arguments);return ye(this,t)});function h(t){var n;(function(v,g){if(!(v instanceof g))throw new TypeError("Cannot call a class as a function")})(this,h),n=ee.call(this,t);var s=t.afterLoad,c=t.beforeLoad,u=t.scrollPosition,d=t.visibleByDefault;return n.state={visible:d},d&&(c(),s()),n.onVisible=n.onVisible.bind(xe(n)),n.isScrollTracked=Boolean(u&&Number.isFinite(u.x)&&u.x>=0&&Number.isFinite(u.y)&&u.y>=0),n}return e=h,(i=[{key:"componentDidUpdate",value:function(t,n){n.visible!==this.state.visible&&this.props.afterLoad()}},{key:"onVisible",value:function(){this.props.beforeLoad(),this.setState({visible:!0})}},{key:"render",value:function(){if(this.state.visible)return this.props.children;var t=this.props,n=t.className,s=t.delayMethod,c=t.delayTime,u=t.height,d=t.placeholder,v=t.scrollPosition,g=t.style,b=t.threshold,I=t.useIntersectionObserver,x=t.width;return this.isScrollTracked||I&&z()?f().createElement(K,{className:n,height:u,onVisible:this.onVisible,placeholder:d,scrollPosition:v,style:g,threshold:b,useIntersectionObserver:I,width:x}):f().createElement(me,{className:n,delayMethod:s,delayTime:c,height:u,onVisible:this.onVisible,placeholder:d,style:g,threshold:b,width:x})}}])&&_(e.prototype,i),h}(f().Component);we.propTypes={afterLoad:a.PropTypes.func,beforeLoad:a.PropTypes.func,useIntersectionObserver:a.PropTypes.bool,visibleByDefault:a.PropTypes.bool},we.defaultProps={afterLoad:function(){return{}},beforeLoad:function(){return{}},useIntersectionObserver:!0,visibleByDefault:!1};const Se=we;function ke(r){return(ke=typeof Symbol=="function"&&typeof Symbol.iterator=="symbol"?function(e){return typeof e}:function(e){return e&&typeof Symbol=="function"&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(r)}var Ce=["afterLoad","beforeLoad","delayMethod","delayTime","effect","placeholder","placeholderSrc","scrollPosition","threshold","useIntersectionObserver","visibleByDefault","wrapperClassName","wrapperProps"];function _e(r,e){var i=Object.keys(r);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(r);e&&(o=o.filter(function(E){return Object.getOwnPropertyDescriptor(r,E).enumerable})),i.push.apply(i,o)}return i}function Ee(r){for(var e=1;e"u"||!Reflect.construct||Reflect.construct.sham)return!1;if(typeof Proxy=="function")return!0;try{return Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],function(){})),!0}catch{return!1}}(),function(){var t,n=Pe(o);if(E){var s=Pe(this).constructor;t=Reflect.construct(n,arguments,s)}else t=n.apply(this,arguments);return Be(this,t)});function h(t){var n;return function(s,c){if(!(s instanceof c))throw new TypeError("Cannot call a class as a function")}(this,h),(n=ee.call(this,t)).state={loaded:!1},n}return e=h,(i=[{key:"onImageLoad",value:function(){var t=this;return this.state.loaded?null:function(){t.props.afterLoad(),t.setState({loaded:!0})}}},{key:"getImg",value:function(){var t=this.props,n=(t.afterLoad,t.beforeLoad,t.delayMethod,t.delayTime,t.effect,t.placeholder,t.placeholderSrc,t.scrollPosition,t.threshold,t.useIntersectionObserver,t.visibleByDefault,t.wrapperClassName,t.wrapperProps,function(s,c){if(s==null)return{};var u,d,v=function(b,I){if(b==null)return{};var x,N,de={},se=Object.keys(b);for(N=0;N=0||(de[x]=b[x]);return de}(s,c);if(Object.getOwnPropertySymbols){var g=Object.getOwnPropertySymbols(s);for(d=0;d=0||Object.prototype.propertyIsEnumerable.call(s,u)&&(v[u]=s[u])}return v}(t,Ce));return f().createElement("img",Oe({onLoad:this.onImageLoad()},n))}},{key:"getLazyLoadImage",value:function(){var t=this.props,n=t.beforeLoad,s=t.className,c=t.delayMethod,u=t.delayTime,d=t.height,v=t.placeholder,g=t.scrollPosition,b=t.style,I=t.threshold,x=t.useIntersectionObserver,N=t.visibleByDefault,de=t.width;return f().createElement(Se,{beforeLoad:n,className:s,delayMethod:c,delayTime:u,height:d,placeholder:v,scrollPosition:g,style:b,threshold:I,useIntersectionObserver:x,visibleByDefault:N,width:de},this.getImg())}},{key:"getWrappedLazyLoadImage",value:function(t){var n=this.props,s=n.effect,c=n.height,u=n.placeholderSrc,d=n.width,v=n.wrapperClassName,g=n.wrapperProps,b=this.state.loaded,I=b?" lazy-load-image-loaded":"",x=b||!u?{}:{backgroundImage:"url(".concat(u,")"),backgroundSize:"100% 100%"};return f().createElement("span",Oe({className:v+" lazy-load-image-background "+s+I,style:Ee(Ee({},x),{},{color:"transparent",display:"inline-block",height:c,width:d})},g),t)}},{key:"render",value:function(){var t=this.props,n=t.effect,s=t.placeholderSrc,c=t.visibleByDefault,u=t.wrapperClassName,d=t.wrapperProps,v=this.getLazyLoadImage();return(n||s)&&!c||u||d?this.getWrappedLazyLoadImage(v):v}}])&&Me(e.prototype,i),h}(f().Component);je.propTypes={afterLoad:a.PropTypes.func,beforeLoad:a.PropTypes.func,delayMethod:a.PropTypes.string,delayTime:a.PropTypes.number,effect:a.PropTypes.string,placeholderSrc:a.PropTypes.string,threshold:a.PropTypes.number,useIntersectionObserver:a.PropTypes.bool,visibleByDefault:a.PropTypes.bool,wrapperClassName:a.PropTypes.string,wrapperProps:a.PropTypes.object},je.defaultProps={afterLoad:function(){return{}},beforeLoad:function(){return{}},delayMethod:"throttle",delayTime:300,effect:"",placeholderSrc:null,threshold:100,useIntersectionObserver:!0,visibleByDefault:!1,wrapperClassName:""};const Ve=je})(),Ae.exports=ae})();const Je=()=>{const oe=qe();return X(Re.div,{className:"w-[80%] mx-auto lg:overflow-auto lg:h-[600px]",initial:{opacity:0},animate:oe,exit:{opacity:0,transition:{ease:"easeInOut"}},children:He.map(({id:he,img:O,title:ae,subtitle:p,language:f,code:a,codeLink:J,view:V,viewLink:z})=>X("div",{className:"mb-[24px]",children:be(Re.div,{className:"rounded lg:overflow-hidden shadow-lg w-80 h-full mx-auto bg-white dark:bg-secondary",children:[X(Te.LazyLoadImage,{src:O,alt:ae,effect:"blur",placeholderSrc:O}),be("div",{className:"p-5 ",children:[X("div",{className:"font-[500] text-[18px] leading-[22.97px] mt-[12px] text-black2 dark:text-white",children:ae}),X("p",{className:"text-gray text-[14px] leading-[20.42px]",children:p}),X("p",{className:"mt-[12px] text-[#222222] dark:text-white2",children:f}),be("div",{className:"mt-[12px] flex gap-[30px]",children:[a&&X("span",{className:"flex justify-center items-center cursor-pointer gap-[8px] text-black2 text-[14px] hover:opacity-75 hover:scale-110 transistion-all duration-500",children:be(Ue,{children:[X($e,{className:"dark:fill-white fill-black2"}),X("a",{href:J,className:"dark:text-gray",children:a})]})}),be("span",{className:"flex justify-center items-center cursor-pointer gap-[8px] text-black2 text-[14px] hover:opacity-75 hover:scale-110 transistion-all duration-500",children:[X(Ge,{className:"dark:text-white"}),X("a",{href:z,className:"dark:text-gray",children:V})]})]})]})]},he)},he))})};export{Je as default}; 2 | -------------------------------------------------------------------------------- /dist/assets/Contact-d6af9908.js: -------------------------------------------------------------------------------- 1 | import{e as B,g as Y,b as I,u as K,a as N,m as z,j as U}from"./index-94a40de8.js";import{e as X}from"./index-f4bd556f.js";var S={},V={get exports(){return S},set exports(A){S=A}};(function(A,P){(function(_,e){A.exports=e()})(B,function(){return function(_){function e(t){if(r[t])return r[t].exports;var a=r[t]={i:t,l:!1,exports:{}};return _[t].call(a.exports,a,a.exports,e),a.l=!0,a.exports}var r={};return e.m=_,e.c=r,e.d=function(t,a,o){e.o(t,a)||Object.defineProperty(t,a,{configurable:!1,enumerable:!0,get:o})},e.n=function(t){var a=t&&t.__esModule?function(){return t.default}:function(){return t};return e.d(a,"a",a),a},e.o=function(t,a){return Object.prototype.hasOwnProperty.call(t,a)},e.p="",e(e.s=8)}([function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t="swal-button";e.CLASS_NAMES={MODAL:"swal-modal",OVERLAY:"swal-overlay",SHOW_MODAL:"swal-overlay--show-modal",MODAL_TITLE:"swal-title",MODAL_TEXT:"swal-text",ICON:"swal-icon",ICON_CUSTOM:"swal-icon--custom",CONTENT:"swal-content",FOOTER:"swal-footer",BUTTON_CONTAINER:"swal-button-container",BUTTON:t,CONFIRM_BUTTON:t+"--confirm",CANCEL_BUTTON:t+"--cancel",DANGER_BUTTON:t+"--danger",BUTTON_LOADING:t+"--loading",BUTTON_LOADER:t+"__loader"},e.default=e.CLASS_NAMES},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0}),e.getNode=function(t){var a="."+t;return document.querySelector(a)},e.stringToNode=function(t){var a=document.createElement("div");return a.innerHTML=t.trim(),a.firstChild},e.insertAfter=function(t,a){var o=a.nextSibling;a.parentNode.insertBefore(t,o)},e.removeNode=function(t){t.parentElement.removeChild(t)},e.throwErr=function(t){throw t=t.replace(/ +(?= )/g,""),"SweetAlert: "+(t=t.trim())},e.isPlainObject=function(t){if(Object.prototype.toString.call(t)!=="[object Object]")return!1;var a=Object.getPrototypeOf(t);return a===null||a===Object.prototype},e.ordinalSuffixOf=function(t){var a=t%10,o=t%100;return a===1&&o!==11?t+"st":a===2&&o!==12?t+"nd":a===3&&o!==13?t+"rd":t+"th"}},function(_,e,r){function t(b){for(var u in b)e.hasOwnProperty(u)||(e[u]=b[u])}Object.defineProperty(e,"__esModule",{value:!0}),t(r(25));var a=r(26);e.overlayMarkup=a.default,t(r(27)),t(r(28)),t(r(29));var o=r(0),c=o.default.MODAL_TITLE,l=o.default.MODAL_TEXT,v=o.default.ICON,m=o.default.FOOTER;e.iconMarkup=` 2 |
',e.titleMarkup=` 3 |
4 | `,e.textMarkup=` 5 |
',e.footerMarkup=` 6 |
7 | `},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(1);e.CONFIRM_KEY="confirm",e.CANCEL_KEY="cancel";var a={visible:!0,text:null,value:null,className:"",closeModal:!0},o=Object.assign({},a,{visible:!1,text:"Cancel",value:null}),c=Object.assign({},a,{text:"OK",value:!0});e.defaultButtonList={cancel:o,confirm:c};var l=function(u){switch(u){case e.CONFIRM_KEY:return c;case e.CANCEL_KEY:return o;default:var d=u.charAt(0).toUpperCase()+u.slice(1);return Object.assign({},a,{text:d,value:u})}},v=function(u,d){var w=l(u);return d===!0?Object.assign({},w,{visible:!0}):typeof d=="string"?Object.assign({},w,{visible:!0,text:d}):t.isPlainObject(d)?Object.assign({visible:!0},w,d):Object.assign({},w,{visible:!1})},m=function(u){for(var d={},w=0,x=Object.keys(u);w=0&&y.splice(f,1)}function l(h){var f=document.createElement("style");return h.attrs.type="text/css",m(f,h.attrs),o(h,f),f}function v(h){var f=document.createElement("link");return h.attrs.type="text/css",h.attrs.rel="stylesheet",m(f,h.attrs),o(h,f),f}function m(h,f){Object.keys(f).forEach(function(k){h.setAttribute(k,f[k])})}function b(h,f){var k,p,O,E;if(f.transform&&h.css){if(!(E=f.transform(h.css)))return function(){};h.css=E}if(f.singleton){var T=g++;k=i||(i=l(f)),p=u.bind(null,k,T,!1),O=u.bind(null,k,T,!0)}else h.sourceMap&&typeof URL=="function"&&typeof URL.createObjectURL=="function"&&typeof URL.revokeObjectURL=="function"&&typeof Blob=="function"&&typeof btoa=="function"?(k=v(f),p=w.bind(null,k,f),O=function(){c(k),k.href&&URL.revokeObjectURL(k.href)}):(k=l(f),p=d.bind(null,k),O=function(){c(k)});return p(h),function(M){if(M){if(M.css===h.css&&M.media===h.media&&M.sourceMap===h.sourceMap)return;p(h=M)}else O()}}function u(h,f,k,p){var O=k?"":p.css;if(h.styleSheet)h.styleSheet.cssText=C(f,O);else{var E=document.createTextNode(O),T=h.childNodes;T[f]&&h.removeChild(T[f]),T.length?h.insertBefore(E,T[f]):h.appendChild(E)}}function d(h,f){var k=f.css,p=f.media;if(p&&h.setAttribute("media",p),h.styleSheet)h.styleSheet.cssText=k;else{for(;h.firstChild;)h.removeChild(h.firstChild);h.appendChild(document.createTextNode(k))}}function w(h,f,k){var p=k.css,O=k.sourceMap,E=f.convertToAbsoluteUrls===void 0&&O;(f.convertToAbsoluteUrls||E)&&(p=j(p)),O&&(p+=` 11 | /*# sourceMappingURL=data:application/json;base64,`+btoa(unescape(encodeURIComponent(JSON.stringify(O))))+" */");var T=new Blob([p],{type:"text/css"}),M=h.href;h.href=URL.createObjectURL(T),M&&URL.revokeObjectURL(M)}var x={},n=function(h){var f;return function(){return f===void 0&&(f=h.apply(this,arguments)),f}}(function(){return window&&document&&document.all&&!window.atob}),s=function(h){var f={};return function(k){return f[k]===void 0&&(f[k]=h.call(this,k)),f[k]}}(function(h){return document.querySelector(h)}),i=null,g=0,y=[],j=r(15);_.exports=function(h,f){if(typeof DEBUG<"u"&&DEBUG&&typeof document!="object")throw new Error("The style-loader cannot be used in a non-browser environment");f=f||{},f.attrs=typeof f.attrs=="object"?f.attrs:{},f.singleton||(f.singleton=n()),f.insertInto||(f.insertInto="head"),f.insertAt||(f.insertAt="bottom");var k=a(h,f);return t(k,f),function(p){for(var O=[],E=0;E"u"||window.Promise||(window.Promise=t),r(21),String.prototype.includes||(String.prototype.includes=function(a,o){return typeof o!="number"&&(o=0),!(o+a.length>this.length)&&this.indexOf(a,o)!==-1}),Array.prototype.includes||Object.defineProperty(Array.prototype,"includes",{value:function(a,o){if(this==null)throw new TypeError('"this" is null or not defined');var c=Object(this),l=c.length>>>0;if(l===0)return!1;for(var v=0|o,m=Math.max(v>=0?v:l-Math.abs(v),0);m=0&&(o._idleTimeoutId=setTimeout(function(){o._onTimeout&&o._onTimeout()},c))},r(19),e.setImmediate=setImmediate,e.clearImmediate=clearImmediate},function(_,e,r){(function(t,a){(function(o,c){function l(i){typeof i!="function"&&(i=new Function(""+i));for(var g=new Array(arguments.length-1),y=0;y"u"?t===void 0?this:t:self)}).call(e,r(7),r(20))},function(_,e){function r(){throw new Error("setTimeout has not been defined")}function t(){throw new Error("clearTimeout has not been defined")}function a(i){if(b===setTimeout)return setTimeout(i,0);if((b===r||!b)&&setTimeout)return b=setTimeout,setTimeout(i,0);try{return b(i,0)}catch{try{return b.call(null,i,0)}catch{return b.call(this,i,0)}}}function o(i){if(u===clearTimeout)return clearTimeout(i);if((u===t||!u)&&clearTimeout)return u=clearTimeout,clearTimeout(i);try{return u(i)}catch{try{return u.call(null,i)}catch{return u.call(this,i)}}}function c(){n&&w&&(n=!1,w.length?x=w.concat(x):s=-1,x.length&&l())}function l(){if(!n){var i=a(c);n=!0;for(var g=x.length;g;){for(w=x,x=[];++s1)for(var y=1;y',e.default=e.modalMarkup},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(0),a=t.default.OVERLAY,o=`
16 |
`;e.default=o},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(0),a=t.default.ICON;e.errorIconMarkup=function(){var o=a+"--error",c=o+"__line";return` 17 |
18 | 19 | 20 |
21 | `},e.warningIconMarkup=function(){var o=a+"--warning";return` 22 | 23 | 24 | 25 | `},e.successIconMarkup=function(){var o=a+"--success";return` 26 | 27 | 28 | 29 |
30 |
31 | `}},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(0),a=t.default.CONTENT;e.contentMarkup=` 32 |
33 | 34 |
35 | `},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(0),a=t.default.BUTTON_CONTAINER,o=t.default.BUTTON,c=t.default.BUTTON_LOADER;e.buttonMarkup=` 36 |
37 | 38 | 41 | 42 |
43 |
44 |
45 |
46 |
47 | 48 |
49 | `},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(4),a=r(2),o=r(0),c=o.default.ICON,l=o.default.ICON_CUSTOM,v=["error","warning","success","info"],m={error:a.errorIconMarkup(),warning:a.warningIconMarkup(),success:a.successIconMarkup()},b=function(w,x){var n=c+"--"+w;x.classList.add(n);var s=m[w];s&&(x.innerHTML=s)},u=function(w,x){x.classList.add(l);var n=document.createElement("img");n.src=w,x.appendChild(n)},d=function(w){if(w){var x=t.injectElIntoModal(a.iconMarkup);v.includes(w)?b(w,x):u(w,x)}};e.default=d},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(2),a=r(4),o=function(c){navigator.userAgent.includes("AppleWebKit")&&(c.style.display="none",c.offsetHeight,c.style.display="")};e.initTitle=function(c){if(c){var l=a.injectElIntoModal(t.titleMarkup);l.textContent=c,o(l)}},e.initText=function(c){if(c){var l=document.createDocumentFragment();c.split(` 50 | `).forEach(function(m,b,u){l.appendChild(document.createTextNode(m)),b0}).forEach(function(p){h.classList.add(p)}),s&&x===v.CONFIRM_KEY&&h.classList.add(l),h.textContent=i;var k={};return k[x]=g,u.setActionValue(k),u.setActionOptionsFor(x,{closeModal:j}),h.addEventListener("click",function(){return b.onAction(x)}),C},w=function(x,n){var s=a.injectElIntoModal(m.footerMarkup);for(var i in x){var g=x[i],y=d(i,g,n);g.visible&&s.appendChild(y)}s.children.length===0&&s.remove()};e.default=w},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(3),a=r(4),o=r(2),c=r(5),l=r(6),v=r(0),m=v.default.CONTENT,b=function(w){w.addEventListener("input",function(x){var n=x.target,s=n.value;c.setActionValue(s)}),w.addEventListener("keyup",function(x){if(x.key==="Enter")return l.onAction(t.CONFIRM_KEY)}),setTimeout(function(){w.focus(),c.setActionValue("")},0)},u=function(w,x,n){var s=document.createElement(x),i=m+"__"+x;s.classList.add(i);for(var g in n){var y=n[g];s[g]=y}x==="input"&&b(s),w.appendChild(s)},d=function(w){if(w){var x=a.injectElIntoModal(o.contentMarkup),n=w.element,s=w.attributes;typeof n=="string"?u(x,n,s):x.appendChild(n)}};e.default=d},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(1),a=r(2),o=function(){var c=t.stringToNode(a.overlayMarkup);document.body.appendChild(c)};e.default=o},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(5),a=r(6),o=r(1),c=r(3),l=r(0),v=l.default.MODAL,m=l.default.BUTTON,b=l.default.OVERLAY,u=function(p){p.preventDefault(),s()},d=function(p){p.preventDefault(),i()},w=function(p){if(t.default.isOpen)switch(p.key){case"Escape":return a.onAction(c.CANCEL_KEY)}},x=function(p){if(t.default.isOpen)switch(p.key){case"Tab":return u(p)}},n=function(p){if(t.default.isOpen)return p.key==="Tab"&&p.shiftKey?d(p):void 0},s=function(){var p=o.getNode(m);p&&(p.tabIndex=0,p.focus())},i=function(){var p=o.getNode(v),O=p.querySelectorAll("."+m),E=O.length-1,T=O[E];T&&T.focus()},g=function(p){p[p.length-1].addEventListener("keydown",x)},y=function(p){p[0].addEventListener("keydown",n)},j=function(){var p=o.getNode(v),O=p.querySelectorAll("."+m);O.length&&(g(O),y(O))},C=function(p){if(o.getNode(b)===p.target)return a.onAction(c.CANCEL_KEY)},h=function(p){var O=o.getNode(b);O.removeEventListener("click",C),p&&O.addEventListener("click",C)},f=function(p){t.default.timer&&clearTimeout(t.default.timer),p&&(t.default.timer=window.setTimeout(function(){return a.onAction(c.CANCEL_KEY)},p))},k=function(p){p.closeOnEsc?document.addEventListener("keyup",w):document.removeEventListener("keyup",w),p.dangerMode?s():i(),j(),h(p.closeOnClickOutside),f(p.timer)};e.default=k},function(_,e,r){Object.defineProperty(e,"__esModule",{value:!0});var t=r(1),a=r(3),o=r(37),c=r(38),l={title:null,text:null,icon:null,buttons:a.defaultButtonList,content:null,className:null,closeOnClickOutside:!0,closeOnEsc:!0,dangerMode:!1,timer:null},v=Object.assign({},l);e.setDefaults=function(n){v=Object.assign({},l,n)};var m=function(n){var s=n&&n.button,i=n&&n.buttons;return s!==void 0&&i!==void 0&&t.throwErr("Cannot set both 'button' and 'buttons' options!"),s!==void 0?{confirm:s}:i},b=function(n){return t.ordinalSuffixOf(n+1)},u=function(n,s){t.throwErr(b(s)+" argument ('"+n+"') is invalid")},d=function(n,s){var i=n+1,g=s[i];t.isPlainObject(g)||g===void 0||t.throwErr("Expected "+b(i)+" argument ('"+g+"') to be a plain object")},w=function(n,s){var i=n+1,g=s[i];g!==void 0&&t.throwErr("Unexpected "+b(i)+" argument ("+g+")")},x=function(n,s,i,g){var y=typeof s,j=y==="string",C=s instanceof Element;if(j){if(i===0)return{text:s};if(i===1)return{text:s,title:g[0]};if(i===2)return d(i,g),{icon:s};u(s,i)}else{if(C&&i===0)return d(i,g),{content:s};if(t.isPlainObject(s))return w(i,g),s;u(s,i)}};e.getOpts=function(){for(var n=[],s=0;s{const[A,P]=I.useState(""),[_,e]=I.useState(""),[r,t]=I.useState(""),a=I.useRef(),o=K(),c=l=>{l.preventDefault(),A.length===0||_.length===0||r.length===0?F("Please complete filling the form","error"):(F("Successful!","I'll get back to you!","success"),X.sendForm("service_aakyhrk","template_scsfe35",a.current,"rBHPqsGP1vYUCEoP9").then(v=>{console.log(v.text),console.log("sent")},v=>{console.log(v.text)})),P(""),e(""),t("")};return N(z.div,{initial:{opacity:0},animate:o,exit:{opacity:0,transition:{ease:"easeInOut"}},children:N("form",{ref:a,className:"space-y-6 h-[500px] flex items-center justify-center",onSubmit:c,children:U("div",{className:"items-center justify-center place-items-center grid gap-8",children:[N("input",{type:"text",name:"user_name",value:A,placeholder:"Enter your name",required:!0,onChange:l=>P(l.target.value),className:"border-[#2D2929] dark:border-white border-[3px] p-5 outline-none w-[500px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2"}),N("input",{type:"email",name:"user_email",value:_,placeholder:"Enter your mail",required:!0,onChange:l=>e(l.target.value),className:"border-[#2D2929] dark:border-white border-[3px] p-5 outline-none w-[500px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2"}),N("textarea",{name:"message",id:"message",value:r,placeholder:"Message",required:!0,onChange:l=>t(l.target.value),className:"border-[#2D2929] dark:border-white border-[3px] p-4 outline-none w-[500px] h-[150px] text-[14px] bg-[#F2F2F2] dark:bg-bgblack dark:text-grey2"}),N("button",{className:"items-center justify-center place-items-center grid",type:"submit",children:U("span",{className:"relative w-[500px] h-[60px] group px-6 py-3 font-bold",children:[N("span",{className:"absolute inset-0 w-[490px] h-[60px] border-2 border-darkgrey dark:border-white translate-y-2 translate-x-2 transition duration-300 ease-out transform group-hover:translate-y-0 group-hover:translate-x-0"}),N("span",{className:"absolute inset-0 w-[490px] h-[60px] bg-darkgrey dark:bg-white"}),N("span",{className:"text-resume dark:text-darkgrey text-[18px] text-center font-[700] leading-[24px] relative group-hover:opacity-85",children:"CONNECT"})]})})]})})})};export{W as default}; 51 | --------------------------------------------------------------------------------