by default, modals will not cover chat

Author: rmisio

css/obBase.css

@@ -1039,13 +1039,20 @@ label.fieldItem {
   height: 100%;
   top: 0;
   left: 0;
-  right: 0;
-  /* use fadeIn and fadeOut to change opacity */
-  transition: opacity .05s cubic-bezier(0, 0, 0.2, 1);
+  transition: opacity .05s cubic-bezier(0, 0, 0.2, 1),
+              width 0.5s ease;
   padding-top: 25px;
   z-index: 1;
 }
 
+#ov1.chatLoaded .modal:not(.modal-cover-fullscreen) {
+  width: calc(100% - 45px);
+}
+
+#ov1.chatOpen .modal:not(.modal-cover-fullscreen) {
+  width: calc(100% - 230px);
+}
+
 .modal.modal-navOffset {
   top: 50px;
 }
@@ -1073,11 +1080,6 @@ label.fieldItem {
   height: 574px;
 }
 
-#ov1.chatOpen .modal-child {
-  right: 230px;
-}
-
-
 .modal.modal-navOffset .modal-child {
   margin-top: 25px;
 }

index.html

@@ -42,8 +42,7 @@ <h2 class="ion-android-close custCol-text clickable"></h2>
   </div>
   <div id="statusBar"></div>
   <div id="pageNav" class="bar navBar navBar-main custCol-secondary padding0"></div>
-  <!-- the loading modal must be on top of the page nav or the reload button is hidden -->
-  <div id="loadingModal" class="modal modal-opaque js-loadingModal top0 hide">
+  <div id="loadingModal" class="modal modal-opaque modal-cover-fullscreen js-loadingModal hide">
     <div class="spinner-with-logo fullCentered">
       <i class="ion-android-sync spinner fontSize30 spinner-with-logo-icon"></i>
     </div>

js/start.js

@@ -385,6 +385,8 @@ var loadProfile = function(landingRoute, onboarded) {
 
               $('#sideBar').html(app.chatVw.render().el);
 
+              $('html').addClass('chatLoaded navBarLoaded');
+
               app.router = new router({userModel: user, userProfile: userProfile, socketView: newSocketView});
 
               if (externalRoute) {

js/views/chatVw.js

@@ -204,7 +204,6 @@ module.exports = baseVw.extend({
     this.slideOut();
 
     // mark as read
-    // $.post(app.serverConfigs.getActive().getServerBaseUrl() + '/mark_chat_message_as_read', { guid: model.get('guid') });
     this.markConvoAsRead(model.get('guid'));
 
     // mark as read on chat head