Index: misc/collapse.js =================================================================== RCS file: /cvs/drupal/drupal/misc/collapse.js,v retrieving revision 1.23 diff -u -p -r1.23 collapse.js --- misc/collapse.js 27 Apr 2009 20:19:35 -0000 1.23 +++ misc/collapse.js 30 Aug 2009 22:11:36 -0000 @@ -10,6 +10,7 @@ Drupal.toggleFieldset = function (fields // that alters the default submit button behavior. var content = $('> div:not(.action)', fieldset); $(fieldset).removeClass('collapsed'); + $('> legend > a > img', fieldset).replaceWith(Drupal.theme('collapseImage', false)); content.hide(); content.slideDown({ duration: 'fast', @@ -29,6 +30,7 @@ Drupal.toggleFieldset = function (fields $('div.action', fieldset).hide(); 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; }); } @@ -71,7 +73,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) { @@ -88,4 +90,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.61 diff -u -p -r1.61 system.css --- modules/system/system.css 24 Aug 2009 03:11:34 -0000 1.61 +++ modules/system/system.css 30 Aug 2009 22:11:36 -0000 @@ -323,10 +323,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; @@ -334,10 +342,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 30 Aug 2009 22:11:36 -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.7 diff -u -p -r1.7 garland.info --- themes/garland/garland.info 11 Aug 2009 12:27:37 -0000 1.7 +++ themes/garland/garland.info 30 Aug 2009 22:11:36 -0000 @@ -6,3 +6,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.63 diff -u -p -r1.63 style.css --- themes/garland/style.css 17 Aug 2009 19:05:26 -0000 1.63 +++ themes/garland/style.css 30 Aug 2009 22:11:36 -0000 @@ -859,16 +859,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.15 diff -u -p -r1.15 style.css --- themes/seven/style.css 27 Aug 2009 20:33:05 -0000 1.15 +++ themes/seven/style.css 30 Aug 2009 22:11:36 -0000 @@ -457,10 +457,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 {