Chill-project/chill-bundles
6
0
Fork 0
mirror of https://gitlab.com/Chill-Projet/chill-bundles.git synced 2025-06-07 18:44:08 +00:00
Code Issues Actions Projects Releases Wiki Activity

documentation of message to users

Browse Source
This commit is contained in:
Julien Fastré 2017-08-19 23:11:51 +02:00
parent b0ca01b2ec
commit a052dd7d7c
1 changed files with 79 additions and 21 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

100
source/development/messages-to-users.rst
View File

@ -6,8 +6,8 @@
A copy of the license is included in the section entitled "GNU A copy of the license is included in the section entitled "GNU
Free Documentation License". Free Documentation License".
Messages to users Messages to users, flashbags and buttons
****************** ****************************************
.. _flashbags : .. _flashbags :
@ -42,9 +42,9 @@ The four following levels are defined :
Buttons Buttons
======== ========
Four actions are available to decorate `a` links and `buttons`. Some actions are available to decorate ``a`` links and ``buttons``.
To add the action on button, use them as class along with `sc-button` : To add the action on button, use them as class along with ``sc-button`` :
.. code-block:: html .. code-block:: html
@ -52,20 +52,78 @@ To add the action on button, use them as class along with `sc-button` :
<button class="sc-button bt-submit" type="submit">Submit</button> <button class="sc-button bt-submit" type="submit">Submit</button>
+-----------+--------------+------------------------------------------------------------------------------+ +-----------+----------------+------------------------------------------------------------------------------+
| Action | Class | Description | | Action | Class | Description |
+===========+==============+==============================================================================+ +===========+================+==============================================================================+
| Submit | `bt-submit` | Submit a form. | | Submit | ``bt-submit`` | Submit a form. Use only if action is not "save". |
+-----------+--------------+------------------------------------------------------------------------------+ +-----------+----------------+------------------------------------------------------------------------------+
| Create | `bt-create` | Link to a form to create an entity | | Create | ``bt-create`` | - Link to a form to create an entity (alias: ``bt-new``) |
+-----------+--------------+------------------------------------------------------------------------------+ | | or ``bt-new`` | - Submitting this form will create a new entity |
| Reset | `bt-reset` | Reset a form | +-----------+----------------+------------------------------------------------------------------------------+
+-----------+--------------+------------------------------------------------------------------------------+ | Reset | ``bt-reset`` | Reset a form |
| Delete | `bt-delete` | Link to a form to delete an entity | +-----------+----------------+------------------------------------------------------------------------------+
+-----------+--------------+------------------------------------------------------------------------------+ | Delete | ``bt-delete`` | - Link to a form to delete an entity |
| Edit | `bt-edit` | Link to a form to edit an entity | | | | - Submitting this form will remove the entity |
+-----------+--------------+------------------------------------------------------------------------------+ +-----------+----------------+------------------------------------------------------------------------------+
| Update | `bt-update` | Submitting this form will update the entity | | Edit | ``bt-edit`` or | Link to a form to edit an entity |
+-----------+--------------+------------------------------------------------------------------------------+ | | ``bt-update`` | |
| Action | `bt-action` | Generic link to an action | +-----------+----------------+------------------------------------------------------------------------------+
+-----------+--------------+------------------------------------------------------------------------------+ | Save | ``bt-save`` | Submitting this form will save change on the entity |
+-----------+----------------+------------------------------------------------------------------------------+
| Action | ``bt-action`` | Generic link to an action |
+-----------+----------------+------------------------------------------------------------------------------+
| Cancel | ``bt-cancel`` | Cancel an action and go back to another page |
+-----------+----------------+------------------------------------------------------------------------------+
Styling buttons
---------------
Small buttons, mainly to use inline
.. code-block:: html
<p><a class="sc-button bt-create bt-small">You button</a></p>
You can omit content and show a button with an icon only :
.. code-block:: html
<a class="sc-button bt-create"></a>
You can hide content and show it only on hover
.. code-block:: html
<a class="sc-button bt-create has-hidden"><span class="show-on-hover">Showed when mouse pass on</span></a>
You can customize the icon :
.. code-block:: html
<a class="sc-button bt-create change-icon"><i class="fa fa-icon"></i>Button with custom icon</a>
Grouping buttons
----------------
Grouping buttons can be done using ``ul.record_actions`` element (an ``ul`` list with class ``record_actions``):
.. code-block:: html
<ul class="record_actions">
<li class="cancel">
<a class="sc-button bt-cancel">Cancel</a>
<li>
<li>
<a class="sc-button bt-save">Save</a>
</li>
</ul>
The element with the ``cancel`` class will be set in first position.
Inside table, the space between elements will be shorter.
You can add the class ``record_actions_small`` if you want shorter space between elements.