diff --git a/public/index.html b/public/index.html index f8044ee345..772ca2e8ae 100644 --- a/public/index.html +++ b/public/index.html @@ -5,8 +5,8 @@ - DeveloperFolio | Developer Portfolio Template - + Portfolio | Saad Rasheed + diff --git a/src/_globalColor.scss b/src/_globalColor.scss index 03b06c22aa..45a6754491 100644 --- a/src/_globalColor.scss +++ b/src/_globalColor.scss @@ -28,7 +28,7 @@ $githubRepoCardColor: rgb(88, 96, 105); $githubRepoCardRepoCardStatsColor: rgb(106, 115, 125); $githubRepoCardRepoNameColor: rgb(36, 41, 46); $githubProfileCardLocationTS: #ffebcd; -$githubProfileCardBorder: #6c63ff; +$githubProfileCardBorder: #000000; // light background colors $lightBackground1: #fff; diff --git a/src/assets/images/ads_badge.png b/src/assets/images/ads_badge.png new file mode 100644 index 0000000000..7047990664 Binary files /dev/null and b/src/assets/images/ads_badge.png differ diff --git a/src/assets/images/ibm_badge.png b/src/assets/images/ibm_badge.png new file mode 100644 index 0000000000..bf8e965096 Binary files /dev/null and b/src/assets/images/ibm_badge.png differ diff --git a/src/assets/images/uolLogo.png b/src/assets/images/uolLogo.png new file mode 100644 index 0000000000..6b596cf9f3 Binary files /dev/null and b/src/assets/images/uolLogo.png differ diff --git a/src/assets/images/visabridgeLogo.png b/src/assets/images/visabridgeLogo.png new file mode 100644 index 0000000000..cdefd09fe3 Binary files /dev/null and b/src/assets/images/visabridgeLogo.png differ diff --git a/src/assets/images/whalesLogo.png b/src/assets/images/whalesLogo.png new file mode 100644 index 0000000000..82bcb93961 Binary files /dev/null and b/src/assets/images/whalesLogo.png differ diff --git a/src/assets/images/zaaviaLogo.png b/src/assets/images/zaaviaLogo.png new file mode 100644 index 0000000000..d5291fcf66 Binary files /dev/null and b/src/assets/images/zaaviaLogo.png differ diff --git a/src/components/ToggleSwitch/ToggleSwitch.js b/src/components/ToggleSwitch/ToggleSwitch.js index 72a46eb94d..afe3bf6541 100644 --- a/src/components/ToggleSwitch/ToggleSwitch.js +++ b/src/components/ToggleSwitch/ToggleSwitch.js @@ -3,7 +3,7 @@ import emoji from "react-easy-emoji"; import StyleContext from "../../contexts/StyleContext"; import "./ToggleSwitch.scss"; -const ToggleSwitch = () => { +const ToggleSwitch = ({handleMenuItemClick}) => { const {isDark} = useContext(StyleContext); const [isChecked, setChecked] = useState(isDark); const styleContext = useContext(StyleContext); @@ -16,6 +16,7 @@ const ToggleSwitch = () => { onChange={() => { styleContext.changeTheme(); setChecked(!isChecked); + handleMenuItemClick(); }} /> diff --git a/src/components/button/Button.scss b/src/components/button/Button.scss index e9058b69dd..007edce479 100644 --- a/src/components/button/Button.scss +++ b/src/components/button/Button.scss @@ -7,7 +7,7 @@ font-weight: 700; width: max-content; padding: 13px 22px; - margin-right: 50px; + margin-right: 20px; text-transform: uppercase; border-radius: 6px; text-align: center; diff --git a/src/components/header/Header.js b/src/components/header/Header.js index 6218f1950c..d623bb6bce 100644 --- a/src/components/header/Header.js +++ b/src/components/header/Header.js @@ -1,10 +1,105 @@ -import React, {useContext} from "react"; +// import React, {useContext} from "react"; +// import Headroom from "react-headroom"; +// import "./Header.scss"; +// import ToggleSwitch from "../ToggleSwitch/ToggleSwitch"; +// import StyleContext from "../../contexts/StyleContext"; +// import { +// greeting, +// workExperiences, +// skillsSection, +// openSource, +// blogSection, +// talkSection, +// achievementSection, +// resumeSection +// } from "../../portfolio"; + +// function Header() { +// const {isDark} = useContext(StyleContext); +// const viewExperience = workExperiences.display; +// const viewOpenSource = openSource.display; +// const viewSkills = skillsSection.display; +// const viewAchievement = achievementSection.display; +// const viewBlog = blogSection.display; +// const viewTalks = talkSection.display; +// const viewResume = resumeSection.display; + +// return ( +// +//
+// +// < +// {greeting.username} +// /> +// +// +// +//
    +// {viewSkills && ( +//
  • +// Skills +//
    • +// )} +// {viewExperience && ( +//
  • +// Work Experiences +//
    • +// )} +// {viewOpenSource && ( +//
  • +// Open Source +//
    • +// )} +// {/* {viewAchievement && ( +//
  • +// Achievements +//
    • +// )} +// {viewBlog && ( +//
  • +// Blogs +//
    • +// )} +// {viewTalks && ( +//
  • +// Talks extra +//
    • +// )} +// {viewResume && ( +//
  • +// Resume +//
    • +// )} */} +//
  • +// Contact Me +//
    • +//
  • +// {/* eslint-disable-next-line jsx-a11y/anchor-is-valid */} +// +// +// +//
    • +//
+//
+// +// ); +// } +// export default Header; + +import React, {useContext, useRef} from "react"; import Headroom from "react-headroom"; import "./Header.scss"; import ToggleSwitch from "../ToggleSwitch/ToggleSwitch"; import StyleContext from "../../contexts/StyleContext"; import { greeting, + educationInfo, workExperiences, skillsSection, openSource, @@ -23,6 +118,15 @@ function Header() { const viewBlog = blogSection.display; const viewTalks = talkSection.display; const viewResume = resumeSection.display; + const viewEducation = educationInfo.display; + + const menuCheckboxRef = useRef(null); + + const handleMenuItemClick = () => { + if (menuCheckboxRef.current) { + menuCheckboxRef.current.checked = false; + } + }; return ( @@ -32,7 +136,12 @@ function Header() { {greeting.username} /> - + ); } + export default Header; diff --git a/src/containers/Main.js b/src/containers/Main.js index 30701b2705..5c38d95723 100644 --- a/src/containers/Main.js +++ b/src/containers/Main.js @@ -57,14 +57,14 @@ const Main = () => { - + {/* */} - + {/* - + */} -