浏览代码

More css tweaks. Set text size in chats.

JC Brand 8 年之前
父节点
当前提交
af0930c6f2
共有 5 个文件被更改,包括 24 次插入12 次删除
  1. 15 6
      css/converse.css
  2. 4 3
      css/inverse.css
  3. 1 0
      sass/_chatbox.scss
  4. 3 3
      sass/inverse/_chatbox.scss
  5. 1 0
      sass/inverse/_variables.scss

+ 15 - 6
css/converse.css

@@ -1346,7 +1346,7 @@
   #converse-embedded-chat .button-cancel,
   #converse-embedded-chat .button-cancel,
   #conversejs .button-cancel {
   #conversejs .button-cancel {
     color: white;
     color: white;
-    background-color: #D24E2B; }
+    background-color: #818479; }
   #converse-embedded-chat form.pure-form.converse-form,
   #converse-embedded-chat form.pure-form.converse-form,
   #conversejs form.pure-form.converse-form {
   #conversejs form.pure-form.converse-form {
     background: white;
     background: white;
@@ -1553,7 +1553,9 @@
       padding: 5px; }
       padding: 5px; }
     #converse-embedded-chat .chatbox .chat-body .chat-info,
     #converse-embedded-chat .chatbox .chat-body .chat-info,
     #conversejs .chatbox .chat-body .chat-info {
     #conversejs .chatbox .chat-body .chat-info {
-      color: #D24E2B;
+      line-height: 16px;
+      color: #3AA569;
+      font-size: 14px;
       margin: 0.3em; }
       margin: 0.3em; }
       #converse-embedded-chat .chatbox .chat-body .chat-info.chat-event,
       #converse-embedded-chat .chatbox .chat-body .chat-info.chat-event,
       #conversejs .chatbox .chat-body .chat-info.chat-event {
       #conversejs .chatbox .chat-body .chat-info.chat-event {
@@ -1585,7 +1587,7 @@
         overflow: hidden; }
         overflow: hidden; }
       #converse-embedded-chat .chatbox .chat-body .chat-message span.chat-msg-them,
       #converse-embedded-chat .chatbox .chat-body .chat-message span.chat-msg-them,
       #conversejs .chatbox .chat-body .chat-message span.chat-msg-them {
       #conversejs .chatbox .chat-body .chat-message span.chat-msg-them {
-        color: #3AA569; }
+        color: #E77051; }
       #converse-embedded-chat .chatbox .chat-body .chat-message span.chat-msg-me,
       #converse-embedded-chat .chatbox .chat-body .chat-message span.chat-msg-me,
       #conversejs .chatbox .chat-body .chat-message span.chat-msg-me {
       #conversejs .chatbox .chat-body .chat-message span.chat-msg-me {
         color: #578EA9; }
         color: #578EA9; }
@@ -1983,11 +1985,12 @@
           display: block;
           display: block;
           margin-left: 5px; }
           margin-left: 5px; }
         #conversejs #controlbox #chatrooms .rooms-list-container dl.rooms-list dd.available-chatroom p.room-info {
         #conversejs #controlbox #chatrooms .rooms-list-container dl.rooms-list dd.available-chatroom p.room-info {
+          line-height: 16px;
           margin: 0;
           margin: 0;
-          padding: 0;
           display: block;
           display: block;
           white-space: normal; }
           white-space: normal; }
         #conversejs #controlbox #chatrooms .rooms-list-container dl.rooms-list dd.available-chatroom div.room-info {
         #conversejs #controlbox #chatrooms .rooms-list-container dl.rooms-list dd.available-chatroom div.room-info {
+          padding: 0.3em 0;
           clear: left;
           clear: left;
           width: 100%; }
           width: 100%; }
   #conversejs #controlbox .dropdown {
   #conversejs #controlbox .dropdown {
@@ -2409,11 +2412,14 @@
       background-color: white;
       background-color: white;
       border-top: 0;
       border-top: 0;
       width: 100%; }
       width: 100%; }
+      #converse-embedded-chat .chatroom .box-flyout .chatroom-body .chat-info,
+      #conversejs .chatroom .box-flyout .chatroom-body .chat-info {
+        color: #E77051; }
       #converse-embedded-chat .chatroom .box-flyout .chatroom-body .mentioned,
       #converse-embedded-chat .chatroom .box-flyout .chatroom-body .mentioned,
       #conversejs .chatroom .box-flyout .chatroom-body .mentioned {
       #conversejs .chatroom .box-flyout .chatroom-body .mentioned {
         font-weight: bold; }
         font-weight: bold; }
-      #converse-embedded-chat .chatroom .box-flyout .chatroom-body .chat-msg-room,
-      #conversejs .chatroom .box-flyout .chatroom-body .chat-msg-room {
+      #converse-embedded-chat .chatroom .box-flyout .chatroom-body .chat-message .chat-msg-them,
+      #conversejs .chatroom .box-flyout .chatroom-body .chat-message .chat-msg-them {
         color: #3AA569; }
         color: #3AA569; }
       #converse-embedded-chat .chatroom .box-flyout .chatroom-body .disconnect-msg,
       #converse-embedded-chat .chatroom .box-flyout .chatroom-body .disconnect-msg,
       #conversejs .chatroom .box-flyout .chatroom-body .disconnect-msg {
       #conversejs .chatroom .box-flyout .chatroom-body .disconnect-msg {
@@ -2546,6 +2552,9 @@
         #conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container input[type=button],
         #conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container input[type=button],
         #conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container input[type=submit] {
         #conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container input[type=submit] {
           margin: 0 0.5em; }
           margin: 0 0.5em; }
+        #converse-embedded-chat .chatroom .box-flyout .chatroom-body .chatroom-form-container .button-primary,
+        #conversejs .chatroom .box-flyout .chatroom-body .chatroom-form-container .button-primary {
+          background-color: #E77051; }
   #converse-embedded-chat .chatroom form.sendXMPPMessage .chat-toolbar,
   #converse-embedded-chat .chatroom form.sendXMPPMessage .chat-toolbar,
   #conversejs .chatroom form.sendXMPPMessage .chat-toolbar {
   #conversejs .chatroom form.sendXMPPMessage .chat-toolbar {
     background-color: #E77051; }
     background-color: #E77051; }

+ 4 - 3
css/inverse.css

@@ -1599,6 +1599,7 @@ body {
       padding: 5px; }
       padding: 5px; }
     #converse-embedded-chat .chatbox .chat-body .chat-info,
     #converse-embedded-chat .chatbox .chat-body .chat-info,
     #conversejs .chatbox .chat-body .chat-info {
     #conversejs .chatbox .chat-body .chat-info {
+      line-height: 22px;
       color: #3AA569;
       color: #3AA569;
       font-size: 16px;
       font-size: 16px;
       margin: 0.3em; }
       margin: 0.3em; }
@@ -1898,9 +1899,9 @@ body {
     border-top-left-radius: 7px;
     border-top-left-radius: 7px;
     border-top-right-radius: 7px; }
     border-top-right-radius: 7px; }
     #conversejs .chatbox .chat-body .chat-message {
     #conversejs .chatbox .chat-body .chat-message {
-      font-size: 16px;
-      line-height: 22px;
-      margin: 0.8em 0; }
+      font-size: 14px;
+      line-height: 20px;
+      margin: 0.5em 0; }
   #conversejs .chatbox .chat-content {
   #conversejs .chatbox .chat-content {
     padding: 0 1em 1em 1em;
     padding: 0 1em 1em 1em;
     border-top-left-radius: 7px;
     border-top-left-radius: 7px;

+ 1 - 0
sass/_chatbox.scss

@@ -131,6 +131,7 @@
                 padding: 5px;
                 padding: 5px;
             }
             }
             .chat-info {
             .chat-info {
+                line-height: $line-height;
                 color: $chat-head-color;
                 color: $chat-head-color;
                 font-size: $font-size;
                 font-size: $font-size;
                 margin: 0.3em;
                 margin: 0.3em;

+ 3 - 3
sass/inverse/_chatbox.scss

@@ -43,9 +43,9 @@
             border-top-right-radius: $chatbox-border-radius;
             border-top-right-radius: $chatbox-border-radius;
 
 
             .chat-message {
             .chat-message {
-                font-size: $font-size;
-                line-height: $line-height;
-                margin: 0.8em 0;
+                font-size: $font-size-small;
+                line-height: $line-height-small;
+                margin: 0.5em 0;
             }
             }
         }
         }
         .chat-content {
         .chat-content {

+ 1 - 0
sass/inverse/_variables.scss

@@ -97,6 +97,7 @@ $legend-font-size: 18px !default;
 $toolbar-height: 29px !default;
 $toolbar-height: 29px !default;
 $toolbar-color: $chat-head-color !default;
 $toolbar-color: $chat-head-color !default;
 
 
+$line-height-small:  20px !default;
 $line-height:  22px !default;
 $line-height:  22px !default;
 
 
 $controlbox-width: 250px !default;
 $controlbox-width: 250px !default;