diff --git a/css/fieldmanager-group-tabs.css b/css/fieldmanager-group-tabs.css index 7d3b3d9d1e..87fcff2cfe 100644 --- a/css/fieldmanager-group-tabs.css +++ b/css/fieldmanager-group-tabs.css @@ -87,6 +87,10 @@ border-top: none; } +.fm-wrapper .wp-tabs-panel > .fm-wrapper .fm-group-inner { + border-top: solid 1px #dfdfdf; +} + /* Vertical Tabs */ .fm-tabbed-vertical { margin: -6px -12px -12px; diff --git a/css/fieldmanager.css b/css/fieldmanager.css index fdea4b70ba..348c700c12 100644 --- a/css/fieldmanager.css +++ b/css/fieldmanager.css @@ -32,19 +32,24 @@ /* Groups */ .fm-group { - border: solid 1px #dfdfdf; margin-bottom: 5px; background-color: #fff; +} + +.fm-group-inner, +.fm-group-label-wrapper { + border: solid 1px #dfdfdf; -webkit-box-shadow: 0 1px 1px rgba(0,0,0,.04); box-shadow: 0 1px 1px rgba(0,0,0,.04); } .fm-group-inner { padding: 10px; - border-top: 1px solid #dfdfdf; + border-top: none; } -.fm-group h4, .fm-group div.fm-group-label-wrapper { +.fm-group h4, +.fm-group div.fm-group-label-wrapper { cursor: default; font-size: 13px; padding: 5px 5px 7px; @@ -53,6 +58,40 @@ color: #222; } +.fm-group-label-wrapper.fmjs-drag-header:hover, +.fm-group-label-wrapper.fmjs-collapsible-handle:hover { + border: 1px solid #999; +} + +.fm-group-label-wrapper.fmjs-collapsible-handle .fmjs-remove { + display:none; +} + +.fm-group-label-wrapper.fmjs-collapsible-handle:hover .fmjs-remove { + display: block; +} + +.fm-group-label-wrapper.fmjs-collapsible-handle:hover .toggle-indicator { + color: #777; +} + +.fm-group .toggle-indicator { + color: #a0a5aa; + margin-left: 5px; +} + +.fm-group .toggle-indicator:before { + vertical-align: middle; +} + +.fm-item .fmjs-collapsible-handle.closed .toggle-indicator:before { + content: "\f140"; +} + +.fmjs-collapsible-handle .toggle-indicator { + float: right; +} + div.fm-group-label-wrapper { overflow: auto; } @@ -330,4 +369,4 @@ a.fm-delete:hover { .form-field .fm-option label, .form-field .fm-checkbox label { display: inline; -} \ No newline at end of file +} diff --git a/js/fieldmanager.js b/js/fieldmanager.js index 46ad33a0b0..1bb6247038 100644 --- a/js/fieldmanager.js +++ b/js/fieldmanager.js @@ -161,6 +161,12 @@ $( document ).ready( function () { $( this ).parents( '.fm-group' ).first().children( '.fm-group-inner' ).slideToggle( 'fast' ); fm_renumber( $( this ).parents( '.fm-wrapper' ).first() ); $( this ).parents( '.fm-group' ).first().trigger( 'fm_collapsible_toggle' ); + $( this ).toggleClass( 'closed' ); + if ( $( this ).hasClass( 'closed' ) ) { + $( this ).attr( 'aria-expanded', 'false' ); + } else { + $( this ).attr( 'aria-expanded', 'true' ); + } } ); $( '.fm-collapsed > .fm-group:not(.fmjs-proto) > .fm-group-inner' ).hide(); diff --git a/php/class-fieldmanager-field.php b/php/class-fieldmanager-field.php index de98bf4519..f4dc97ccc9 100644 --- a/php/class-fieldmanager-field.php +++ b/php/class-fieldmanager-field.php @@ -939,7 +939,7 @@ public function get_remove_handle() { * @return string */ public function get_collapse_handle() { - return sprintf( '