work on modal formatting

index.html

@@ -47,12 +47,14 @@
 
             <!-- Modal content -->
             <div class="modal-content">
-                <span id='close_btn' class="close">&times;</span>
-                <p id='modal_text'>Some text in the Modal..</p>
+                <div style="display:inline-block; width: 100%;">
+                    <span id='close_btn' class="close">&times;</span>
+                    <div id='modal_text'>Some text in the Modal..</div>
 
-                <iframe id='modal-video' allow_embedding=true width="560" height="315" src="https://www.youtube.com/embed/vjsbZiBVFRM" 
-                frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; 
-                picture-in-picture" allowfullscreen></iframe>
+                    <iframe id='modal-video' allow_embedding=true width="40%" height="300px" src="https://www.youtube.com/embed/vjsbZiBVFRM" 
+                    frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; 
+                    picture-in-picture" allowfullscreen></iframe>
+                </div>
 
             </div>
             
@@ -179,7 +181,7 @@
                         }); // create virtual keyboard if touchscreen is detected
                     }
                 </script>
-                <iframe id='modal-video' allow_embedding=true width="560" height="315" src="https://www.youtube.com/embed/vjsbZiBVFRM" 
+                <iframe allow_embedding=true width="560" height="315" src="https://www.youtube.com/embed/vjsbZiBVFRM" 
                 frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; 
                 picture-in-picture" allowfullscreen></iframe>
             </div>

public/css/modal.css

@@ -21,6 +21,15 @@
     border: 1px solid #888;
     width: 80%;
   }
+  #modal_text{
+    width: 45%;
+    display:inline-block;
+  }
+  #modal-video{
+    float:right;
+    margin-left:20px;
+    display: inline-block
+  }
   
   /* The Close Button */
   .close {

public/js/modal.js

@@ -25,7 +25,10 @@ function open_modal() {
 function set_modal_text(url, description, title, video_url) {
     var text_obj = document.getElementById('modal_text');
     var video_obj = document.getElementById('modal-video');
-    text_obj.innerText = title;
+
+    text_obj.innerHTML = "<strong>" + title + "</strong>";
+    text_obj.innerHTML += "<br><br>";
+    text_obj.innerHTML += description;
 
     if (video_url == ""){
         video_obj.style.display = "none";