diff --git a/public/favicon.ico b/public/favicon.ico new file mode 100644 index 00000000..e2e77625 Binary files /dev/null and b/public/favicon.ico differ diff --git a/public/favicon.png b/public/favicon.png index 03d88ec1..2d5595ab 100644 Binary files a/public/favicon.png and b/public/favicon.png differ diff --git a/public/files/Owen-Adams-Resume.pdf b/public/files/Owen-Adams-Resume.pdf new file mode 100644 index 00000000..cc97453e Binary files /dev/null and b/public/files/Owen-Adams-Resume.pdf differ diff --git a/public/files/Stoman-Resume.pdf b/public/files/Stoman-Resume.pdf deleted file mode 100644 index c09d0fe6..00000000 Binary files a/public/files/Stoman-Resume.pdf and /dev/null differ diff --git a/public/index.html b/public/index.html index bbf198b3..5fdaf16c 100644 --- a/public/index.html +++ b/public/index.html @@ -1,21 +1,20 @@ - - - - - - - - - - - Stoman - - - -
- + --> + diff --git a/public/logo192.png b/public/logo192.png index fc44b0a3..198bcddf 100644 Binary files a/public/logo192.png and b/public/logo192.png differ diff --git a/public/logo512.png b/public/logo512.png index a4e47a65..72365bcf 100644 Binary files a/public/logo512.png and b/public/logo512.png differ diff --git a/public/manifest.json b/public/manifest.json index 080d6c77..e781abb7 100644 --- a/public/manifest.json +++ b/public/manifest.json @@ -1,6 +1,6 @@ { - "short_name": "React App", - "name": "Create React App Sample", + "short_name": "osastack", + "name": "Owen Adams Portfolio Website", "icons": [ { "src": "favicon.ico", diff --git a/src/components/shared/AppBanner.jsx b/src/components/shared/AppBanner.jsx index aab7dca9..31c4f774 100644 --- a/src/components/shared/AppBanner.jsx +++ b/src/components/shared/AppBanner.jsx @@ -1,82 +1,80 @@ -import useThemeSwitcher from '../../hooks/useThemeSwitcher'; -import { FiArrowDownCircle } from 'react-icons/fi'; -import developerLight from '../../images/developer.svg'; -import developerDark from '../../images/developer-dark.svg'; -import { motion } from 'framer-motion'; +import useThemeSwitcher from "../../hooks/useThemeSwitcher"; +import { FiArrowDownCircle } from "react-icons/fi"; +import developerLight from "../../images/developer.svg"; +import developerDark from "../../images/developer-dark.svg"; +import { motion } from "framer-motion"; const AppBanner = () => { - const [activeTheme] = useThemeSwitcher(); + const [activeTheme] = useThemeSwitcher(); - return ( - -
- - Hi, Iam Stoman - - - A Full-Stack Developer & Design Enthusiast - - - - - - Download CV - - - -
- - Developer - - - ); + return ( + +
+ + Hello World!
I am Owen Adams + + + A Full-Stack Developer + + + + + + Download CV + + + +
+ + Developer + + + ); }; export default AppBanner; diff --git a/src/components/shared/AppFooter.jsx b/src/components/shared/AppFooter.jsx index 3f473245..8f80ea79 100644 --- a/src/components/shared/AppFooter.jsx +++ b/src/components/shared/AppFooter.jsx @@ -1,69 +1,51 @@ -import { - FiGithub, - FiTwitter, - FiLinkedin, - FiGlobe, - FiYoutube, -} from 'react-icons/fi'; -import AppFooterCopyright from './AppFooterCopyright'; +import { FiGithub, FiLinkedin, FiGlobe } from "react-icons/fi"; +import AppFooterCopyright from "./AppFooterCopyright"; const socialLinks = [ - { - id: 1, - icon: , - url: 'https://www.stoman.me/', - }, - { - id: 2, - icon: , - url: 'https://github.com/realstoman', - }, - { - id: 3, - icon: , - url: 'https://twitter.com/realstoman', - }, - { - id: 4, - icon: , - url: 'https://www.linkedin.com/in/realstoman', - }, - { - id: 5, - icon: , - url: 'https://www.youtube.com/c/realstoman', - }, + { + id: 1, + icon: , + url: "https://www.osastack.dev/", + }, + { + id: 2, + icon: , + url: "https://github.com/OSAdams", + }, + { + id: 3, + icon: , + url: "https://www.linkedin.com/in/owen-adams1", + }, ]; const AppFooter = () => { - return ( -
-
- {/* Footer social links */} -
-

- Follow me -

- -
+ return ( +
+
+ {/* Footer social links */} +
+

+ Follow me +

+ +
- -
-
- ); + +
+
+ ); }; export default AppFooter; diff --git a/src/components/shared/AppFooterCopyright.jsx b/src/components/shared/AppFooterCopyright.jsx index 2eaf0ab4..0afd440d 100644 --- a/src/components/shared/AppFooterCopyright.jsx +++ b/src/components/shared/AppFooterCopyright.jsx @@ -1,26 +1,26 @@ function AppFooterCopyright() { - return ( -
-
- © {new Date().getFullYear()} - - React & Tailwind CSS Portfolio - - . - - Stoman - -
-
- ); + return ( + + ); } export default AppFooterCopyright; diff --git a/src/components/shared/AppHeader.jsx b/src/components/shared/AppHeader.jsx index 0abc8bab..0b3ca350 100644 --- a/src/components/shared/AppHeader.jsx +++ b/src/components/shared/AppHeader.jsx @@ -1,207 +1,196 @@ -import { useState } from 'react'; -import { FiMenu, FiMoon, FiSun, FiX } from 'react-icons/fi'; -import { Link } from 'react-router-dom'; -import useThemeSwitcher from '../../hooks/useThemeSwitcher'; -import HireMeModal from '../HireMeModal'; -import logoLight from '../../images/logo-light.svg'; -import logoDark from '../../images/logo-dark.svg'; -import { motion } from 'framer-motion'; -import Button from '../reusable/Button'; +import { useState } from "react"; +import { FiMenu, FiMoon, FiSun, FiX } from "react-icons/fi"; +import { Link } from "react-router-dom"; +import useThemeSwitcher from "../../hooks/useThemeSwitcher"; +import HireMeModal from "../HireMeModal"; +import logoLight from "../../images/logo-light-no-background.svg"; +import logoDark from "../../images/logo-dark-no-background.svg"; +import { motion } from "framer-motion"; +import Button from "../reusable/Button"; const AppHeader = () => { - const [showMenu, setShowMenu] = useState(false); - const [showModal, setShowModal] = useState(false); - const [activeTheme, setTheme] = useThemeSwitcher(); + const [showMenu, setShowMenu] = useState(false); + const [showModal, setShowModal] = useState(false); + const [activeTheme, setTheme] = useThemeSwitcher(); - function toggleMenu() { - if (!showMenu) { - setShowMenu(true); - } else { - setShowMenu(false); - } - } + function toggleMenu() { + if (!showMenu) { + setShowMenu(true); + } else { + setShowMenu(false); + } + } - function showHireMeModal() { - if (!showModal) { - document - .getElementsByTagName('html')[0] - .classList.add('overflow-y-hidden'); - setShowModal(true); - } else { - document - .getElementsByTagName('html')[0] - .classList.remove('overflow-y-hidden'); - setShowModal(false); - } - } + function showHireMeModal() { + if (!showModal) { + document + .getElementsByTagName("html")[0] + .classList.add("overflow-y-hidden"); + setShowModal(true); + } else { + document + .getElementsByTagName("html")[0] + .classList.remove("overflow-y-hidden"); + setShowModal(false); + } + } - return ( - -
- {/* Header menu links and small screen hamburger menu */} -
-
- - {activeTheme === 'dark' ? ( - Dark Logo - ) : ( - Dark Logo - )} - -
+ return ( + +
+ {/* Header menu links and small screen hamburger menu */} +
+
+ + {activeTheme === "dark" ? ( + Dark Logo + ) : ( + Light Logo + )} + +
- {/* Theme switcher small screen */} -
setTheme(activeTheme)} - aria-label="Theme Switcher" - className="block sm:hidden ml-0 bg-primary-light dark:bg-ternary-dark p-3 shadow-sm rounded-xl cursor-pointer" - > - {activeTheme === 'dark' ? ( - - ) : ( - - )} -
+ {/* Theme switcher small screen */} +
setTheme(activeTheme)} + aria-label="Theme Switcher" + className="block sm:hidden ml-0 bg-primary-light dark:bg-ternary-dark p-3 shadow-sm rounded-xl cursor-pointer" + > + {activeTheme === "dark" ? ( + + ) : ( + + )} +
- {/* Small screen hamburger menu */} -
- -
-
+ {/* Small screen hamburger menu */} +
+ +
+
- {/* Header links small screen */} - + {/* Header links small screen */} + - {/* Header links large screen */} -
- - Projects - - - About Me - - - Contact - -
+ {/* Header links large screen */} +
+ + Projects + + + About Me + + + Contact + +
- {/* Header right section buttons */} -
-
- -
+ {/* Header right section buttons */} +
+
+ +
- {/* Theme switcher large screen */} -
setTheme(activeTheme)} - aria-label="Theme Switcher" - className="ml-8 bg-primary-light dark:bg-ternary-dark p-3 shadow-sm rounded-xl cursor-pointer" - > - {activeTheme === 'dark' ? ( - - ) : ( - - )} -
-
-
- {/* Hire me modal */} -
- {showModal ? ( - - ) : null} - {showModal ? showHireMeModal : null} -
- - ); + {/* Theme switcher large screen */} +
setTheme(activeTheme)} + aria-label="Theme Switcher" + className="ml-8 bg-primary-light dark:bg-ternary-dark p-3 shadow-sm rounded-xl cursor-pointer" + > + {activeTheme === "dark" ? ( + + ) : ( + + )} +
+
+
+ {/* Hire me modal */} +
+ {showModal ? ( + + ) : null} + {showModal ? showHireMeModal : null} +
+ + ); }; export default AppHeader; diff --git a/src/images/Color logo with background.svg b/src/images/Color logo with background.svg new file mode 100644 index 00000000..73af586f --- /dev/null +++ b/src/images/Color logo with background.svg @@ -0,0 +1,9 @@ + + + + + + + + \ No newline at end of file diff --git a/src/images/White logo - no background.svg b/src/images/White logo - no background.svg new file mode 100644 index 00000000..84358e28 --- /dev/null +++ b/src/images/White logo - no background.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/src/images/logo-dark-no-background.svg b/src/images/logo-dark-no-background.svg new file mode 100644 index 00000000..a9762a80 --- /dev/null +++ b/src/images/logo-dark-no-background.svg @@ -0,0 +1,8 @@ + + + + + + + + \ No newline at end of file diff --git a/src/images/logo-light-no-background.svg b/src/images/logo-light-no-background.svg new file mode 100644 index 00000000..feeb850b --- /dev/null +++ b/src/images/logo-light-no-background.svg @@ -0,0 +1,9 @@ + + + + + + + + \ No newline at end of file