chamilo-lms icon indicating copy to clipboard operation
chamilo-lms copied to clipboard

[C2] Improve handling of action bar icons/buttons

Open ywarnier opened this issue 10 months ago • 1 comments

In Chamilo 1, we have something called the "action bar", which is an horizontal bar on top of a tool homepage (usually on top of a list of elements in that tool), that allows you to take actions that are not specific to one element but relatively generic: create new item, upload new item, delete all items, view items in a different type of list, create a category for the item, etc.

You can see that in this examples for the documents tool:

Capture d’écran du 2024-04-23 09-22-24

In Chamilo 2, the action bar is less present, and it has been rebuilt, but there are some places where it has become a bit inconsistent, and we want consistency. For example, in the messages tool,

Capture d’écran du 2024-04-23 09-24-14

The icons on the top right side:

  • should be larger (they are currently in 16px format, they should be in 24px) (this is a global style, so there needs to be a new style or we need to change these items to use an existing 24px style for those)
  • should have a tooltip appearing with the text of the action they allow to do (the text is already there as a label most of the time but does not appear on hover, and it should always appear on hover)
  • should appear in "button" boxes, as they are all actions
  • should have the colours documented in https://github.com/chamilo/chamilo-lms/wiki/Graphical-design-guide#buttons

The buttons that appear slightly below (Inbox, Unread, Sent) should appear with the icons on the top right side, with 'Unread' being a button, and 'Inbox' and 'Sent' just being icons of some sort (maybe even tabs, and in this case they should appear aligned to the left), because they are links to another view, not actions.

ywarnier avatar Apr 23 '24 07:04 ywarnier

For the top right side, this is how it will look, is it right?

image

The buttons that appear slightly below (Inbox, Unread, Sent) should appear with the icons on the top right side, with 'Unread' being a button, and 'Inbox' and 'Sent' just being icons of some sort (maybe even tabs, and in this case they should appear aligned to the left), because they are links to another view, not actions.

I don't understand why Unread has to be a button. The behavior now is that Unread only show messages that are unread, as far as I understand is a filter like Inbox and Sent.

The element in the icons on top right is a toggle that allows to mark the selected messages as read or unread (a submenu is shown to select which action)

image

daniboygg avatar May 02 '24 12:05 daniboygg