v0.11.5 Modify download resume to proper link

This commit is contained in:
Murtadha 2024-07-27 17:44:03 -04:00
parent b940636f0f
commit 24d0138e12
3 changed files with 60 additions and 57 deletions

View file

@ -2,7 +2,7 @@ import React from "react";
import styles from "./AboutMe.module.css"; import styles from "./AboutMe.module.css";
import { FaGithub, FaLinkedin, FaTwitter } from "react-icons/fa"; import { FaGithub, FaLinkedin, FaTwitter } from "react-icons/fa";
function AboutMe({data}) { function AboutMe({ data }) {
const scrollToContact = () => { const scrollToContact = () => {
const contactSection = document.getElementById("contact"); const contactSection = document.getElementById("contact");
if (contactSection) { if (contactSection) {
@ -17,52 +17,54 @@ function AboutMe({data}) {
<div className={styles.container}> <div className={styles.container}>
<h2 className={styles.title}>About Me</h2> <h2 className={styles.title}>About Me</h2>
<div className={styles.content}> <div className={styles.content}>
<div className={styles.imageContainer}> <div className={styles.imageContainer}>
<img src={personalInfo.pp} alt="Murtadha Nisyif" className={styles.image} /> <img src={personalInfo.pp} alt="Murtadha Nisyif" className={styles.image} />
<div className={styles.socialLinks}> <div className={styles.socialLinks}>
{personalInfo.socials && personalInfo.socials.map((social, index) => { {personalInfo.socials &&
const platform = Object.keys(social)[0]; personalInfo.socials.map((social, index) => {
const url = social[platform]; const platform = Object.keys(social)[0];
const url = social[platform];
let IconComponent; let IconComponent;
switch (platform) { switch (platform) {
case 'github': case "github":
IconComponent = FaGithub; IconComponent = FaGithub;
break; break;
case 'linkedin': case "linkedin":
IconComponent = FaLinkedin; IconComponent = FaLinkedin;
break; break;
case 'twitter': case "twitter":
IconComponent = FaTwitter; IconComponent = FaTwitter;
break; break;
default: default:
return null; return null;
} }
return ( return (
<a key={index} href={url} target="_blank" rel="noopener noreferrer" className={styles.socialLink}> <a key={index} href={url} target="_blank" rel="noopener noreferrer" className={styles.socialLink}>
<IconComponent /> <IconComponent />
</a> </a>
); );
})} })}
</div> </div>
</div> </div>
<div className={styles.textContent}> <div className={styles.textContent}>
<h3 className={styles.greeting}> <h3 className={styles.greeting}>
Hey there! I'm <span className={styles.name}>{personalInfo.name}</span> Hey there! I'm <span className={styles.name}>{personalInfo.name}</span>
</h3> </h3>
<p className={styles.bio}> <p className={styles.bio}>{personalInfo.about_me}</p>
{personalInfo.about_me} <div className={styles.interests}>
</p> {personalInfo.interests &&
<div className={styles.interests}> personalInfo.interests.map((interest, index) => (
{personalInfo.interests && personalInfo.interests.map((interest, index) => ( <span key={index} className={styles.interestTag}>
<span key={index} className={styles.interestTag}>{interest}</span> {interest}
))} </span>
</div> ))}
</div> </div>
</div>
</div> </div>
<div className={styles.bottomSection}> <div className={styles.bottomSection}>
<a href={personalInfo.resumeLink} target="_blank" rel="noopener noreferrer" className={styles.resumeLink}> <a href={personalInfo.resumelink} target="_blank" rel="noopener noreferrer" className={styles.resumeLink}>
Download Resume (PDF) Download Resume (PDF)
</a> </a>
<button onClick={scrollToContact} className={styles.contactLink}> <button onClick={scrollToContact} className={styles.contactLink}>
@ -72,6 +74,6 @@ function AboutMe({data}) {
</div> </div>
</section> </section>
); );
}; }
export default AboutMe; export default AboutMe;

View file

@ -2,7 +2,7 @@ import React, { useEffect, useRef, useState } from "react";
import styles from "./Footer.module.css"; import styles from "./Footer.module.css";
import logo from "/assets/logos/logo.png"; import logo from "/assets/logos/logo.png";
function Footer({data}) { function Footer({ data }) {
const [isVisible, setIsVisible] = useState(false); const [isVisible, setIsVisible] = useState(false);
const footerRef = useRef(null); const footerRef = useRef(null);
@ -29,7 +29,7 @@ function Footer({data}) {
}; };
}, []); }, []);
const personalInfo = data.length ? data[0] : {}; const personalInfo = data.length ? data[0] : {};
return ( return (
<footer ref={footerRef} className={`${styles.footer} ${isVisible ? styles.visible : ""}`}> <footer ref={footerRef} className={`${styles.footer} ${isVisible ? styles.visible : ""}`}>
@ -44,19 +44,20 @@ function Footer({data}) {
<p>Phone: {personalInfo.number}</p> <p>Phone: {personalInfo.number}</p>
</div> </div>
<div className={styles.social}> <div className={styles.social}>
<h3>Social</h3> <h3>Social</h3>
{personalInfo.socials && personalInfo.socials.map((social, index) => { {personalInfo.socials &&
const platform = Object.keys(social)[0]; personalInfo.socials.map((social, index) => {
return ( const platform = Object.keys(social)[0];
<a key={index} href={social[platform]} target="_blank" rel="noopener noreferrer"> return (
{platform.charAt(0).toUpperCase() + platform.slice(1)} <a key={index} href={social[platform]} target="_blank" rel="noopener noreferrer">
</a> {platform.charAt(0).toUpperCase() + platform.slice(1)}
); </a>
})} );
</div> })}
</div>
</div> </div>
<div className={styles.bottomSection}> <div className={styles.bottomSection}>
<a href={personalInfo.resumeLink} target="_blank" rel="noopener noreferrer" className={styles.resumeLink}> <a href={personalInfo.resumelink} target="_blank" rel="noopener noreferrer" className={styles.resumeLink}>
Download Resume (PDF) Download Resume (PDF)
</a> </a>
</div> </div>

View file

@ -1 +1 @@
0.11.4 0.11.5