diff --git a/images/ui/button/Image.png b/images/ui/button/Image.png new file mode 100644 index 000000000..0592bd5b7 Binary files /dev/null and b/images/ui/button/Image.png differ diff --git a/images/ui/button/active_edit.png b/images/ui/button/active_edit.png index 1e6711e55..1f0a8f781 100644 Binary files a/images/ui/button/active_edit.png and b/images/ui/button/active_edit.png differ diff --git a/images/ui/button/active_edit_action.png b/images/ui/button/active_edit_action.png new file mode 100644 index 000000000..5a5c66021 Binary files /dev/null and b/images/ui/button/active_edit_action.png differ diff --git a/images/ui/button/active_edit_action_dark.png b/images/ui/button/active_edit_action_dark.png new file mode 100644 index 000000000..36680d451 Binary files /dev/null and b/images/ui/button/active_edit_action_dark.png differ diff --git a/images/ui/button/active_edit_dark.png b/images/ui/button/active_edit_dark.png new file mode 100644 index 000000000..774dbea75 Binary files /dev/null and b/images/ui/button/active_edit_dark.png differ diff --git a/images/ui/button/apply.png b/images/ui/button/apply.png new file mode 100644 index 000000000..4633d4d7c Binary files /dev/null and b/images/ui/button/apply.png differ diff --git a/images/ui/button/apply_dark.png b/images/ui/button/apply_dark.png new file mode 100644 index 000000000..79f88fffc Binary files /dev/null and b/images/ui/button/apply_dark.png differ diff --git a/images/ui/button/built-in_button.png b/images/ui/button/built-in_button.png new file mode 100644 index 000000000..81a73c82c Binary files /dev/null and b/images/ui/button/built-in_button.png differ diff --git a/images/ui/button/built-in_button_dark.png b/images/ui/button/built-in_button_dark.png new file mode 100644 index 000000000..aa6ee4254 Binary files /dev/null and b/images/ui/button/built-in_button_dark.png differ diff --git a/images/ui/button/built_in_button.png b/images/ui/button/built_in_button.png new file mode 100644 index 000000000..81a73c82c Binary files /dev/null and b/images/ui/button/built_in_button.png differ diff --git a/images/ui/button/built_in_button_dark.png b/images/ui/button/built_in_button_dark.png new file mode 100644 index 000000000..aa6ee4254 Binary files /dev/null and b/images/ui/button/built_in_button_dark.png differ diff --git a/images/ui/button/button_example.png b/images/ui/button/button_example.png index 533b2a7f8..bb4a1e86f 100644 Binary files a/images/ui/button/button_example.png and b/images/ui/button/button_example.png differ diff --git a/images/ui/button/button_example_dark.png b/images/ui/button/button_example_dark.png new file mode 100644 index 000000000..c2b73c268 Binary files /dev/null and b/images/ui/button/button_example_dark.png differ diff --git a/images/ui/button/buttons_with_ellipsis.png b/images/ui/button/buttons_with_ellipsis.png index 75dc00f54..93161f8c0 100644 Binary files a/images/ui/button/buttons_with_ellipsis.png and b/images/ui/button/buttons_with_ellipsis.png differ diff --git a/images/ui/button/buttons_with_ellipsis_dark.png b/images/ui/button/buttons_with_ellipsis_dark.png new file mode 100644 index 000000000..afb5430b9 Binary files /dev/null and b/images/ui/button/buttons_with_ellipsis_dark.png differ diff --git a/images/ui/button/cancel.png b/images/ui/button/cancel.png new file mode 100644 index 000000000..f92b701b6 Binary files /dev/null and b/images/ui/button/cancel.png differ diff --git a/images/ui/button/cancel_dark.png b/images/ui/button/cancel_dark.png new file mode 100644 index 000000000..1a68992d2 Binary files /dev/null and b/images/ui/button/cancel_dark.png differ diff --git a/images/ui/button/check_for_updates.png b/images/ui/button/check_for_updates.png index 3a58d327c..b56a7d207 100644 Binary files a/images/ui/button/check_for_updates.png and b/images/ui/button/check_for_updates.png differ diff --git a/images/ui/button/check_for_updates_dark.png b/images/ui/button/check_for_updates_dark.png new file mode 100644 index 000000000..07df2a709 Binary files /dev/null and b/images/ui/button/check_for_updates_dark.png differ diff --git a/images/ui/button/check_now.png b/images/ui/button/check_now.png deleted file mode 100644 index 6f0637de1..000000000 Binary files a/images/ui/button/check_now.png and /dev/null differ diff --git a/images/ui/button/check_now_button.png b/images/ui/button/check_now_button.png new file mode 100644 index 000000000..a0c676a24 Binary files /dev/null and b/images/ui/button/check_now_button.png differ diff --git a/images/ui/button/check_now_button_dark.png b/images/ui/button/check_now_button_dark.png new file mode 100644 index 000000000..2a5ad5618 Binary files /dev/null and b/images/ui/button/check_now_button_dark.png differ diff --git a/images/ui/button/close.png b/images/ui/button/close.png new file mode 100644 index 000000000..28bbd6694 Binary files /dev/null and b/images/ui/button/close.png differ diff --git a/images/ui/button/close_dark.png b/images/ui/button/close_dark.png new file mode 100644 index 000000000..910cb2542 Binary files /dev/null and b/images/ui/button/close_dark.png differ diff --git a/images/ui/button/default_OK.png b/images/ui/button/default_OK.png index cfb9ed44c..a01e2f433 100644 Binary files a/images/ui/button/default_OK.png and b/images/ui/button/default_OK.png differ diff --git a/images/ui/button/default_OK_dark.png b/images/ui/button/default_OK_dark.png new file mode 100644 index 000000000..7413d7456 Binary files /dev/null and b/images/ui/button/default_OK_dark.png differ diff --git a/images/ui/button/default_button.png b/images/ui/button/default_button.png new file mode 100644 index 000000000..55e3b0fac Binary files /dev/null and b/images/ui/button/default_button.png differ diff --git a/images/ui/button/default_button_dark.png b/images/ui/button/default_button_dark.png new file mode 100644 index 000000000..1dcdba21f Binary files /dev/null and b/images/ui/button/default_button_dark.png differ diff --git a/images/ui/button/default_button_save.png b/images/ui/button/default_button_save.png new file mode 100644 index 000000000..25689352e Binary files /dev/null and b/images/ui/button/default_button_save.png differ diff --git a/images/ui/button/default_button_save_dark.png b/images/ui/button/default_button_save_dark.png new file mode 100644 index 000000000..77a08da64 Binary files /dev/null and b/images/ui/button/default_button_save_dark.png differ diff --git a/images/ui/button/default_macos.png b/images/ui/button/default_macos.png new file mode 100644 index 000000000..3c9c7bd00 Binary files /dev/null and b/images/ui/button/default_macos.png differ diff --git a/images/ui/button/default_macos_dark.png b/images/ui/button/default_macos_dark.png new file mode 100644 index 000000000..d8b470ed2 Binary files /dev/null and b/images/ui/button/default_macos_dark.png differ diff --git a/images/ui/button/default_save.png b/images/ui/button/default_save.png index 7a7ce51e6..25689352e 100644 Binary files a/images/ui/button/default_save.png and b/images/ui/button/default_save.png differ diff --git a/images/ui/button/default_save_dark.png b/images/ui/button/default_save_dark.png new file mode 100644 index 000000000..77a08da64 Binary files /dev/null and b/images/ui/button/default_save_dark.png differ diff --git a/images/ui/button/default_windows.png b/images/ui/button/default_windows.png new file mode 100644 index 000000000..514be6f1e Binary files /dev/null and b/images/ui/button/default_windows.png differ diff --git a/images/ui/button/default_windows_dark.png b/images/ui/button/default_windows_dark.png new file mode 100644 index 000000000..df5faba4f Binary files /dev/null and b/images/ui/button/default_windows_dark.png differ diff --git a/images/ui/button/disabled_button.png b/images/ui/button/disabled_button.png new file mode 100644 index 000000000..a8aee9170 Binary files /dev/null and b/images/ui/button/disabled_button.png differ diff --git a/images/ui/button/disabled_button_dark.png b/images/ui/button/disabled_button_dark.png new file mode 100644 index 000000000..8ed00d94f Binary files /dev/null and b/images/ui/button/disabled_button_dark.png differ diff --git a/images/ui/button/focused_button.png b/images/ui/button/focused_button.png new file mode 100644 index 000000000..99ea0b077 Binary files /dev/null and b/images/ui/button/focused_button.png differ diff --git a/images/ui/button/focused_button_dark.png b/images/ui/button/focused_button_dark.png new file mode 100644 index 000000000..2b86c5c21 Binary files /dev/null and b/images/ui/button/focused_button_dark.png differ diff --git a/images/ui/button/help.png b/images/ui/button/help.png new file mode 100644 index 000000000..a6d48a7cc Binary files /dev/null and b/images/ui/button/help.png differ diff --git a/images/ui/button/help_dark.png b/images/ui/button/help_dark.png new file mode 100644 index 000000000..ce75caba0 Binary files /dev/null and b/images/ui/button/help_dark.png differ diff --git a/images/ui/button/hovered_button.png b/images/ui/button/hovered_button.png new file mode 100644 index 000000000..cf8108c12 Binary files /dev/null and b/images/ui/button/hovered_button.png differ diff --git a/images/ui/button/hovered_button_dark.png b/images/ui/button/hovered_button_dark.png new file mode 100644 index 000000000..1c81f1108 Binary files /dev/null and b/images/ui/button/hovered_button_dark.png differ diff --git a/images/ui/button/link_instead_of_button.png b/images/ui/button/link_instead_of_button.png new file mode 100644 index 000000000..849d508ea Binary files /dev/null and b/images/ui/button/link_instead_of_button.png differ diff --git a/images/ui/button/link_instead_of_button_dark.png b/images/ui/button/link_instead_of_button_dark.png new file mode 100644 index 000000000..d5cbd4cdd Binary files /dev/null and b/images/ui/button/link_instead_of_button_dark.png differ diff --git a/images/ui/button/merge_dialog.png b/images/ui/button/merge_dialog.png index 9e8367382..7443d7d64 100644 Binary files a/images/ui/button/merge_dialog.png and b/images/ui/button/merge_dialog.png differ diff --git a/images/ui/button/merge_dialog_dark.png b/images/ui/button/merge_dialog_dark.png new file mode 100644 index 000000000..7a6c7c110 Binary files /dev/null and b/images/ui/button/merge_dialog_dark.png differ diff --git a/images/ui/button/open_project_dialog.png b/images/ui/button/open_project_dialog.png index 72d6b6372..c830fc928 100644 Binary files a/images/ui/button/open_project_dialog.png and b/images/ui/button/open_project_dialog.png differ diff --git a/images/ui/button/open_project_dialog_dark.png b/images/ui/button/open_project_dialog_dark.png new file mode 100644 index 000000000..f26da70c4 Binary files /dev/null and b/images/ui/button/open_project_dialog_dark.png differ diff --git a/images/ui/button/open_project_dialog_incorrect.png b/images/ui/button/open_project_dialog_incorrect.png new file mode 100644 index 000000000..bdf8d0ea3 Binary files /dev/null and b/images/ui/button/open_project_dialog_incorrect.png differ diff --git a/images/ui/button/open_project_dialog_incorrect_dark.png b/images/ui/button/open_project_dialog_incorrect_dark.png new file mode 100644 index 000000000..f26da70c4 Binary files /dev/null and b/images/ui/button/open_project_dialog_incorrect_dark.png differ diff --git a/images/ui/button/split_button.png b/images/ui/button/split_button.png new file mode 100644 index 000000000..aa5001fb3 Binary files /dev/null and b/images/ui/button/split_button.png differ diff --git a/images/ui/button/split_button_dark.png b/images/ui/button/split_button_dark.png new file mode 100644 index 000000000..9a48bc182 Binary files /dev/null and b/images/ui/button/split_button_dark.png differ diff --git a/images/ui/button/toolbar_button.png b/images/ui/button/toolbar_button.png new file mode 100644 index 000000000..8b3e2be27 Binary files /dev/null and b/images/ui/button/toolbar_button.png differ diff --git a/images/ui/button/toolbar_button_dark.png b/images/ui/button/toolbar_button_dark.png new file mode 100644 index 000000000..1622b8572 Binary files /dev/null and b/images/ui/button/toolbar_button_dark.png differ diff --git a/images/ui/button/when_to_use_button.png b/images/ui/button/when_to_use_button.png new file mode 100644 index 000000000..d4ee1c960 Binary files /dev/null and b/images/ui/button/when_to_use_button.png differ diff --git a/images/ui/button/when_to_use_button_dark.png b/images/ui/button/when_to_use_button_dark.png new file mode 100644 index 000000000..5f04c20ec Binary files /dev/null and b/images/ui/button/when_to_use_button_dark.png differ diff --git a/topics/basics/plugin_required_experience.md b/topics/basics/plugin_required_experience.md index 520cc0b52..4e4944ceb 100644 --- a/topics/basics/plugin_required_experience.md +++ b/topics/basics/plugin_required_experience.md @@ -2,7 +2,7 @@ # Required Experience -Required technology knowledge. +Required technology knowledge. The IntelliJ Platform is a JVM application, implemented mostly in Java and [Kotlin](https://kotlinlang.org). At this time, it's not possible to develop plugins for the IntelliJ Platform in non-JVM languages. @@ -20,4 +20,4 @@ Developing a plugin will sometimes require digging into the [IntelliJ Platform c It's highly recommended to get familiar with the [](explore_api.md) section before you start the plugin implementation. - + diff --git a/topics/ui/controls/button.topic b/topics/ui/controls/button.topic index 5aa763e91..cc8bca3b9 100644 --- a/topics/ui/controls/button.topic +++ b/topics/ui/controls/button.topic @@ -9,263 +9,208 @@

- Implementation: - JButton + Implementation: + JButton +

+

+ Specification: Button +

- Cancel and Save buttons + Cancel and Save buttons - - - Use a button to invoke an immediate action. - - - - -

Use a link instead a button if:

- -
  • -

    The action takes the user to another page of the same dialog or an external source like - documentation:

    - The 'Manage scopes' button next to a combo box -

    - The Manage scope link takes to another page of the Settings dialog. -

    -

    - Exception: Next and Previous buttons in wizard navigation. -

    -
    • -
  • -

    - The command is a secondary action that is not related to the primary purpose of the window, - and the space is constrained. -

    - - - - - - - - - -
    -

    - Incorrect -

    -     		-

    - Correct -

    -
    - A 'Configure...' button next to a checkbox - - A 'Configure' link next to a checkbox -
    -
    • -     -     - -

    Use toolbar buttons instead if there are several buttons related to a table or list:

    - +

    Use a button to invoke an immediate action:

    + When to use a button + + +
    - - + - + - -
    -

    - Incorrect -

    -     		-

    - Correct -

    +     		Using links instead of buttons

    Use a link instead if:

    + +

  • The action takes the user to another page of the same dialog or an external source like + documentation.

    + Exception: the Next and Previous buttons in wizard navigation. +
    • +
  • + The command is a secondary action that isn't related to the primary purpose of the window, + and the space is constrained. +
    • +
    - Many regular buttons in a single place + Using toolbar buttons instead of buttons

    Use a toolbar button instead if there are several buttons related to a table or list.

    		Toolbar buttons
    -     - -

    Use a split button instead if:

    - -
  • There are several related actions (more than 2), but the space is limited and/or packed.
    • -
  • The action is not common and is dangerous, for example, can destroy user data and cannot be easily - undone. -
    • -     -

    Use a built-in button instead if it's related to an input field, combo box, - search field.

    -     -     - + + Using split buttons instead of buttons +

    Use a split button instead if:

    + +
  • There are more than two related actions, but the space is limited and/or packed.
    • +
  • The action isn't common and is dangerous, for example, can destroy user data and cannot be easily + undone. +
    • +     + + + + + Using built-in buttons instead of buttons + +

    Use a built-in button instead if it's related to an input field, combo box, + search field.

    + + + + -

    The label displays the action the button performs.

    - -

    Write the label as an imperative verb, e.g. Save, Print, Cancel. Use title capitalization.

    -

    Exceptions: standard buttons like OK, Back/Forward, Previous/Next, Yes/No, Agree, Options, Settings, Details. -

    + +

    Use title capitalization for button labels.

     - + +

    Write the label as an imperative verb, for example, Save, Print, Cancel. Use title capitalization.

    +

    Exceptions: standard buttons like OK, Back/Forward, + Previous/Next, Yes/No, Agree, + Options, Settings, Details. +

    +     +

    The button should answer the question in the title, so the user can skip the description. Prefer specific labels over generic ones:

    - - - - - - - - - -
    -

    - Incorrect -

    -     		-

    - Correct -

    -
    An incorrect button with a generic 'OK' label -

    Unclear what happens on the click.

    		A correct button with a clear 'Save' label -

    The label indicates what happens on the click.

    - - Exception: the Cancel button if it is clear what action is being canceled. - For example, use the - Cancel - button, not the - Don’t Create - button. - -     - -

    The label should be short, not more than 5 words. If it’s not obvious what element the button is related - to, add more - words to make it clear. Prefer clear labels to short:

    - - - - - - - - - -
    -

    - Acceptable -

    -     		-

    - Better -

    -
    - A button with 'Edit...' label - - A button with 'Edit Action Icon...' label -
    -     - -

    - Add an ellipsis if additional actions such as adding more info or confirming the action are required: - Buttons with ellipsis -

    -

    Do - not - add ellipsis if another window is opened, but no more input from the user is required. For example, - About, Details. -

    -

    Do not - use the word - Now - in the label because buttons always trigger an immediate action: -

    - - - - - - - - - - -
    -

    - Incorrect -

    -     		-

    - Better -

    -
    A button with 'Check Now' label - A button with 'Check for Updates' label -
    -     -     -     - - - - + + + +
    - 'Save' button on macOS

    - macOS + Correct

    		- 'Save' button on Windows

    - Windows + Incorrect

    A correct button with a clear 'Save' labelAn incorrect button with a generic 'OK' label
    - The default button confirms the main purpose of a dialog. It is triggered by pressing - Enter - or - Ctrl+Enter - on Windows/Linux and - Enter - or - Cmd+Enter - on macOS. - Exception: If the focus is on an element that uses the - Enter - key (e.g., a text area), the default button is triggered only by - Ctrl+Enter - on Windows/Linux and - Cmd+Enter - on macOS. -

    The default button should always be present in a dialog. Only one button in a dialog can be the default - one.

    -

    If the action is dangerous, e.g., can lead to data loss, provide an easy way to undo the command.

    -

    If it's not possible to undo the action, make a secondary button the default one: + + Exception: the Cancel button if it's clear what action is being canceled. + For example, use + Cancel instead of Don’t Create. + +

    Do not + use the word + Now in labels because buttons always trigger an immediate action: +

    + + + + + + + + + +
    +

    + Correct +

    +     		+

    + Incorrect +

    +
    + A button with 'Check for Updates' label + A button with 'Check Now' label
    +     + +

    The label should be short, not more than five words. If it’s not obvious what element the button is related + to, add more + words to make it clear. Prefer clear labels to short ones:

    + + + + + + + + + + +
    +

    + Correct +

    +     		+

    + Acceptable +

    +
    A button with the 'Edit Action Icon...' labelA button with 'Edit...' label
    +     + + +
  • Add an ellipsis if additional actions such as adding more info or confirming the action are required. +
    • +
  • Don't add an ellipsis if another window is opened, but no more input from the user is required. For example, + About, Details.
    • +     + Buttons with ellipsis +     +     + + + + + + Default button on macOS and Windows + +
  • The default button confirms the main purpose of a dialog. It is triggered by pressing + Enter + or + Ctrl+Enter + on Windows/Linux and + Enter + or + Cmd+Enter + on macOS. + Exception: if the focus is on an element that uses the + Enter + key, for example, a text area, the default button is triggered only by + Ctrl+Enter + on Windows/Linux and + Cmd+Enter + on macOS. +
    • +
  • The default button should always be present in a dialog. Only one button in a dialog can be the default + one. +
    • +
  • If an action is dangerous, for example, it can lead to data loss, provide an easy way to undo the command.
    • +
  • If it's not possible to undo the action, make a secondary button the default one: A dialog with secondary and primary buttons -

    + width="706"/> +
    • +     - 'Cancel' button in a focused state + 'Cancel' button in a focused state

    All buttons can get focus, even on macOS if the Full Keyboard Access option is disabled in Preferences > Keyboard > @@ -278,26 +223,18 @@

  • A focused button is invoked by pressing - Space - . Focused and default buttons are - independent - , + Space. Focused and default buttons are + independent, so when the focus moves from one button to another, the default button does not change.

  • - Make the second most popular button in the dialog focused. - For example, the - New Window - button in the - Open Project - dialog: - A dialog with buttons: 'New Window' (focused), 'Cancel', and 'This Window' (default). + Make the second most popular button in the dialog focused.It’s recommended to have one default and one focused button, so that most of the actions can be + triggered using + the keyboard. +

  • @@ -305,21 +242,21 @@ triggered using the keyboard.

    - Incorrect + Correct + A dialog with buttons: 'New Window' (focused), 'Cancel', and 'This Window' (default). + +

    +

    + Incorrect

    A dialog with buttons: 'New Window', 'Cancel', and 'This Window' (default and focused). - - The - This Window - button is the default and the focused one, while it’s - better to place the focus on the - New Window - button, so that the user can - access both options using the keyboard. - + width="706"/> +
    • @@ -329,14 +266,13 @@ Enter or Space - . If non-default + . If a non-default button gets focus, the default button is invoked using - Ctrl+Enter - . - Ctrl+Enter. + +

    On pressing the Tab key, the New Window @@ -348,11 +284,10 @@ The original This Window button is triggered with - Ctrl+Enter - . - - If the focus moves to a control that’s not a button, the original default button is triggered by - Enter. + Ctrl+Enter.

    +

    + If the focus moves to the control that’s not a button, the original default button is triggered by + Enter.

    @@ -361,43 +296,39 @@ - Disabled 'Cancel' button + Disabled button

    Disable a button if:

  • It’s an - Apply + Apply button and no changes have been made in this dialog.
  • The control to which the button is related is disabled.
  • Not all required fields in the dialog are filled.
    • -

    Other common buttons are described below. They can be regular or default buttons.

    +

    Other standard buttons are described below. They can be regular or default buttons.

     +

    On hovering over a button, show a tooltip with the shortcut and the action name if it can be clarified. For more details, see Context help.

    - +
    - - @@ -405,64 +336,104 @@ - -

    The - Cancel - button reverts the app to the state before the dialog was invoked, and works equivalent to the - - Esc - - key on Win and Linux, and - Esc - or - Cmd+Period - on macOS. - If a confirmation button is present in a dialog, e.g., - OK - or - Save - , it’s recommended to have a button that cancels the - dialog, e.g., - Cancel - , - Continue Editing - , etc. -

    -     -

    Use the Apply button in dialogs with many settings that affect how data is displayed. The Apply button - allows you to - save and preview the effect of the selected options, and continue changing the settings, for example, - change a scheme in - Settings.

    +
    - A 'Replace' button with a shortcut in hover tooltip -

    - If the action is clear, show the shortcut only. -

    +     		+ Hovered buttons + - 'Replace' button with an action name and a shortcut in hover tooltip + +

    If the action is clear, show the shortcut only. +

    - If the action can be clarified, show the action name and the shortcut. + If the action can be clarified, show the action name and the shortcut.

    + + + + +
    + Hovered buttons + + +

    Use the Apply button in dialogs with many settings that affect how data is displayed. The + Apply button + allows you to + save and preview the effect of the selected options and continue changing the settings, for example, + change a scheme in + settings.

    +
    +     + + + + + + +
    + Hovered buttons + + +

    The + Cancel + button reverts the app to the state before the dialog was invoked, and works as an equivalent to the + + Esc + + key on Windows and Linux, and + Esc + or + Cmd+Period + on macOS. + If a confirmation button is present in a dialog, for example, + OK + or + Save + , it’s recommended to have a button that cancels the + dialog, for example, + Cancel + , + Continue Editing + , and so on. +

    +
    + +     + + + + + + + +
    + Hovered buttons + + +

    Use the + Close + label only if nothing can be changed in the dialog and there is no confirmation button, for example, in + the + Help | My Productivity + dialog. + In all other cases, use the + Cancel + button. +

    +

    Do not + add an icon to the button. The main purpose of an icon is to quickly find a familiar action in a packed + toolbar or menu. Usually, no more than 3 buttons are placed nearby, their labels can be scanned quickly, + and icons are not required. +

    +
    -

    The help button appears in the bottom-left corner of a dialog and shows help in a tooltip on hover, or - opens a help - dialog when clicking it. For more details, see Context help. -
    - A question mark in the circle button

    -     - -

    Use the - Close - label only if nothing can be changed in the dialog and there is no confirmation button, for example, in - the - Help | My Productivity - dialog. - In all other cases, use the - Cancel - button. -

    -

    Do - not - add an icon to the button. The main purpose of an icon is to quickly find a familiar action in a packed - toolbar or menu. Usually, no more than 3 buttons are placed nearby, their labels can be scanned quickly, - and icons are not required. -

    + + + + + +
    + Hovered buttons + + +

    The help button appears in the bottom-left corner of a dialog and shows help in a tooltip on hover, or + opens a help + dialog when clicking it. For more details, see Context help.

    +
    - + - - + –> +     -->