mirror of
https://github.com/Graylog2/graylog2-server.git
synced 2026-03-13 09:32:21 +08:00
20 lines
1.7 KiB
Markdown
20 lines
1.7 KiB
Markdown
## Form & Modal Submit Buttons
|
|
|
|
- Rely on the shared components `FormSubmit` and `ModalSubmit` to implement the submit and cancel button.
|
|
The `FormSubmit` can be used for all forms on pages. The `ModalSubmit` can be used for modals and similar element like
|
|
popovers or the login dialog.
|
|
- Make sure to follow the placements defined by these shared components. Currently:
|
|
- submit buttons in form are vertically aligned with the inputs. The cancel button is being placed after the submit button.
|
|
- submit buttons in modals are always placed in the right bottom corner. The cancel button is being placed before the submit button.
|
|
- When defining a name for the submit button
|
|
- Instead of `Save` or `Ok` use a meaningful name for the submit button like `Create stream`.
|
|
- Make sure to write only the first letter uppercase and all other letter lowercase.
|
|
- Always use `Cancel` for the cancel button name.
|
|
|
|
## `EmptyEntity` & `NoEntitiesExist` & `NoSearchResults` components
|
|
|
|
- These three components are closely related and maybe confusing to decide which one to use for which situation.
|
|
- `EmptyEntity` should be used to display a message for an entity that does not have any entries in the database yet. This components supports displaying a message explaining what the entity is and can also support including a button link to create one via the children props
|
|
- `NoEntitiesExist` is similar to `EmptyEntity` except it is a more generic message without including the option to create a new one
|
|
- `NoSearchResults` should be used in the case when a search is performed with a query and the result is no matching entries. This component should inform the user that entities still exist, just that none match the current filter.
|