Remove SASS from components

2020-12-01 23:13:22 +02:00
parent 03d726ee9c
commit e7ce4b64aa
45 changed files with 701 additions and 806 deletions
@@ -0,0 +1,45 @@
+import React from "react";
+import styled from "styled-components";
+import { colors } from "@theme/colors";
+import NavbarDropdownLink from "./NavbarDropdownLink";
+import NavbarChildLink from "./NavbarChildLink";
+
+const renderNavigationMobileItems = () => {
+  return (
+    <>
+      <NavbarDropdownLink to="/kilta" text="Kilta ›" exploded>
+        <NavbarChildLink to="/kilta/toiminta">Toiminta</NavbarChildLink>
+        <NavbarChildLink to="/kilta/fuksi">Fuksi</NavbarChildLink>
+        <NavbarChildLink to="https://static.sika.sik.party">Arkisto</NavbarChildLink>
+      </NavbarDropdownLink>
+      <NavbarDropdownLink to="/opinnot_ja_ura" text="Opinnot ja ura" exploded />
+      <NavbarDropdownLink to="/yritysyhteistyo" text="Yritysyhteistyö" exploded />
+      <NavbarDropdownLink to="/yhteystiedot" text="Yhteystiedot" exploded>
+        {/* <NavbarChildLink to="https://en.wikipedia.org/wiki/Gay">Simo Höglund</NavbarChildLink> */}
+      </NavbarDropdownLink>
+      <NavbarDropdownLink to="/in_english" text="In English" exploded />
+    </>
+  );
+}
+
+const Nav = styled.nav`
+  padding: 1rem 2rem;
+
+  a {
+    fill: ${colors.lightBlue};
+    color: ${colors.lightBlue};
+    text-decoration: none;
+  }
+`;
+
+interface NavigationMobileProps {
+  isOpen?: boolean;
+}
+
+const NavigationMobile: React.FC<NavigationMobileProps> = ({ isOpen }) => (
+  <Nav hidden={isOpen}>
+    {renderNavigationMobileItems()}
+  </Nav>
+)
+
+export default NavigationMobile;