ui fixes

views/header.ejs

@@ -1,5 +1,5 @@
 <style>
-    header{
+    #proj_top_panel{
         display: flex;
         /* width: 90%; */
         justify-content: space-between;
@@ -8,11 +8,11 @@
         margin: auto;
     }
     #top_panel_right{
-        float: right;
+        /* float: right; */
         display: flex;
     }
     #top_panel_left{
-        float: left;
+        /* float: left; */
         display: flex;
     }
     /* button{
@@ -36,8 +36,10 @@
     });
     </script>
     <!-- <div id="user_name"></div> -->
-    <div id="top_panel_left"></div>
-    <div>puzzle</div>
-    <div id="top_panel_right"></div>
+    <div id="proj_top_panel">
+        <div id="top_panel_left"></div>
+        <!-- <div>puzzle</div> -->
+        <div id="top_panel_right"></div>
+    </div>
     <!-- <div><button onclick="logout();">logout</button></div> -->
 </header>

views/project.ejs

@@ -38,13 +38,27 @@
         border-color: #fff;
         border-style: solid;
     }
+
+    #proj_top{
+        margin: auto;
+        width: 90%;
+        display: flex;
+        justify-content: space-around;
+    }
+    #proj_name{
+        background-color: #aaa;
+        border: 0px;
+        text-align: center;
+    }
 </style>
 
 <%- include('./static/start.ejs',{name:proj_name,async: true}) %>
 <%- include('./header.ejs') %>
 <script src="/lib/interact.min.js"></script>
 
-<input id="proj_name"></input>
+<div id="proj_top">
+    <input id="proj_name"></input>
+</div>
 <div id="drags"></div>
 
 <div class="dropzone"></div>