aboutsummaryrefslogtreecommitdiffstats
path: root/src/components/Widget/SocialMedia/SocialMedia.tsx
diff options
context:
space:
mode:
authorArmand Philippot <git@armandphilippot.com>2022-01-15 22:45:57 +0100
committerArmand Philippot <git@armandphilippot.com>2022-01-15 22:51:30 +0100
commitaa1ca65e7c9807c6d6020e39166536297fe1cdae (patch)
tree2648da350fec3b71ab7f575d63e4c63ba08248b1 /src/components/Widget/SocialMedia/SocialMedia.tsx
parent16dbb4742264edac82fa6bb8e461259d097f4437 (diff)
chore: update sidebar and widgets styles
I'm now using a widget that can be expanded/collapsed. It also allows me to handle more effectively widgets overflow and to avoid styles repetitions. However, with stylelint rule "no-descending-specificity", I'm not sure if the stylesheets are really logical... Maybe I should deactivate this rule.
Diffstat (limited to 'src/components/Widget/SocialMedia/SocialMedia.tsx')
-rw-r--r--src/components/Widget/SocialMedia/SocialMedia.tsx72
1 files changed, 0 insertions, 72 deletions
diff --git a/src/components/Widget/SocialMedia/SocialMedia.tsx b/src/components/Widget/SocialMedia/SocialMedia.tsx
deleted file mode 100644
index 9ca0627..0000000
--- a/src/components/Widget/SocialMedia/SocialMedia.tsx
+++ /dev/null
@@ -1,72 +0,0 @@
-import { socialWebsites } from '@config/social-media';
-import GithubIcon from '@assets/images/social-media/github.svg';
-import GitlabIcon from '@assets/images/social-media/gitlab.svg';
-import LinkedInIcon from '@assets/images/social-media/linkedin.svg';
-import TwitterIcon from '@assets/images/social-media/twitter.svg';
-import styles from './SocialMedia.module.scss';
-
-const SocialMedia = ({
- title,
- github = false,
- gitlab = false,
- linkedin = false,
- twitter = false,
-}: {
- title: string;
- github?: boolean;
- gitlab?: boolean;
- linkedin?: boolean;
- twitter?: boolean;
-}) => {
- const getIcon = (id: string) => {
- switch (id) {
- case 'github':
- return <GithubIcon />;
- case 'gitlab':
- return <GitlabIcon />;
- case 'linkedin':
- return <LinkedInIcon />;
- case 'twitter':
- return <TwitterIcon />;
- default:
- break;
- }
- };
-
- const shouldDisplayLink = (id: string) => {
- switch (id) {
- case 'github':
- return github;
- case 'gitlab':
- return gitlab;
- case 'linkedin':
- return linkedin;
- case 'twitter':
- return twitter;
- default:
- break;
- }
- };
-
- const items = socialWebsites.map((website) => {
- return shouldDisplayLink(website.id) ? (
- <li key={website.id}>
- <a href={website.url} className={styles.link}>
- {getIcon(website.id)}
- <span className="screen-reader-text">{website.name}</span>
- </a>
- </li>
- ) : (
- ''
- );
- });
-
- return (
- <div>
- <h2>{title}</h2>
- <ul className={styles.list}>{items}</ul>
- </div>
- );
-};
-
-export default SocialMedia;