2022-05-20 00:03:42 -07:00

99 lines
2.3 KiB
JavaScript

import React from "react";
import classnames from "classnames";
const getNavClasses = (isClient) =>
classnames(
"hover:underline mx-2 md:mx-3",
isClient ? "text-vibrant-light" : "text-gray-200"
);
const Nav = ({ imageIsLandscape, isClient }) => (
<nav
className={classnames(
// imageIsLandscape
// ? "landscape:w-screen portrait:rounded-3xl portrait:m-2"
// : "portrait:w-screen landscape:rounded-3xl landscape:m-2",
"rounded-3xl m-2",
"p-2 flex justify-center",
isClient && "bg-vibrant-dark cool-border-small-light"
)}
style={{ zIndex: 100 }}
>
<ul className="inline-flex flex-wrap justify-center">
<li>
<a
className={getNavClasses(isClient)}
href="/CharlesDriesResumeCurrent.pdf"
onClick={() => {
try {
window.plausible("Resume Click");
} catch {
// do nothing
}
}}
>
Resume
</a>
</li>
<li>
<a
className={getNavClasses(isClient)}
href="https://twitter.com/chuckletmilk"
>
Twitter
</a>
</li>
<li>
<a
className={getNavClasses(isClient)}
href="https://www.instagram.com/asubtlebutdeliciouscoffeecake/"
>
Instagram
</a>
</li>
<li>
<a
className={getNavClasses(isClient)}
href="https://github.com/chuckdries"
>
Github
</a>
</li>
<li>
<a
className={getNavClasses(isClient)}
href="https://www.linkedin.com/in/chuckdries/"
>
LinkedIn
</a>
</li>
<li>
<a
className={getNavClasses(isClient)}
href="https://medium.com/@chuckdries"
>
Medium
</a>
</li>
<li>
<a
className={getNavClasses(isClient)}
href="https://www.youtube.com/channel/UCknR_DdytuOgzus--b2gZhg"
>
YouTube
</a>
</li>
<li>
<a
className={getNavClasses(isClient)}
href="mailto:chuck@chuckdries.com"
>
chuck@chuckdries.com
</a>
</li>
</ul>
</nav>
);
export default Nav;