From 8cdd9659b3be9de46b2aabdf4b86a884444a05f1 Mon Sep 17 00:00:00 2001
From: Camerin Figueroa <figueroa0609@protonmail.com>
Date: Mon, 20 Sep 2021 16:44:52 -0400
Subject: [PATCH] Fixed Bug where p tags had descendents

---
 src/components/Home.js         |  4 ++--
 src/components/Theater.js      |  4 ++--
 src/components/css/Theater.css | 11 ++++++++++-
 3 files changed, 14 insertions(+), 5 deletions(-)

diff --git a/src/components/Home.js b/src/components/Home.js
index d45ccd9..a418290 100644
--- a/src/components/Home.js
+++ b/src/components/Home.js
@@ -6,12 +6,12 @@ const Home = (props) => {
   document.title = "Welcome to my Portfolio";
   const title = "Welcome to my Portfolio";
   const description = 
-    <p>
+    <div>
       This website helps you access the projects that I've worked on. You can navigate
       at the top to different locations in the site. Within you can find information about me,
       my github repositories, and some youtube videos I've posted. This website is coded with
       React/Redux and hosted over Vercel. You can email me at <a href="mailto:camerin@camsprojects.online">camerin@camsprojects.online</a>.
-    </p>;
+    </div>;
 
   return (
     <div className="Home">
diff --git a/src/components/Theater.js b/src/components/Theater.js
index d38f791..a4e16fe 100644
--- a/src/components/Theater.js
+++ b/src/components/Theater.js
@@ -8,9 +8,9 @@ const Theater = (props) => {
             <div className="theater-bg" style={props.background ? {backgroundImage: `url(${props.background})`} : {}}/>
             <div className="theater-content">
                 <h1>{props.title}</h1>
-                <p>
+                <div className="description">
                     {props.description}
-                </p>
+                </div>
             </div>
         </div>
         
diff --git a/src/components/css/Theater.css b/src/components/css/Theater.css
index 1fb8603..35660b9 100644
--- a/src/components/css/Theater.css
+++ b/src/components/css/Theater.css
@@ -43,10 +43,19 @@
     align-items: center;
 }
 
-.theater-content p,h1 {
+.theater-content .description, .theater-content h1 {
     width: 50vw;
 }
+.theater-content .description {
+    padding: 10px;
+}
 
 .theater-content a {
     color: #CFCFBA !important;
+}
+
+@media only screen and (max-width: 600px) {
+    .theater-content .description {
+        width: 80vw;
+    }
 }
\ No newline at end of file