[buddypress-trac] [BuddyPress Trac] #6122: BP JS whats-new-options animation cuts of larger child elements

[buddypress-trac]

#6122: BP JS whats-new-options animation cuts of larger child elements
------------------------------------+-----------------------
 Reporter:  hnla                    |      Owner:
     Type:  defect (bug)            |     Status:  new
 Priority:  normal                  |  Milestone:  2.2
Component:  Theme / Template Parts  |    Version:
 Severity:  normal                  |   Keywords:  has-patch
------------------------------------+-----------------------
 This has been an issue for a while with some themes.

 BP runs  a jquery animation routine on the whats new update elements
 setting a fixed height for the textarea and the whats-new-options parent
 that wraps the select and submit elements.

 The issue is a fixed height as been set  and in the BP styles  `height: 0;
 overflow: auto; ` used to hide the initial state of the element on load.

 The result is with certain themes where the submit button is larger than
 BP anticipated we see the button cut off and very ugly overflow scrollbars
 introduced due to the auto overflow property, in addition we do not
 actually have a mechanism in place that returns the options element to
 it's original hidden state when the `.blur` routine is called.

 This patch attempts to rectify these issues.

 Firstly it changes all animation properties 'height' to 'minHeight'
 There is no real reason we should be setting fixed height, fixed height
 are generally considered bad unless for a very specific reason, here there
 is no real reason and with the overflow factor changed elements will
 simply push out through the parent so an issue if styling dictates a
 background for example.

 Secondly we change the animate height property on the `.blur` routine to
 have a value of null `''` thus actually removing it rather than re-stating
 the value '40px' now our options will hide themselves on losing focus on
 the textarea.

 Lastly a series of classes are  set to provide styling hooks for the state
 changes; so we have 'whats-new-show' and 'whats-new-hide' for the #whats-
 new-options and one for the textarea to show it's in focussed state - this
 is less critical but potentially useful.

 The two new classes for  show/hide will allow us rectify this issue by
 stating the overflow of the element to as 'hidden' and 'visible'

 There will need to be an additional patch to BP styles to correct the
 issue for future themes but this patch will allow devs to easily make
 adjustments where necessary.

--
Ticket URL: <https://buddypress.trac.wordpress.org/ticket/6122>
BuddyPress Trac <http://buddypress.org/>
BuddyPress Trac