Browse Source

Fix vertical resizing of chat boxes.

This fix breaks compatibility with IE8
JC Brand 11 năm trước cách đây
mục cha
commit
df351d496d
3 tập tin đã thay đổi với 13 bổ sung11 xóa
  1. 6 5
      css/converse.css
  2. 1 0
      docs/CHANGES.rst
  3. 6 6
      less/converse.less

+ 6 - 5
css/converse.css

@@ -635,6 +635,7 @@ span.spinner.hor_centered {
   border-bottom-right-radius: 4px;
   border-bottom-left-radius: 4px;
   height: 289px;
+  height: calc(100% - 35px);
   border-top: 0;
 }
 #conversejs .chatroom .chat-area {
@@ -649,7 +650,7 @@ span.spinner.hor_centered {
   border-left: 1px solid #AAA;
   width: 100px;
   border-bottom-right-radius: 4px;
-  height: 289px;
+  height: 100%;
 }
 #conversejs .participants ul.participant-list li {
   overflow: hidden;
@@ -683,9 +684,8 @@ span.spinner.hor_centered {
   line-height: 1.3em;
   box-sizing: border-box;
   -moz-box-sizing: border-box;
-}
-#conversejs .chat-content {
   height: 206px;
+  height: calc(100% - 84px);
 }
 #conversejs .chat-info {
   color: #666666;
@@ -1181,6 +1181,7 @@ select#select-xmpp-status {
   border-bottom-left-radius: 4px;
   width: 100%;
   height: 289px;
+  height: calc(100% - 35px);
   overflow-y: hidden;
   position: absolute;
 }
@@ -1203,7 +1204,6 @@ select#select-xmpp-status {
   border-top-left-radius: 0;
   border-top-right-radius: 0;
   width: 200px;
-  height: 75px;
 }
 #conversejs .chatroom form.sendXMPPMessage {
   -webkit-border-bottom-right-radius: 0;
@@ -1215,7 +1215,8 @@ select#select-xmpp-status {
   border: 0;
   width: 100%;
   padding: 3px;
-  border-radius: 4px;
+  border-bottom-left-radius: 4px;
+  border-bottom-right-radius: 4px;
   resize: none;
   height: 62px;
 }

+ 1 - 0
docs/CHANGES.rst

@@ -8,6 +8,7 @@ Changelog
     1. Converse.js is now relicensed under the `Mozilla Public License <http://www.mozilla.org/MPL/2.0/>`_.
     2. Configuration options for the chat toolbar have changed.
        Please refer to the `relevant documentation <http://devbox:8890/docs/html/index.html#visible-toolbar-buttons>`_.
+    3. This release drops support for IE8.
 
 * Events have been renamed to remove "on" prefix (which is redundant when used with 'on' method). [jcbrand]
 * Simplified Chinese Translations [Lancelot]

+ 6 - 6
less/converse.less

@@ -674,6 +674,7 @@ span.spinner.hor_centered {
     border-bottom-right-radius: 4px;
     border-bottom-left-radius: 4px;
     height: 289px;
+    height: ~"calc(100% - 35px)";
     border-top: 0;
 }
 
@@ -690,7 +691,7 @@ span.spinner.hor_centered {
     border-left: 1px solid #AAA;
     width: 100px;
     border-bottom-right-radius: 4px;
-    height: 289px;
+    height: 100%;
 }
 
 #conversejs .participants ul.participant-list li {
@@ -729,10 +730,8 @@ span.spinner.hor_centered {
     line-height: 1.3em;
     box-sizing: border-box;
     -moz-box-sizing: border-box;
-}
-
-#conversejs .chat-content {
     height: 206px;
+    height: ~"calc(100% - 84px)";
 }
 
 #conversejs .chat-info {
@@ -1316,6 +1315,7 @@ select#select-xmpp-status {
     border-bottom-left-radius: 4px;
     width: 100%;
     height: 289px;
+    height: ~"calc(100% - 35px)";
     overflow-y: hidden;
     position: absolute;
 }
@@ -1340,7 +1340,6 @@ select#select-xmpp-status {
     border-top-left-radius: 0;
     border-top-right-radius: 0;
     width: 200px;
-    height: 75px;
 }
 
 #conversejs .chatroom form.sendXMPPMessage {
@@ -1354,7 +1353,8 @@ select#select-xmpp-status {
     border: 0;
     width: 100%;
     padding: 3px;
-    border-radius: 4px;
+    border-bottom-left-radius: 4px;
+    border-bottom-right-radius: 4px;
     resize: none;
     height: 62px;
 }