diff --git a/wysiwyg.admin.css b/wysiwyg.admin.css index d39d118..1f4d480 100644 --- a/wysiwyg.admin.css +++ b/wysiwyg.admin.css @@ -37,7 +37,11 @@ top: 0.2em; left: 0.2em; } -#toolbar-available-buttons { +#toolbar-description { + margin-top: 1em; + margin-bottom: 1em; +} +#toolbar-available-buttons, #toolbar-active-buttons { border: 1px dashed silver; padding: 0.5em; margin-bottom: 1em; diff --git a/wysiwyg.admin.js b/wysiwyg.admin.js index 6b0d496..9d3273b 100644 --- a/wysiwyg.admin.js +++ b/wysiwyg.admin.js @@ -222,16 +222,22 @@ Drupal.behaviors.wysiwygToolbarDesigner = { }; Drupal.theme.prototype.toolbar_designer = function (settings) { + var available = Drupal.t('Available buttons'); + var active = Drupal.t('Active buttons'); var markup = '
'; - markup += '
'; + markup += '' + + '
' + + Drupal.t('Use the !plus buttons to add a new row to the %active area or to add a button group within a row. Drag any buttons you need from the %available area into a button group. Drag any item back to the %available2 area to remove it from the toolbar layout.', + {'!plus': ' ', '%available': available, '%active': active, '%available2': available}) + + '
'; + markup += '
'; for (var button_name in settings.buttons) { var button = settings.buttons[button_name]; markup += '' + Drupal.checkPlain(button.title) + ''; } - markup += '
' - + '
' + Drupal.t('Drag any buttons you need from the area above into the toolbar layout below. Drag any item back to the area above to remove them from the toolbar layout.') + '
' + markup += '
' + '
' + '