diff --git a/changelog-app-ui/src/App.jsx b/changelog-app-ui/src/App.jsx
index 7862980..8a0ec1f 100644
--- a/changelog-app-ui/src/App.jsx
+++ b/changelog-app-ui/src/App.jsx
@@ -1,20 +1,25 @@
 //import "./App.css";
 import { useState } from "react";
 import Feed from "./components/feed";
+import ChangeLogInput from "./components/changeLogInput";
 
 function App() {
   const [feed, setFeed] = useState(tempData);
+  const [logInput, setLogInput] = useState("");
+
   return (
     <>
+      <ChangeLogInput
+        setLogInput={setLogInput}
+        logInput={logInput}
+        feed={feed}
+        setFeed={setFeed}
+      />
       <Feed entries={feed} />
     </>
   );
 }
 
-//body={item.body}
-//topics={item.topics}
-//date={item.date}
-
 const tempData = [
   {
     body: "Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec vitae nibh velit. Vivamus maximus elit et eleifend hendrerit. Praesent ac metus eget risus accumsan finibus. Cras tempor dignissim dolor, ut tempus tortor interdum non. Sed sit amet fringilla turpis. Sed congue feugiat orci, vel iaculis libero venenatis eu.",
diff --git a/changelog-app-ui/src/components/changeLogInput.jsx b/changelog-app-ui/src/components/changeLogInput.jsx
new file mode 100644
index 0000000..bb05f2d
--- /dev/null
+++ b/changelog-app-ui/src/components/changeLogInput.jsx
@@ -0,0 +1,39 @@
+import PropTypes from "prop-types";
+import styles from "./changeLogInput.module.css";
+
+const ChangeLogInput = (props) => {
+  const handleClick = (e) => {
+    const newEntry = {
+      body: props.logInput,
+      topics: ["test"],
+      date: new Date().toLocaleDateString(),
+      id: crypto.randomUUID(),
+    };
+
+    props.setFeed([newEntry, ...props.feed]);
+    props.setLogInput("");
+  };
+  return (
+    <div className={styles.container}>
+      <textarea
+        rows="1"
+        placeholder="What did you change..."
+        className={styles.input}
+        onChange={(e) => props.setLogInput(e.target.value)}
+        value={props.logInput}
+      />
+      <button onClick={handleClick} className={styles.btn}>
+        Submit
+      </button>
+    </div>
+  );
+};
+
+ChangeLogInput.propTypes = {
+  setLogInput: PropTypes.func,
+  logInput: PropTypes.string,
+  feed: PropTypes.array,
+  setFeed: PropTypes.func,
+};
+
+export default ChangeLogInput;
diff --git a/changelog-app-ui/src/components/changeLogInput.module.css b/changelog-app-ui/src/components/changeLogInput.module.css
new file mode 100644
index 0000000..2283439
--- /dev/null
+++ b/changelog-app-ui/src/components/changeLogInput.module.css
@@ -0,0 +1,45 @@
+.container {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  flex-wrap: wrap;
+}
+
+.input {
+  outline: 1px solid black;
+  width: 100%;
+}
+
+.btn {
+  width: 25%;
+}
+
+/*.inputSizer {*/
+/*  display: inline-grid;*/
+/*  vertical-align: top;*/
+/*  align-items: center;*/
+/*  position: relative;*/
+/**/
+/*  &.stacked {*/
+/*    align-items: stretch;*/
+/**/
+/*    &::after,*/
+/*    textarea {*/
+/*      grid-area: 2 / 1;*/
+/*    }*/
+/*  }*/
+/*  &::after,*/
+/*  textarea {*/
+/*    width: auto;*/
+/*    grid-area: 1 / 2;*/
+/*    resize: none;*/
+/*    background: none;*/
+/*    appearance: none;*/
+/*    border: none;*/
+/*  }*/
+/*  &::after {*/
+/*    content: attr(data-value) " ";*/
+/*    visibility: hidden;*/
+/*    white-space: pre-wrap;*/
+/*  }*/
+/*}*/
diff --git a/changelog-app-ui/src/components/feed.module.css b/changelog-app-ui/src/components/feed.module.css
index 9a713f8..17c898b 100644
--- a/changelog-app-ui/src/components/feed.module.css
+++ b/changelog-app-ui/src/components/feed.module.css
@@ -12,6 +12,7 @@
   display: flex;
   flex-direction: column;
   flex: 0 1 60%;
+  width: 100%;
 }
 
 .cardBottom {
diff --git a/changelog-app-ui/src/index.css b/changelog-app-ui/src/index.css
index a0e089a..fa06962 100644
--- a/changelog-app-ui/src/index.css
+++ b/changelog-app-ui/src/index.css
@@ -21,26 +21,7 @@ body {
   /*min-height: 100vh;*/
 }
 
-h1 {
-  font-size: 3.2em;
-  line-height: 1.1;
-}
-
-button {
-  border-radius: 8px;
-  border: 1px solid transparent;
-  padding: 0.6em 1.2em;
-  font-size: 1em;
-  font-weight: 500;
-  font-family: inherit;
-  background-color: #1a1a1a;
-  cursor: pointer;
-  transition: border-color 0.25s;
-}
-button:hover {
-  border-color: #646cff;
-}
-button:focus,
-button:focus-visible {
-  outline: 4px auto -webkit-focus-ring-color;
-}
+/*h1 {*/
+/*  font-size: 3.2em;*/
+/*  line-height: 1.1;*/
+/*}*/