Feature-Resume display and download (#698)

* Create ResumeDownloadButton.js * Updated github pages Updated github pages * Resume feature 1st version Missing adding feature to top bar * Style ran npm run format * Fixed UI to match the webpage Resume can now be accessed by the toolbar above and by the button in the greeting page. Fixed the title and subtitle arrangement. * Fixed format Fixed format * Update README.md with resume instructions * Updated resume feature Downloads resume after clicking button, Deleted resume container in website * Changed underlined font of bottun * [pre-commit.ci] auto fixes from pre-commit.com hooks for more information, see https://pre-commit.ci * Updated style to pass lint * Directly Download button --------- Co-authored-by: NMCBU1 <[email protected]> Co-authored-by: NMCBU1 <[email protected]> Co-authored-by: pre-commit-ci[bot] <66853113+pre-commit-ci[bot]@users.noreply.github.com>
saadpasta · Apr 28, 2024 · 1b69fbd · 1b69fbd
1 parent f16db7c
commit 1b69fbd
Show file tree

Hide file tree

Showing 6 changed files with 31 additions and 8 deletions.
diff --git a/README.md b/README.md
@@ -189,6 +189,8 @@ const contactInfo = { .... }
 const twitterDetails = { ... }
 
 ```
+#### Resume upload
+To upload your own resume, simply upload a pdf to `src/containers/resume` and rename the pdf to `resume.pdf`. 
 
 #### Using Emojis
 

diff --git a/src/components/header/Header.js b/src/components/header/Header.js
@@ -10,7 +10,8 @@ import {
  openSource,
  blogSection,
  talkSection,
- achievementSection
+ achievementSection,
+ resumeSection
 } from "../../portfolio";
 
 function Header() {
@@ -21,6 +22,7 @@ function Header() {
  const viewAchievement = achievementSection.display;
  const viewBlog = blogSection.display;
  const viewTalks = talkSection.display;
+ const viewResume = resumeSection.display;
 
  return (
  <Headroom>
@@ -69,6 +71,11 @@ function Header() {
  <a href="#talks">Talks</a>
  </li>
  )}
+ {viewResume && (
+ <li>
+ <a href="#resume">Resume</a>
+ </li>
+ )}
  <li>
  <a href="#contact">Contact Me</a>
  </li>

diff --git a/src/containers/greeting/Greeting.js b/src/containers/greeting/Greeting.js
@@ -6,7 +6,6 @@ import landingPerson from "../../assets/lottie/landingPerson";
 import DisplayLottie from "../../components/displayLottie/DisplayLottie";
 import SocialMedia from "../../components/socialMedia/SocialMedia";
 import Button from "../../components/button/Button";
-
 import {illustration, greeting} from "../../portfolio";
 import StyleContext from "../../contexts/StyleContext";
 
@@ -41,11 +40,13 @@ export default function Greeting() {
  <div className="button-greeting-div">
  <Button text="Contact me" href="#contact" />
  {greeting.resumeLink && (
- <Button
- text="See my resume"
- newTab={true}
- href={greeting.resumeLink}
- />
+ <a
+ href={require("./resume.pdf")}
+ download="Resume.pdf"
+ className="download-link-button"
+ >
+ <Button text="Download my resume" />
+ </a>
  )}
  </div>
  </div>

diff --git a/src/containers/greeting/Greeting.scss b/src/containers/greeting/Greeting.scss
@@ -33,6 +33,9 @@
  display: flex;
  margin-top: 20px;
 }
+.download-link-button {
+ text-decoration: none;
+}
 
 .greeting-text {
  font-size: 70px;

diff --git a/src/containers/greeting/resume.pdf b/src/containers/greeting/resume.pdf
diff --git a/src/portfolio.js b/src/portfolio.js
@@ -359,6 +359,15 @@ const podcastSection = {
  display: true // Set false to hide this section, defaults to true
 };
 
+// Resume Section
+const resumeSection = {
+ title: "Resume",
+ subtitle: "Feel free to download my resume",
+
+ // Please Provide with Your Podcast embeded Link
+ display: true // Set false to hide this section, defaults to true
+};
+
 const contactInfo = {
  title: emoji("Contact Me ☎️"),
  subtitle:
@@ -393,5 +402,6 @@ export {
  podcastSection,
  contactInfo,
  twitterDetails,
- isHireable
+ isHireable,
+ resumeSection
 };