chatview: add navbar div for qt client

Change-Id: I45021d98a81a8edb1a25a61e08ba95db8a35d4fd

src/web-chatview/chatview-gnome.css

@@ -31,60 +31,3 @@
     word-break: break-word;
     word-wrap: break-word;
 }
-
-.nav-right {
-  align-self: flex-end;
-}
-
-.nav-left {
-  align-self: flex-start;
-}
-
-#nav-contactid {
-  margin: 0px;
-  margin-left: 5px;
-  padding: 0px;
-  height: 100%;
-  font-family: emoji;
-
-  /* enable selection (it is globally disabled in the body) */
-  -webkit-user-select: auto;
-
-  /* contactid field should take as much place as possible, but it should
-     also be the first one to shrink if necesary. */
-  flex-grow: 2;
-  flex-shrink: 2;
-  min-width: 0; /* necessary for child to be able to shrink correctly */
-
-  /* center vertically */
-  display: flex;
-  align-items: center;
-}
-
-#nav-contactid-wrapper {
-  width: 100%;
-}
-
-#nav-contactid-alias {
-  font-size: 14px;
-  font-weight: bold;
-  margin-bottom: 3px;
-
-  width: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-#nav-contactid-bestId {
-  font-size: 11px;
-
-  width: 100%;
-  white-space: nowrap;
-  overflow: hidden;
-  text-overflow: ellipsis;
-}
-
-.oneEntry #nav-contactid-bestId {
-  display: none;
-}

src/web-chatview/chatview-windows.css

@@ -30,8 +30,31 @@
     --hairline-thickness: 2px;
 }
 
+body {
+    font-family: sans-serif;
+}
+
+#container {
+    max-width: 1000px;
+    margin: auto;
+}
+
+.nav-right {
+    float: right;
+}
+/* classic screens */
+@media screen and (max-width: 1920px), screen and (max-height: 1080px) {
+    .message_in {
+        padding-left: 0px;
+    }
+
+    .message_out {
+        padding-right: 0px;
+    }
+}
+
 #invite_contact_name {
-    font-weight: 500;
+    font-weight: 700;
 }
 
 .internal_mes_wrapper {
@@ -202,3 +225,24 @@ pre {
     border-radius: 16px;
     cursor: auto;
 }
+
+#sendMessage {
+    padding: 7px;
+}
+
+#message {
+    margin: 0 16px 2px 16px;
+}
+
+#nav-contactid-alias {
+    font-weight: 500;
+    font-size: 1em;
+    font-family: 'Segoe UI Emoji';
+}
+
+#nav-contactid-bestId {
+    font-weight: 100;
+    font-size: .7em;
+    font-family: Verdana;
+    color: #c0c0c0;
+}
\ No newline at end of file

src/web-chatview/chatview.css

@@ -1155,3 +1155,55 @@ video {
       width: 200px;
   }
 }
+
+.nav-right {
+    align-self: flex-end;
+}
+
+.nav-left {
+    align-self: flex-start;
+}
+
+#nav-contactid {
+    margin: 0px;
+    margin-left: 5px;
+    padding: 0px;
+    height: 100%;
+    font-family: emoji;
+    /* enable selection (it is globally disabled in the body) */
+    -webkit-user-select: auto;
+    /* contactid field should take as much place as possible, but it should
+     also be the first one to shrink if necesary. */
+    flex-grow: 2;
+    flex-shrink: 2;
+    min-width: 0; /* necessary for child to be able to shrink correctly */
+    /* center vertically */
+    display: flex;
+    align-items: center;
+}
+
+#nav-contactid-wrapper {
+    width: 100%;
+}
+
+#nav-contactid-alias {
+    font-size: 14px;
+    font-weight: bold;
+    margin-bottom: 3px;
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+#nav-contactid-bestId {
+    font-size: 11px;
+    width: 100%;
+    white-space: nowrap;
+    overflow: hidden;
+    text-overflow: ellipsis;
+}
+
+.oneEntry #nav-contactid-bestId {
+    display: none;
+}
\ No newline at end of file

src/web-chatview/chatview.js

@@ -75,7 +75,6 @@ var canLazyLoad = false
 var linkifyOptions = {}
 if (use_qt) {
     messageBarInput.onpaste = pasteKeyDetected
-    wrapperOfNavbar.outerHTML = ""
     linkifyOptions = {
         attributes: null,
         className: "linkified",
@@ -339,7 +338,6 @@ function displayRecordControls(isVisible) {
     }
 }
 
-
 /**
  * Hide or show message bar, and update body bottom padding accordingly.
  *