My Qualifications & Experience
Experience
diff --git a/src/components/header/Header.jsx b/src/components/header/Header.jsx index 527e246..b758edf 100644 --- a/src/components/header/Header.jsx +++ b/src/components/header/Header.jsx @@ -1,73 +1,14 @@ import React from "react"; -import CTA from "./CTA"; import "./header.css"; -import ME from "../../assets/me.png"; -import HeaderSocials from "./HeaderSocials"; -import { BsMouse } from "react-icons/bs"; +import HeaderLayput from "./HeaderLayput"; +import Navbar from "./Navbar"; const Header = () => { return ( -
-
-
-
-
-
-
- Hello I'm
-
-
- Abhishek
- {/*data-aos="zoom-in-up"*/}
-
- Fullstack Developer
-
-
- A tech enthusiast and interested in reaching peep's
-
-
- A tech enthusiast and interested in reaching peep's
to
- share thoughts and learn something new.
-
-
-
- CSE Student @ PES University
-
- 
-
-
- Scroll Down
-
+
);
};
diff --git a/src/components/header/HeaderLayput.jsx b/src/components/header/HeaderLayput.jsx
new file mode 100644
index 0000000..7ff102f
--- /dev/null
+++ b/src/components/header/HeaderLayput.jsx
@@ -0,0 +1,111 @@
+import React from "react";
+import { TypeAnimation } from "react-type-animation";
+import { personalData } from "../utils/data/personal-data";
+import { motion } from "framer-motion";
+import { BsGithub, BsLinkedin } from "react-icons/bs";
+import { FaFacebook, FaTwitterSquare } from "react-icons/fa";
+import { MdDownload } from "react-icons/md";
+import { RiContactsFill } from "react-icons/ri";
+import { FiInstagram } from 'react-icons/fi'
+
+const HeaderLayput = () => {
+ return (
+
+
+
+
+ );
+};
+
+export default HeaderLayput;
diff --git a/src/components/header/Navbar.jsx b/src/components/header/Navbar.jsx
new file mode 100644
index 0000000..51ded29
--- /dev/null
+++ b/src/components/header/Navbar.jsx
@@ -0,0 +1,36 @@
+import React from "react";
+import { links } from "../utils/data/NavigationData";
+import logo from "../../assets/me-about.jpg";
+
+const Navbar = ({ currentPath, scrollToSection }) => {
+ return (
+
+
+ Hello, I'm{" "}
+
+
+
+ +
+ A tech enthusiast and interested in reaching peep's to share
+ thoughts and learn somthing new.
+
+
+ {" "}
+ CSE Student @ PES University
+
+
+
+
+
+
+
+ Get Resume
+
+
+
+ );
+};
+
+export default Navbar;
diff --git a/src/components/utils/data/NavigationData.js b/src/components/utils/data/NavigationData.js
new file mode 100644
index 0000000..8d3cf36
--- /dev/null
+++ b/src/components/utils/data/NavigationData.js
@@ -0,0 +1,8 @@
+export const links = [
+ { label: "Home", path: "/", id: "home" },
+ { label: "About", path: "/about", id: "about" },
+ { label: "Skills", path: "/skills", id: "skills" },
+ { label: "Experience", path: "/experience", id: "experience" },
+ { label: "Portfolio", path: "/portfolio", id: "portfolio" },
+ { label: "Contact", path: "/contact", id: "contact" },
+];
diff --git a/src/components/utils/data/personal-data.js b/src/components/utils/data/personal-data.js
new file mode 100644
index 0000000..32c3f08
--- /dev/null
+++ b/src/components/utils/data/personal-data.js
@@ -0,0 +1,13 @@
+export const personalData = {
+ email: 'abhihonnapure@gmail.com',
+ phone: '+91 9019833847',
+ address: 'Bengaluru, Karnataka, India - 560100',
+ github: 'https://github.com/its-abhishek',
+ facebook: 'https://www.facebook.com/abhi.honnapure',
+ linkedIn: 'https://www.linkedin.com/in/abhishek-honnapure-547636232/',
+ twitter: 'https://twitter.com/AbhishekHonnap4',
+ instagram: 'https://www.instagram.com/abhishek_honnapure/',
+ leetcode: "https://leetcode.com/said3812/",
+ devUsername: "itsabhishek",
+ resume: "/Abhishek_Honnapure.pdf"
+}
\ No newline at end of file
diff --git a/src/index.css b/src/index.css
index 9a358c5..dadd696 100644
--- a/src/index.css
+++ b/src/index.css
@@ -1,4 +1,7 @@
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap');
+@tailwind base;
+@tailwind components;
+@tailwind utilities;
* {
margin: 0;
@@ -13,7 +16,7 @@
:root {
--color-bg: #1f1f38;
--color-bg-variant: #2c2c6c;
- --color-primary: #4db5ff;
+ --color-primary: #60A5FA;
--color-primary-variant: rgba(77,181,255,0.4);
--color-white: #fff;
--color-light: rgba(255,255,255,0.6);
@@ -40,7 +43,7 @@ body {
background: var(--color-bg);
color: var(--color-white);
line-height: 1.7;
- background-image: url(../src/assets/bg-texture.png);
+ /* background-image: url(../src/assets/bg-texture.png); */
overflow-x: hidden;
}
diff --git a/tailwind.config.js b/tailwind.config.js
new file mode 100644
index 0000000..f476379
--- /dev/null
+++ b/tailwind.config.js
@@ -0,0 +1,24 @@
+/** @type {import('tailwindcss').Config} */
+const colors = require("tailwindcss/colors");
+module.exports = {
+ content: [
+ "./src/pages/**/*.{js,ts,jsx,tsx,mdx}",
+ "./src/components/**/*.{js,ts,jsx,tsx,mdx}",
+ "./src/app/**/*.{js,ts,jsx,tsx,mdx}",
+ ],
+ theme: {
+ extend: {
+ backgroundImage: {
+ "gradient-radial": "radial-gradient(var(--tw-gradient-stops))",
+ "gradient-conic":
+ "conic-gradient(from 180deg at 50% 50%, var(--tw-gradient-stops))",
+ },
+ },
+ colors: {
+ ...colors,
+ primary: colors.blue,
+ secondary: colors.blue,
+ },
+ },
+ plugins: [],
+};
+
+
+
+ 
+
+
+
+
+ -
+ {links.map((link) => (
+
- + scrollToSection(link.path, link.id, e)} + > + {link.label} + + + ))} +