Index: misc/collapse.js =================================================================== RCS file: /cvs/drupal/drupal/misc/collapse.js,v retrieving revision 1.26 diff -u -p -r1.26 collapse.js --- misc/collapse.js 16 Oct 2009 19:20:34 -0000 1.26 +++ misc/collapse.js 17 Oct 2009 03:59:58 -0000 @@ -12,6 +12,7 @@ Drupal.toggleFieldset = function (fields $(fieldset) .removeClass('collapsed') .trigger({ type: 'collapsed', value: false }); + $('> legend > a > img', fieldset).replaceWith(Drupal.theme('collapseImage', false)); content.hide(); content.slideDown({ duration: 'fast', @@ -32,6 +33,7 @@ Drupal.toggleFieldset = function (fields $(fieldset).trigger({ type: 'collapsed', value: true }); var content = $('> div:not(.action)', fieldset).slideUp('fast', function () { $(this.parentNode).addClass('collapsed'); + $('> legend > a > img', this.parentNode).replaceWith(Drupal.theme('collapseImage', true)); this.parentNode.animating = false; }); } @@ -75,7 +77,7 @@ Drupal.behaviors.collapse = { // Turn the legend into a clickable link and wrap the contents of the // fieldset in a div for easier animation. var text = this.innerHTML; - $(this).empty().append($('' + text + '').click(function () { + $(this).empty().append($('' + Drupal.theme('collapseImage', true) + ' ' + text + '' + '').click(function () { var fieldset = $(this).parents('fieldset:first')[0]; // Don't animate multiple times. if (!fieldset.animating) { @@ -93,4 +95,30 @@ Drupal.behaviors.collapse = { } }; +/** + * Provide the source URL of the collapse and expand image. + * Override this in a theme to apply different images. + * + * Parameters: + * collapsed: true if collapsed, false if expanded + * + * Returns the src attribute for the image. + */ +Drupal.theme.prototype.collapseImageSrc = function(collapsed) { + return Drupal.settings.basePath + ((collapsed) ? 'misc/menu-collapsed.png' : 'misc/menu-expanded.png'); +} + +/** + * Construct the image for the collapse/expand link. + * + * Parameters: + * collapsed: true if collapsed, false if expanded + * + * Returns the HTML for the img element. + */ +Drupal.theme.prototype.collapseImage = function (collapsed) { + var alt = (collapsed) ? Drupal.t('Show') : Drupal.t('Hide'); + return '' + alt + ''; +}; + })(jQuery); Index: modules/system/system.css =================================================================== RCS file: /cvs/drupal/drupal/modules/system/system.css,v retrieving revision 1.63 diff -u -p -r1.63 system.css --- modules/system/system.css 21 Sep 2009 08:52:41 -0000 1.63 +++ modules/system/system.css 17 Oct 2009 03:59:58 -0000 @@ -326,10 +326,18 @@ html.js fieldset.collapsed legend { display: block; overflow: hidden; } -html.js fieldset.collapsible legend a { +/* Only display specific elements of collapsed fieldsets. */ +html.js fieldset.collapsible legend a, +html.js fieldset.collapsible legend a img, +html.js fieldset.collapsible legend a span { display: inline; - padding-left: 15px; /* LTR */ - background: url(../../misc/menu-expanded.png) 5px 75% no-repeat; /* LTR */ +} +html.js fieldset.collapsible legend a { + padding-left: 5px; /* LTR */ + text-decoration: none; +} +html.js fieldset.collapsible legend a span.collapser { + text-decoration: underline; } html.js fieldset.collapsible legend span.summary { display: inline; @@ -337,10 +345,6 @@ html.js fieldset.collapsible legend span color: #999; margin-left: 0.5em; } -html.js fieldset.collapsed legend a { - background-image: url(../../misc/menu-collapsed.png); /* LTR */ - background-position: 5px 50%; /* LTR */ -} /* Note: IE-only fix due to '* html' (breaks Konqueror otherwise). */ * html.js fieldset.collapsed legend, * html.js fieldset.collapsed legend *, Index: themes/garland/collapse.js =================================================================== RCS file: themes/garland/collapse.js diff -N themes/garland/collapse.js --- /dev/null 1 Jan 1970 00:00:00 -0000 +++ themes/garland/collapse.js 17 Oct 2009 03:59:58 -0000 @@ -0,0 +1,11 @@ +/** + * Override the default collapse and expand fieldset images. + * + * Parameters: + * collapsed: true if collapsed, false if expanded + * + * Returns the src attribute for the image. + */ +Drupal.theme.prototype.collapseImageSrc = function(collapsed) { + return Drupal.settings.basePath + 'themes/garland/images/' + ((collapsed) ? 'menu-collapsed.gif' : 'menu-expanded.gif'); +} Index: themes/garland/garland.info =================================================================== RCS file: /cvs/drupal/drupal/themes/garland/garland.info,v retrieving revision 1.8 diff -u -p -r1.8 garland.info --- themes/garland/garland.info 29 Sep 2009 16:30:29 -0000 1.8 +++ themes/garland/garland.info 17 Oct 2009 03:59:58 -0000 @@ -7,3 +7,4 @@ core = 7.x engine = phptemplate stylesheets[all][] = style.css stylesheets[print][] = print.css +scripts[] = collapse.js Index: themes/garland/style.css =================================================================== RCS file: /cvs/drupal/drupal/themes/garland/style.css,v retrieving revision 1.65 diff -u -p -r1.65 style.css --- themes/garland/style.css 5 Oct 2009 02:43:01 -0000 1.65 +++ themes/garland/style.css 17 Oct 2009 03:59:58 -0000 @@ -855,16 +855,15 @@ html.js fieldset.collapsed { } html.js fieldset.collapsible legend a { - padding-left: 2em; /* LTR */ - background: url(images/menu-expanded.gif) no-repeat 0% 50%; /* LTR */ + padding-left: 0; } -html.js fieldset.collapsible legend span.summary { - color: #898989; +html.js fieldset.collapsible legend a span.collapser { + padding-left: 0.8em; } -html.js fieldset.collapsed legend a { - background: url(images/menu-collapsed.gif) no-repeat 0% 50%; /* LTR */ +html.js fieldset.collapsible legend span.summary { + color: #898989; } /** Index: themes/seven/style.css =================================================================== RCS file: /cvs/drupal/drupal/themes/seven/style.css,v retrieving revision 1.19 diff -u -p -r1.19 style.css --- themes/seven/style.css 17 Oct 2009 01:15:40 -0000 1.19 +++ themes/seven/style.css 17 Oct 2009 03:59:58 -0000 @@ -460,10 +460,29 @@ html.js fieldset.collapsed legend, html.js fieldset.collapsed legend * { display: block; } + +html.js fieldset.collapsible legend a span.collapser { + display: inline; + text-decoration: none; +} + +html.js fieldset.collapsible legend a:hover span.collapser { + text-decoration: underline; +} + html.js fieldset.collapsed { border-width: 1px; margin-bottom: 10px; - padding: 13px; + padding: 13px 13px 13px 0px; +} + +html.js fieldset.collapsible > * { + padding-left: 13px; +} + +html.js fieldset.collapsible, +html.js fieldset.collapsible legend { + padding-left: 0; } fieldset fieldset {