This fixes #49 social links

This commit is contained in:
dennis.ludwig
2021-06-29 14:17:48 +02:00
parent 29d9b9ef60
commit 8884ee3931
4 changed files with 120 additions and 97 deletions

View File

@@ -1,79 +1,107 @@
import React from "react";
import classNames from "classnames";
import {
FaFacebookF,
FaTwitter,
FaLinkedinIn,
FaXing,
FaYoutube,
FaGithub,
FaInstagram,
} from "react-icons/fa";
import "./footerend.scss";
export default function FooterEnd({ modifier }: { modifier?: "in-sidebar" }) {
return (
<div
className={classNames("footer-end", {
[`footer-end__${modifier}`]: modifier,
})}
>
<div className="footer-social">
<div className="footer-social__label">
<p>Follow us:</p>
</div>
<div className="footer-social__links">
<a
className="social-links-icon"
href="https://www.facebook.com/aoepeople"
target="_blank"
rel="noopener noreferrer"
>
<i className="socicon-facebook social-icon"></i>
</a>
<a
className="social-links-icon"
href="https://twitter.com/aoepeople"
target="_blank"
rel="noopener noreferrer"
>
<i className="socicon-twitter social-icon"></i>
</a>
<a
className="social-links-icon"
href="https://www.linkedin.com/company/aoe"
target="_blank"
rel="noopener noreferrer"
>
<i className="socicon-linkedin social-icon"></i>
</a>
<a
className="social-links-icon"
href="https://www.xing.com/company/aoe"
target="_blank"
rel="noopener noreferrer"
>
<i className="socicon-xing social-icon"></i>
</a>
<a
className="social-links-icon"
href="https://www.youtube.com/user/aoepeople"
target="_blank"
rel="noopener noreferrer"
>
<i className="socicon-youtube social-icon"></i>
</a>
<a
className="social-links-icon"
href="https://github.com/aoepeople"
target="_blank"
rel="noopener noreferrer"
>
<i className="socicon-github social-icon"></i>
</a>
</div>
interface Props {
modifier?: "in-sidebar";
}
const FooterEnd: React.FC<Props> = (modifier) => (
<div
className={classNames("footer-end", {
[`footer-end__${modifier}`]: modifier,
})}
>
<div className="footer-social">
<div className="footer-social__label">
<p>Follow us:</p>
</div>
<div className="footer-copyright">
<p>
<a
href="https://www.aoe.com/en/imprint.html"
target="_blank"
rel="noopener noreferrer"
>
Legal Information
</a>
</p>
<div className="footer-social__links">
<a
href="https://www.facebook.com/aoepeople"
target="_blank"
rel="noopener noreferrer"
className="social-icon-a"
>
<FaFacebookF className="social-icon" />
</a>
<a
href="https://twitter.com/aoepeople"
target="_blank"
rel="noopener noreferrer"
className="social-icon-a"
>
<FaTwitter className="social-icon" />
</a>
<a
href="https://www.linkedin.com/company/aoe"
target="_blank"
rel="noopener noreferrer"
className="social-icon-a"
>
<FaLinkedinIn className="social-icon" />
</a>
<a
href="https://www.xing.com/company/aoe"
target="_blank"
rel="noopener noreferrer"
className="social-icon-a"
>
<FaXing className="social-icon" />
</a>
<a
href="https://www.instagram.com/aoepeople"
target="_blank"
rel="noopener noreferrer"
className="social-icon-a"
>
<FaInstagram className="social-icon" />
</a>
<a
href="https://www.youtube.com/user/aoepeople"
target="_blank"
rel="noopener noreferrer"
className="social-icon-a"
>
<FaYoutube className="social-icon" />
</a>
<a
href="https://github.com/aoepeople"
target="_blank"
rel="noopener noreferrer"
className="social-icon-a"
>
<FaGithub className="social-icon" />
</a>
</div>
</div>
);
}
<div className="footer-copyright">
<p>
<a
href="https://www.aoe.com/en/imprint.html"
target="_blank"
rel="noopener noreferrer"
>
Legal Information
</a>
</p>
</div>
</div>
);
export default FooterEnd;