[details] improved UI details, cleaned up CSS

media/css/seahub.css

@@ -1,3 +1,20 @@
+/**
+ * CONTENTS
+ * 
+ * Font Icons
+ * icon-xx ...............Font Awesome 3.2.1 by Dave Gandy
+ * sf2-icon-xx ...........seafile-font2
+ *
+ * Reset 
+ * tags ..................reset styles of tags
+ *
+ * Helper
+ * common class .......... common class
+ *
+ * (TODO: complete this TOC)
+ *
+ */
+
 /****** icon-xx ********/
 /* Font Awesome 3.2.1 by Dave Gandy - http://fortawesome.github.com/Font-Awesome */
 @font-face {
@@ -973,15 +990,24 @@ textarea:-moz-placeholder {/* for FF */
     margin-right:8px;
 }
 /**** simplemodal ****/
-#basic-modal-content {display:none;}
+#basic-modal-content {
-#simplemodal-overlay { background-color:#000; }
+    display:none;
+}
+#simplemodal-overlay {
+    background-color:#000;
+}
 #simplemodal-container {
     padding: 20px;
     background-color:#fcfcfc;
     border-radius:4px;
     -moz-border-radius:4px;
 }
-#simplemodal-container a {font-weight:normal;}
+#simplemodal-container a {
+    font-weight:normal;
+}
+#simplemodal-container table {
+    margin:0;
+}
 .modalCloseImg {
     position:absolute;
     width:28px;
@@ -995,7 +1021,7 @@ textarea:-moz-placeholder {/* for FF */
 #simplemodal-container h3 {
     font-size:1.5em;
     word-wrap:break-word;
-    margin:0 0 4px;
+    margin:0 0 10px;
 }
 #simplemodal-container h3,
 #simplemodal-container h4,
@@ -2234,14 +2260,8 @@ textarea:-moz-placeholder {/* for FF */
 #folder-perm-popup,
 #file-share,
 #share-popup {
-    padding:15px;
     min-height:200px;
 }
-#folder-perm-popup .hd,
-#file-share .hd,
-#share-popup .hd {
-    margin:0 0 8px 4px;
-}
 #file-share .tip,
 #share-popup .tip {
     max-width:400px;
@@ -3509,11 +3529,6 @@ textarea:-moz-placeholder {/* for FF */
     margin-top:2px;
     height:30px;
 }
-#share-popup table,
-#repo-folder-perm table,
-#folder-perm-tabs table {
-    margin:0;
-}
 .select2-result-label .text {
     display:inline-block;
     width:calc(100% - 42px);
@@ -3525,14 +3540,14 @@ textarea:-moz-placeholder {/* for FF */
 .select2-result-label .text {
     vertical-align:middle;
 }
+#add-group-members-form {
+    margin-bottom:4px;
+}
 
 /* add repo to public */
 #add-pubrepo-popup {
     width:500px;
 }
-#add-pubrepo-popup table {
-    margin-bottom:8px;
-}
 #add-pubrepo-popup tbody {
     display: block;
     max-height: 150px;

seahub/templates/snippets/shared_link_js.html

@@ -62,7 +62,10 @@ function showSharePopup(op, name, aj_data, type, cur_path) {
     );
     {% endif %}
 
-    form.modal({appendTo: "#main",'focus':false, containerCss:{"padding":0}});
+    form.modal({
+        appendTo: "#main",
+        focus: false
+    });
 
     var hd = $('#file-share .hd');
     hd.html(hd.html().replace('%(name)s', '<span class="op-target">' + HTMLescape(trimFilename(name, 30)) + '</span>'));

static/scripts/app/views/dialogs/repo-folder-perm-admin.js

@@ -23,7 +23,6 @@ define([
             this.$('.op-target').css({'max-width':280}); // for long repo name
             this.$el.modal({
                 focus: false,
-                containerCss: {"padding": 0},
                 onClose: function() {
                     $(document).off('click', hideItemEdit);
                     $.modal.close();

static/scripts/app/views/dialogs/repo-share-link-admin.js

@@ -20,9 +20,7 @@ define([
 
             this.render();
             this.$('.op-target').css({'max-width':280}); // for long repo name
-            this.$el.modal({
+            this.$el.modal();
-                containerCss: {"padding": 0}
-            });
             $("#simplemodal-container").css({
                 'width':'auto',
                 'height':'auto'

static/scripts/app/views/folder-perm.js

@@ -25,8 +25,7 @@ define([
 
             this.$el.modal({
                 appendTo: "#main",
-                focus: false,
+                focus: false
-                containerCss: {"padding": 0}
             });
             $('#simplemodal-container').css({'width':'auto', 'height':'auto'});
 

static/scripts/app/views/share.js

@@ -24,11 +24,7 @@ define([
 
             this.render();
 
-            this.$el.modal({
+            this.$el.modal();
-                appendTo: "#main",
-                focus: false,
-                containerCss: {"padding": 0}
-            });
             $('#simplemodal-container').css({'width':'auto', 'height':'auto'});
 
             this.$("#share-tabs").tabs();