CRM-17620 - expandRow add margin and smooth scrolling

diff --git a/css/civicrm.css b/css/civicrm.css
index 3b2e1b254b9529b89f9f57ae6c1a234e3b64c2d9..ae1476e2b8228f5b1cff82efe59e5f1a8b302241 100644 (file)
--- a/css/civicrm.css
+++ b/css/civicrm.css
@@ -2246,16 +2246,14 @@ div.crm-master-accordion-header a.helpicon {
 }
 
 .crm-container .crm-expand-row {
-  width: 16px;
-  height: 16px;
+  min-width: 16px;
+  min-height: 16px;
   display: inline-block;
-  background-image: url("../i/TreePlus.gif");
 }
 
 .crm-container .crm-accordion-inner .crm-accordion-header,
 .crm-container .crm-accordion-wrapper .crm-master-accordion-header,
-.crm-container .crm-collapsible .collapsible-title,
-.crm-container .crm-expand-row.expanded {
+.crm-container .crm-collapsible .collapsible-title {
   background-image: url("../i/TreeMinus.gif");
   background-color: transparent;
   color: #3E3E3E;
@@ -2325,6 +2323,10 @@ div.crm-master-accordion-header a.helpicon {
   color: #0200A0;
 }
 
+.crm-container .crm-child-row > td {
+  padding-left: 1.8em;
+}
+
 /* civicrm admin menu */
 #civicrm-menu .ui-autocomplete-input,
 .crm-container .ui-autocomplete-input {
@@ -3394,15 +3396,16 @@ div.m ul#civicrm-menu,
   padding-left: 20px;
 }
 
-#crm-container span.collapsed,
-#crm-container a.collapsed {
+.crm-container span.collapsed,
+.crm-container a.collapsed,
+.crm-container .crm-expand-row {
   background: url("../i/TreePlus.gif") no-repeat 0 0;
   padding-left: 19px;
   cursor: pointer;
 }
 
-#crm-container span.expanded,
-#crm-container a.expanded {
+.crm-container span.expanded,
+.crm-container a.expanded {
   background: url("../i/TreeMinus.gif") no-repeat 0 0;
   padding-left: 19px;
   cursor: pointer;

diff --git a/js/crm.expandRow.js b/js/crm.expandRow.js
index de0f41051d0a7d6f1f88ab876bf41a16c39134d3..f3aa86d300a33967c13f2dbd4436351a639579cd 100644 (file)
--- a/js/crm.expandRow.js
+++ b/js/crm.expandRow.js
@@ -5,12 +5,13 @@ CRM.$(function($) {
     .on('click.crmExpandRow', 'a.crm-expand-row', function(e) {
       var $row = $(this).closest('tr');
       if ($(this).hasClass('expanded')) {
-        $row.next('.crm-child-row').remove();
+        $row.next('.crm-child-row').children('td').children('div.crm-ajax-container')
+          .slideUp('fast', function() {$(this).closest('.crm-child-row').remove();});
       } else {
         var count = $('td', $row).length,
-          $newRow = $('<tr class="crm-child-row"><td colspan="' + count + '"></td></tr>')
+          $newRow = $('<tr class="crm-child-row"><td colspan="' + count + '"><div></div></td></tr>')
             .insertAfter($row);
-        CRM.loadPage(this.href, {target: $('td', $newRow.animate({height: '3em'}, 'fast'))});
+        CRM.loadPage(this.href, {target: $('div', $newRow).animate({minHeight: '3em'}, 'fast')});
       }
       $(this).toggleClass('expanded');
       e.preventDefault();