浏览代码

Some tweaking of the css.

Make the text part of an input-group a bit wider and other padding/margin
tweaking.
JC Brand 10 年之前
父节点
当前提交
2e297a1c84
共有 3 个文件被更改,包括 139 次插入145 次删除
  1. 69 66
      css/converse.css
  2. 0 0
      css/converse.css.map
  3. 70 79
      sass/converse.scss

+ 69 - 66
css/converse.css

@@ -523,17 +523,6 @@
     color: red; }
     color: red; }
   #conversejs input.error {
   #conversejs input.error {
     border: 1px solid red; }
     border: 1px solid red; }
-  #conversejs #converse-register .form-errors {
-    color: red;
-    display: none; }
-  #conversejs #converse-register .provider-title {
-    font-size: 115%; }
-  #conversejs #converse-register .provider-score {
-    width: 178px;
-    margin-bottom: 8px; }
-  #conversejs #converse-register .form-help .url {
-    font-weight: bold;
-    color: #436F64; }
   #conversejs .reg-feedback {
   #conversejs .reg-feedback {
     font-size: 85%; }
     font-size: 85%; }
   #conversejs .reg-feedback,
   #conversejs .reg-feedback,
@@ -589,7 +578,7 @@
     padding-left: 2em;
     padding-left: 2em;
     font-weight: bold; }
     font-weight: bold; }
   #conversejs dl.add-converse-contact {
   #conversejs dl.add-converse-contact {
-    margin: 0 0.5em 0.5em 0.5em; }
+    margin: 0 0.5em 0.75em 0.5em; }
   #conversejs .fancy-dropdown {
   #conversejs .fancy-dropdown {
     border: 1px solid #F1DCD6;
     border: 1px solid #F1DCD6;
     height: 25px;
     height: 25px;
@@ -931,56 +920,79 @@
     height: -webkit-calc(100% - 44px);
     height: -webkit-calc(100% - 44px);
     height: calc(100% - 44px); }
     height: calc(100% - 44px); }
   #conversejs .controlbox-pane {
   #conversejs .controlbox-pane {
-    padding: 5px 0;
-    overflow-y: hidden; }
+    overflow-y: hidden;
+    overflow-x: hidden; }
     #conversejs .controlbox-pane dd {
     #conversejs .controlbox-pane dd {
       margin-left: 0;
       margin-left: 0;
       margin-bottom: 0; }
       margin-bottom: 0; }
-    #conversejs .controlbox-pane dd.odd {
-      background-color: #DCEAC5; }
-  #conversejs #converse-register .title {
-    font-weight: bold; }
-  #conversejs #converse-register .info {
-    font-style: italic;
-    color: green;
-    font-size: 85%;
-    margin: 5px 0; }
-  #conversejs .form-help,
-  #conversejs #converse-register .instructions {
-    color: gray;
-    font-size: 85%; }
-  #conversejs .form-help:hover,
-  #conversejs #converse-register .instructions:hover {
-    color: #6C4C44; }
+      #conversejs .controlbox-pane dd.odd {
+        background-color: #DCEAC5; }
+  #conversejs #converse-register {
+    background: white; }
+    #conversejs #converse-register .title {
+      font-weight: bold; }
+    #conversejs #converse-register .info {
+      font-style: italic;
+      color: green;
+      font-size: 85%;
+      margin: 5px 0; }
+    #conversejs #converse-register .form-errors {
+      color: red;
+      display: none; }
+    #conversejs #converse-register .provider-title {
+      font-size: 22px; }
+    #conversejs #converse-register .provider-score {
+      width: 178px;
+      margin-bottom: 8px; }
+    #conversejs #converse-register .form-help .url {
+      font-weight: bold;
+      color: #436F64; }
+    #conversejs #converse-register .input-group {
+      display: table;
+      margin: auto;
+      width: 100%; }
+      #conversejs #converse-register .input-group span {
+        overflow-x: hidden;
+        text-overflow: ellipsis;
+        max-width: 110px; }
+      #conversejs #converse-register .input-group span, #conversejs #converse-register .input-group input[name=username] {
+        display: table-cell;
+        text-align: left; }
+    #conversejs #converse-register .instructions {
+      color: gray;
+      font-size: 85%; }
+      #conversejs #converse-register .instructions:hover {
+        color: #6C4C44; }
+  #conversejs #converse-register, #conversejs #converse-login {
+    margin: 2em 1em 1em 1em;
+    background: white; }
+    #conversejs #converse-register .login-submit, #conversejs #converse-register .submit, #conversejs #converse-login .login-submit, #conversejs #converse-login .submit {
+      height: 30px;
+      padding: 0px;
+      font-size: 14px; }
+    #conversejs #converse-register .submit, #conversejs #converse-login .submit {
+      margin: 1em 0; }
+    #conversejs #converse-register .login-anon, #conversejs #converse-login .login-anon {
+      height: auto;
+      white-space: normal; }
+    #conversejs #converse-register .cancel-submit, #conversejs #converse-register .save-submit, #conversejs #converse-login .cancel-submit, #conversejs #converse-login .save-submit {
+      width: 45%;
+      margin: 5px 3px 5px 3px; }
+    #conversejs #converse-register .cancel, #conversejs #converse-register .cancel-submit, #conversejs #converse-login .cancel, #conversejs #converse-login .cancel-submit {
+      color: #681F2C; }
+    #conversejs #converse-register .save-submit, #conversejs #converse-login .save-submit {
+      color: #436F64; }
+    #conversejs #converse-register input, #conversejs #converse-login input {
+      width: 100%;
+      height: 30px;
+      margin: 5px 0 10px 0;
+      padding-left: 0.5em; }
   #conversejs .form-help {
   #conversejs .form-help {
+    color: gray;
+    font-size: 85%;
     padding-top: 5px; }
     padding-top: 5px; }
-  #conversejs #converse-register,
-  #conversejs #converse-login {
-    background: white;
-    padding: 1em; }
-  #conversejs #converse-register input,
-  #conversejs #converse-login input {
-    width: 100%;
-    height: 30px;
-    margin: 5px 0 10px 0;
-    padding-left: 0.5em; }
-  #conversejs #converse-register .input-group {
-    table-layout: fixed;
-    display: table;
-    margin: auto;
-    width: 178px; }
-    #conversejs #converse-register .input-group span {
-      overflow-x: hidden;
-      text-overflow: ellipsis; }
-    #conversejs #converse-register .input-group span, #conversejs #converse-register .input-group input[name=username] {
-      display: table-cell; }
-  #conversejs .cancel-submit, #conversejs .save-submit {
-    width: 45%;
-    margin: 5px 3px 5px 3px; }
-  #conversejs .cancel, #conversejs .cancel-submit {
-    color: #681F2C; }
-  #conversejs .save-submit {
-    color: #436F64; }
+    #conversejs .form-help:hover {
+      color: #6C4C44; }
   #conversejs .chatroom-form label,
   #conversejs .chatroom-form label,
   #conversejs .controlbox-pane label,
   #conversejs .controlbox-pane label,
   #conversejs #converse-register label,
   #conversejs #converse-register label,
@@ -989,15 +1001,6 @@
     font-weight: bold;
     font-weight: bold;
     height: auto;
     height: auto;
     margin: 4px; }
     margin: 4px; }
-  #conversejs #converse-register .login-submit, #conversejs #converse-register .submit, #conversejs #converse-login .login-submit, #conversejs #converse-login .submit {
-    height: 30px;
-    padding: 0px;
-    font-size: 14px; }
-  #conversejs #converse-register .submit, #conversejs #converse-login .submit {
-    margin: 1em 0; }
-  #conversejs #converse-register .login-anon, #conversejs #converse-login .login-anon {
-    height: auto;
-    white-space: normal; }
   #conversejs form.add-chatroom {
   #conversejs form.add-chatroom {
     background: none;
     background: none;
     padding: 0.5em; }
     padding: 0.5em; }

文件差异内容过多而无法显示
+ 0 - 0
css/converse.css.map


+ 70 - 79
sass/converse.scss

@@ -525,24 +525,6 @@
     border: 1px solid red;
     border: 1px solid red;
   }
   }
 
 
-  #converse-register {
-    .form-errors {
-      color: red;
-      display: none;
-    }
-    .provider-title {
-      font-size: 115%;
-    }
-    .provider-score {
-      width: 178px;
-      margin-bottom: 8px;
-    }
-    .form-help .url {
-      font-weight: bold;
-      color: $link-color;
-    }
-  }
-
   .reg-feedback {
   .reg-feedback {
     font-size: 85%;
     font-size: 85%;
   }
   }
@@ -620,7 +602,7 @@
   }
   }
 
 
   dl.add-converse-contact {
   dl.add-converse-contact {
-    margin: 0 0.5em 0.5em 0.5em;
+    margin: 0 0.5em 0.75em 0.5em;
   }
   }
 
 
   .fancy-dropdown {
   .fancy-dropdown {
@@ -1081,18 +1063,19 @@
   }
   }
 
 
   .controlbox-pane {
   .controlbox-pane {
-    padding: 5px 0;
     overflow-y: hidden;
     overflow-y: hidden;
+    overflow-x: hidden;
     dd {
     dd {
       margin-left: 0;
       margin-left: 0;
       margin-bottom: 0;
       margin-bottom: 0;
-    }
-    dd.odd {
-      background-color: #DCEAC5;
+      &.odd {
+        background-color: #DCEAC5;
+      }
     }
     }
   }
   }
 
 
   #converse-register {
   #converse-register {
+    background: white;
     .title {
     .title {
       font-weight: bold;
       font-weight: bold;
     }
     }
@@ -1102,75 +1085,48 @@
       font-size: 85%;
       font-size: 85%;
       margin: 5px 0;
       margin: 5px 0;
     }
     }
-  }
-
-  .form-help,
-  #converse-register .instructions {
-    color: gray;
-    font-size: 85%;
-  }
-
-  .form-help:hover,
-  #converse-register .instructions:hover {
-    color: $text-color;
-  }
-
-  .form-help {
-    padding-top: 5px;
-  }
-
-  #converse-register,
-  #converse-login {
-    background: white;
-    padding: 1em;
-  }
-
-  #converse-register input,
-  #converse-login input {
-    width: 100%;
-    height: 30px;
-    margin: 5px 0 10px 0;
-    padding-left: 0.5em;
-  }
-
-  #converse-register {
+    .form-errors {
+      color: red;
+      display: none;
+    }
+    .provider-title {
+      font-size: 22px;
+    }
+    .provider-score {
+      width: 178px;
+      margin-bottom: 8px;
+    }
+    .form-help .url {
+      font-weight: bold;
+      color: $link-color;
+    }
     .input-group {
     .input-group {
-      table-layout: fixed;
       display: table;
       display: table;
       margin: auto;
       margin: auto;
-      width: 178px;
+      width: 100%;
       span {
       span {
           overflow-x: hidden;
           overflow-x: hidden;
           text-overflow: ellipsis;
           text-overflow: ellipsis;
+          max-width: 110px;
       }
       }
       span, input[name=username] {
       span, input[name=username] {
           display: table-cell;
           display: table-cell;
+          text-align: left;
+      }
+    }
+    .instructions {
+      color: gray;
+      font-size: 85%;
+      &:hover {
+        color: $text-color;
       }
       }
     }
     }
-  }
-
-  .cancel-submit, .save-submit {
-    width: 45%;
-    margin: 5px 3px 5px 3px;
-  }
-  .cancel, .cancel-submit {
-    color: $warning-color;
-  }
-  .save-submit {
-    color: $save-button-color;
-  }
-
-  .chatroom-form label,
-  .controlbox-pane label,
-  #converse-register label,
-  #converse-login label {
-    font-size: $font-size;
-    font-weight: bold;
-    height: auto;
-    margin: 4px;
   }
   }
 
 
   #converse-register, #converse-login {
   #converse-register, #converse-login {
+    margin: 2em 1em 1em 1em;
+    background: white;
+
     .login-submit, .submit {
     .login-submit, .submit {
       height: 30px;
       height: 30px;
       padding: 0px;
       padding: 0px;
@@ -1183,6 +1139,41 @@
       height: auto;
       height: auto;
       white-space: normal;
       white-space: normal;
     }
     }
+    .cancel-submit, .save-submit {
+      width: 45%;
+      margin: 5px 3px 5px 3px;
+    }
+    .cancel, .cancel-submit {
+      color: $warning-color;
+    }
+    .save-submit {
+      color: $save-button-color;
+    }
+    input {
+      width: 100%;
+      height: 30px;
+      margin: 5px 0 10px 0;
+      padding-left: 0.5em;
+    }
+  }
+
+  .form-help {
+    color: gray;
+    font-size: 85%;
+    padding-top: 5px;
+    &:hover {
+      color: $text-color;
+    }
+  }
+
+  .chatroom-form label,
+  .controlbox-pane label,
+  #converse-register label,
+  #converse-login label {
+    font-size: $font-size;
+    font-weight: bold;
+    height: auto;
+    margin: 4px;
   }
   }
   
   
   form.add-chatroom {
   form.add-chatroom {
@@ -1492,7 +1483,7 @@
 
 
   .set-xmpp-status {
   .set-xmpp-status {
     background: none;
     background: none;
-    padding: 0.5em;
+    padding: 0.75em 0.5em 0.5em 0.5em;
     .dropdown dd ul {
     .dropdown dd ul {
       z-index: 22;
       z-index: 22;
     }
     }

部分文件因为文件数量过多而无法显示