├── 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 |
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 |
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 |
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 |
15 | Go back home
16 |
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 |
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 |
43 | {theme === "dark" ? (
44 |
45 |
46 |
47 | ) : (
48 |
49 |
50 |
51 | )}
52 |
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 |
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 |
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 |
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 |
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 |
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 |
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 | setMessage(e.target.value)}
102 | 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"
103 | >
104 |
105 |
109 |
110 |
111 |
112 |
113 | CONNECT
114 |
115 |
116 |
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 |
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 |
--------------------------------------------------------------------------------