Changeset 8639

Timestamp:

07/17/2014 06:04:14 PM (12 years ago)

Author:

johnjamesjacoby

Message:

More visual updates to XProfile admin UI, to bring it more inline with other WordPress core sortable/droppable elements.

Location:

trunk/src/bp-xprofile/admin

Files:

• css/admin-rtl.css (modified) (7 diffs)
• css/admin.css (modified) (6 diffs)
• js/admin.js (modified) (4 diffs)

trunk/src/bp-xprofile/admin/css/admin-rtl.css

@@ -10 +10 @@
     }
     p.nofields {
-        margin-top: 20px;
+        margin: 10px 0;
     }
 
@@ -71 +71 @@
         background: #f5f5f5;
         border-width: 1px 1px 0;
-        margin: -20px -21px 20px -21px;
-        clear: right;
+        margin: -20px -21px 10px -21px;
+        clear: left;
         padding: 10px;
         border: 1px solid #dedede;
@@ -99 +99 @@
         background-color: #fff;
         clear: left;
-        padding: 20px;
+        padding: 20px 20px 10px 20px;
         border-left: 1px solid #ccc;
         border-right: 1px solid #ccc;
@@ -107 +107 @@
         position: relative;
         cursor: default !important;
-        background: inherit;
         }
         .tab-wrapper fieldset legend {
@@ -118 +117 @@
         position: relative;
         border: 1px solid #ddd;
-        margin: 10px 0 0 0;
+        margin: 10px 0;
         cursor: move !important;
-        background: #f5f5f5;
+        background: #fafafa;
+        padding: 10px 0 0 ;
     }
     .tab-wrapper fieldset fieldset legend {
-        position: absolute !important;
-        top: 0;
-        right: 0;
-        width: 80%;
-        padding: 30px;
-    }
-    .tab-wrapper fieldset fieldset legend span {
         position: absolute;
-        top: 6px;
+        top: 10px;
         right: 10px;
-        font-weight: bold;
-        width: 100%;
+        padding: 0;
     }
         .field-group fieldset:hover {
-            background-color: #fafafa;
-            border-color: #ccc;
+            border-color: #999;
         }
         fieldset div.field-wrapper {
-            padding: 40px 10px 10px;
+            padding: 25px 10px 10px;
         }
     fieldset.radio div div label,
@@ -154 +145 @@
         float: none;
         border-top: 1px solid #ddd;
-        margin: 20px 0 0;
+        margin: 10px 0 0;
         padding-top: 10px;
     }
@@ -167 +158 @@
     .field-group fieldset.ui-sortable-placeholder {
         border: 1px dashed #999;
-        background-color: #fafafa;
+        background-color: #fff;
         visibility: visible !important;
     }

trunk/src/bp-xprofile/admin/css/admin.css

@@ -10 +10 @@
     }
     p.nofields {
-        margin-top: 20px;
+        margin: 10px 0;
     }
 
@@ -99 +99 @@
         background-color: #fff;
         clear: left;
-        padding: 20px;
+        padding: 20px 20px 10px 20px;
         border-left: 1px solid #ccc;
         border-right: 1px solid #ccc;
@@ -107 +107 @@
         position: relative;
         cursor: default !important;
-        background: inherit;
         }
         .tab-wrapper fieldset legend {
@@ -118 +117 @@
         position: relative;
         border: 1px solid #ddd;
-        margin: 10px 0 0 0;
+        margin: 10px 0;
         cursor: move !important;
-        background: #f5f5f5;
+        background: #fafafa;
+        padding: 10px 0 0 ;
     }
     .tab-wrapper fieldset fieldset legend {
-        position: absolute !important;
-        top: 0;
-        left: 0;
-        width: 80%;
-        padding: 30px;
-    }
-    .tab-wrapper fieldset fieldset legend span {
         position: absolute;
-        top: 6px;
+        top: 10px;
         left: 10px;
-        font-weight: bold;
-        width: 100%;
+        padding: 0;
     }
         .field-group fieldset:hover {
-            background-color: #fafafa;
-            border-color: #ccc;
+            border-color: #999;
         }
         fieldset div.field-wrapper {
-            padding: 40px 10px 10px;
+            padding: 25px 10px 10px;
         }
     fieldset.radio div div label,
@@ -154 +145 @@
         float: none;
         border-top: 1px solid #ddd;
-        margin: 20px 0 0;
+        margin: 10px 0 0;
         padding-top: 10px;
     }
@@ -167 +158 @@
     .field-group fieldset.ui-sortable-placeholder {
         border: 1px dashed #999;
-        background-color: #fafafa;
+        background-color: #fff;
         visibility: visible !important;
     }

trunk/src/bp-xprofile/admin/js/admin.js

@@ -65 +65 @@
 /**
  * Hide all "options" sections, and show the options section for the forWhat type.
+ *
+ * @param {string} forWhat Value of the field to show options for
  */
 function show_options( forWhat ) {
@@ -147 +149 @@
         cursor: 'move',
         axis: 'x',
-        opacity: 0.6,
+        opacity: 1,
         items: 'li',
-        tolerance: 'pointer',
+        tolerance: 'intersect',
 
         update: function() {
@@ -165 +167 @@
     jQuery( 'fieldset.field-group' ).sortable({
         cursor: 'move',
-        opacity: 0.3,
+        opacity: 1,
         items: 'fieldset',
-        tolerance: 'pointer',
+        tolerance: 'ponter',
 
         update: function() {
@@ -206 +208 @@
             // When field is dropped on tab
             drop: function( ev, ui ) {
-                var $item = jQuery(this),  // The tab
-                    $list   = jQuery( $item.find( 'a' ).attr( 'href' ) ).find( '.connectedSortable' );  // The tab body
+                var $item = jQuery(this), // The tab
+                    $list = jQuery( $item.find( 'a' ).attr( 'href' ) ).find( '.connectedSortable' ); // The tab body
 
                 // Remove helper class