Clean up and component moving

src/components/Accordion/AccordionIcon.tsx

@@ -0,0 +1,36 @@
+import React from "react";
+import styled from "styled-components";
+import { colors } from "../../theme/colors";
+
+interface AccordionIconProps {
+  open: boolean;
+}
+
+const Icon = styled.div<AccordionIconProps>`
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  background-color: ${(p) => p.open ? colors.orange1 : colors.blue1};
+  color: ${colors.white};
+  min-width: 40px;
+  max-width: 40px;
+  min-height: 40px;
+  max-height: 40px;
+  margin: 0.2em;
+  font-size: 40px;
+
+  ${(p) => p.open && (`
+    span {
+      transform: rotate(45deg);
+    }
+  `)}
+
+`;
+
+const AccordionIcon: React.FC<AccordionIconProps> = ({ open } ) => (
+  <Icon open={open}>
+    <span>+</span>
+  </Icon>
+);
+
+export default AccordionIcon;

src/components/Accordion/index.ts

@@ -1,2 +0,0 @@
-import Accordion from "../Accordion";
-export default Accordion;

src/components/AccordionIcon/AccordionIcon.scss

@@ -1,29 +0,0 @@
-@import "../../assets/scss/globals";
-
-
-.accordion-icon {
-  display: flex;
-  background-color: color(blue1);
-  color: color(white1);
-  align-items: center;
-  justify-content: center;
-  min-width: 40px;
-  max-width: 40px;
-  min-height: 40px;
-  max-height: 40px;
-  margin: 0.2em;
-  font-size: 40px;
-
-  &.open {
-    background-color: color(orange1);
-  }
-}
-
-.accordion-text {
-  &.open {
-    -webkit-transform: rotate(45deg);
-    -moz-transform: rotate(45deg);
-    -o-transform: rotate(45deg);
-    transform: rotate(45deg);
-  }
-}

src/components/AccordionIcon/AccordionIcon.tsx

@@ -1,20 +0,0 @@
-import React from "react";
-import "./AccordionIcon.scss";
-
-export interface AccordionIconProps {
-  open: boolean;
-}
-export interface AccordionIconState {}
-
-class AccordionIcon extends React.Component<AccordionIconProps, AccordionIconState> {
-  render() {
-    const { open } = this.props;
-    return (
-      <div className={`accordion-icon ${open ? "open" : ""}`}>
-        <div className={`accordion-text ${open ? "open" : ""}`}>+</div>
-      </div>
-    );
-  }
-}
-
-export default AccordionIcon;

src/components/AccordionIcon/index.ts

@@ -1,2 +0,0 @@
-import AccordionIcon from "./AccordionIcon";
-export default AccordionIcon;

src/components/JsonLD/index.ts

@@ -1,2 +0,0 @@
-import JsonLD from "./JsonLD";
-export default JsonLD;

src/components/PageLink.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import styled from "styled-components";
-import TextAnchor from "../TextAnchor";
+import TextAnchor from "./TextAnchor";
 import { colors } from "@theme/colors";
 
 interface PageLinkProps {

src/components/PageLink/index.ts

@@ -1,2 +0,0 @@
-import PageLink from "./PageLink";
-export default PageLink;

src/components/index.tsx

@@ -8,4 +8,4 @@ export { default as CTASection } from "./Sections/CTASection";
 export { default as TextSection } from "./Sections/TextSection";
 export { default as FullWidthSection } from "./Sections/FullWidthSection";
 export { default as InfoBox } from "./InfoBox";
-export { default as Accordion } from "./Accordion";
+export { default as Accordion } from "./Accordion/Accordion";

src/views/CorporatePage/CorporatePageView.tsx

@@ -1,7 +1,6 @@
 import React from "react";
 import CorporatePageHero from "./CorporatePageHero";
-import PageLink from "@components/PageLink";
-import { CTASection, TextSection } from "@components/index";
+import { CTASection, TextSection, PageLink } from "@components/index";
 
 const CorporatePageView: React.FC = () => (
   <>

src/views/FreshmenPage/FreshmenPageView.tsx

@@ -1,9 +1,8 @@
 import React from "react";
 import styled from "styled-components";
 import FreshmenPageHero from "./FreshmenPageHero";
-import PageLink from "@components/PageLink";
 import Anchor from "@components/Anchor";
-import { CTASection, TextSection, InfoBox } from "@components/index";
+import { CTASection, TextSection, InfoBox, PageLink } from "@components/index";
 
 const KippariImage = styled.img`
   max-width:100%;

src/views/GuildPage/GuildPageView.tsx

@@ -1,9 +1,8 @@
 import React from "react";
 import styled from "styled-components";
-import PageLink from "@components/PageLink";
 import TextAnchor from "@components/TextAnchor";
 import Anchor from "@components/Anchor";
-import { CTASection, TextSection, InfoBox, Accordion } from "@components/index";
+import { CTASection, TextSection, InfoBox, Accordion, PageLink } from "@components/index";
 import GuildPageHero from "./GuildPageHero";
 import FullWidthSection from "@components/Sections/FullWidthSection";
 import { colors } from "@theme/colors";

src/views/StudiesPage/StudiesPageView.tsx

@@ -1,7 +1,5 @@
 import React from "react";
-import PageLink from "@components/PageLink";
-import Anchor from "@components/Anchor";
-import { CTASection, TextSection } from "@components/index";
+import { CTASection, TextSection, PageLink } from "@components/index";
 import StudiesPageHero from "./StudiesPageHero";
 
 const StudiesPageView: React.FC = () => (