diff --git a/.vscode/settings.json b/.vscode/settings.json
new file mode 100644
index 0000000..485a010
--- /dev/null
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+  "cSpell.words": ["flexslider", "socialimage", "socialimages"]
+}
diff --git a/TODO.md b/TODO.md
index ba9e835..a8bbeb1 100644
--- a/TODO.md
+++ b/TODO.md
@@ -23,4 +23,4 @@
 - maybe transition to markdown loader?
 - add language switcher + download for both
 - add highlight to "languages I like"
-- tech turns red when hovered over link
+- tech turns red when hovered over link (need to hover on text too)
diff --git a/src/components/info-pill.tsx b/src/components/info-pill.tsx
index 87cb2da..e5f0540 100644
--- a/src/components/info-pill.tsx
+++ b/src/components/info-pill.tsx
@@ -1,5 +1,4 @@
-import React from "react";
-import { FunctionComponent } from "react";
+import React, { FunctionComponent } from "react";
 
 type Props = { title: string; value: string; link: string; rest?: {} };
 
diff --git a/src/components/section-title.tsx b/src/components/section-title.tsx
index b28d860..5fa26e4 100644
--- a/src/components/section-title.tsx
+++ b/src/components/section-title.tsx
@@ -1,7 +1,7 @@
-import React from "react";
+import React, { ReactNode } from "react";
 import { FunctionComponent } from "react";
 
-type Props = {};
+type Props = { children: ReactNode };
 
 export const SectionTitle: FunctionComponent<Props> = ({ children }) => {
   return (
diff --git a/src/components/section.tsx b/src/components/section.tsx
index bb388f2..343f1eb 100644
--- a/src/components/section.tsx
+++ b/src/components/section.tsx
@@ -1,7 +1,8 @@
 import React, { FunctionComponent } from "react";
+import { ReactNode } from "react";
 import { SectionTitle } from "./section-title";
 
-type Props = { title: string };
+type Props = { title: string; children: ReactNode };
 
 export const Section: FunctionComponent<Props> = ({ title, children }) => {
   return (
diff --git a/src/constants/colors.js b/src/constants/colors.ts
similarity index 100%
rename from src/constants/colors.js
rename to src/constants/colors.ts
diff --git a/src/constants/disqus.js b/src/constants/disqus.ts
similarity index 100%
rename from src/constants/disqus.js
rename to src/constants/disqus.ts
diff --git a/src/constants/routes.js b/src/constants/routes.ts
similarity index 100%
rename from src/constants/routes.js
rename to src/constants/routes.ts
diff --git a/src/layout/layout.tsx b/src/layout/layout.tsx
index 4bebf69..3f9df4f 100644
--- a/src/layout/layout.tsx
+++ b/src/layout/layout.tsx
@@ -1,13 +1,14 @@
-import React, { FunctionComponent } from "react";
-import PropTypes from "prop-types";
+import React, { FunctionComponent, ReactNode } from "react";
 // import CookieConsent from "react-cookie-consent";
 // import { Link } from "gatsby"
 import "./../styles/style.scss";
-import { ProfilePicture } from "./profile-pic";
-import { NavBar } from "./navigation/navbar";
 import { Footer } from "./footer";
+import { NavBar } from "./navigation/navbar";
+import { ProfilePicture } from "./profile-pic";
 
-export const Layout: FunctionComponent<{}> = ({ children }) => {
+type Props = { children: ReactNode[] };
+
+export const Layout: FunctionComponent<Props> = ({ children }) => {
   return (
     <div className="body-red">
       <div className="main-content">
@@ -51,7 +52,3 @@ export const Layout: FunctionComponent<{}> = ({ children }) => {
     </div>
   );
 };
-
-Layout.propTypes = {
-  children: PropTypes.node.isRequired,
-};