add button chat

TugasBesar2_2017/WebApp/src/main/webapp/chat_driver.jsp

@@ -31,9 +31,12 @@
         </div>
         <div class="chat-box">
             <div class="chat-box-control">
+                <form action="#" class="chat-input" method="POST" onsubmit="#">
+                    <input type="text" class="text-input" name="location">
+                    <button type="submit" class="send-button"> Kirim </button>
+                </form>
             </div>
         </div>
-
     </div>
 </div>
 

TugasBesar2_2017/WebApp/src/main/webapp/css/app.css

@@ -751,18 +751,50 @@ h3{
 }
 
 .chat-box {
-	display: inline-block;
+	display: flex;
 	width: 100%;
 	border: 1px solid black;
-	height: 40vh;
+	height: 50vh;
 	position: relative;
+	align-items: flex-end;
 }
 
 .chat-box-control {
-	display: inline-block;
+	display: flex;
 	width: 100%;
 	border-top: 1px solid black;
-	height: 5vh;
+	height: 8vh;
 	position: relative;
-	bottom: 0%;
+	align-items: stretch;
+}
+
+.chat-input {
+	flex-grow: 1;
+	display: flex;
+	margin-bottom: 5px;
+	justify-content: right;
+	align-items: center;
 }
+
+.text-input {
+	height: 7vh;
+	border: none;
+	border-color: transparent;
+	outline: none;
+	width: 100%;
+	flex-grow: 1;
+	margin-left: 5px;
+	margin-right: 5px;
+	font-size: 12px;
+}
+
+.send-button {
+	width: 100px;
+	height: 40px;
+	border: 1px solid #00782d;
+	border-radius: 8px;
+	background: #57e500;
+	font-size: 1.25em;
+	margin-left: 5px;
+	margin-right: 5px;
+}
\ No newline at end of file