Fix remaining CSS issues

css/style.css

@@ -4,15 +4,11 @@
 }
 
 #app-navigation {
-	min-width: 20em;
 	box-sizing: border-box;
 	border-left: 1px solid #ddd;
 	border-right: 1px solid #ddd;
-	resize: horizontal;
-	position: relative;
+	overflow-x: auto;
 	flex: 1;
-	top: 0;
-	height: 100vh;
 }
 /* Navigation: folder like structure */
 #app-mailbox-peers {
@@ -62,13 +58,6 @@
 	text-align: center;
 }
 
-#app-conversation {
-	height: 100vh;
-	overflow-y: auto;
-	flex: 5;
-	flex-direction: column;
-}
-
 #app-content-wrapper {
 	padding: 15px;
 	min-width: auto !important;

js/devel/conversation.js

@@ -9,7 +9,7 @@
  */
 
 var Conversation = new Vue({
-	el: '#app-conversation',
+	el: '#app-content',
 	data: {
 		selectedContact: {},
 		isConvLoading: false,
@@ -54,7 +54,7 @@ var Conversation = new Vue({
 					self.totalMessageCount = jsondata['msgCount'] !== undefined ? jsondata['msgCount'] : 0;
 					self.isConvLoading = false;
 
-					$('#app-conversation').scrollTop(1E10);
+					$('#app-content').scrollTop(1E10);
 
 					// If refreshInterval is already bound, clear previous
 					if (self.refreshIntervalId !== null) {
@@ -76,7 +76,7 @@ var Conversation = new Vue({
 					var fmt = self.formatConversation(jsondata);
 					var conversationBuf = fmt[1];
 					if (conversationBuf === true) {
-						$('#app-conversation').scrollTop(1E10);
+						$('#app-content').scrollTop(1E10);
 						// This will blink the tab because there is new messages
 						if (document.hasFocus() === false) {
 							Sms.unreadCountCurrentConv += parseInt(fmt[0]);

templates/main.php

@@ -106,7 +106,7 @@ use \OCA\OcSms\Lib\CountryCodes;
         </div>
 	</div>
 
-	<div id="app-conversation">
+	<div id="app-content">
 		<div id="app-content-loader" class="icon-loading" v-if="isConvLoading"></div>
 		<div id="app-content-header" v-if="!isConvLoading && messages.length > 0" v-bind:style="{backgroundColor: getContactColor(selectedContact.uid) }">
 			<div id="ocsms-contact-avatar">