# Dashboard

### Infobox

- Little stat and info boxes which consist of `.infobox-icon` and `.infobox-data` and optional `.stat` arrows or `.badges`
  32
  comments
  8%

           32
           comments

        8%

- Infobox colors are:
  1. `.infobox-purple`
  2. `.infobox-purple2`
  3. `.infobox-pink`
  4. `.infobox-blue`
  5. `.infobox-blue2`
  6. `.infobox-blue3`
  7. `.infobox-red`
  8. `.infobox-brown`
  9. `.infobox-wood`
  10. `.infobox-light-brown`
  11. `.infobox-orange`
  12. `.infobox-orange2`
  13. `.infobox-green`
  14. `.infobox-green2`
  15. `.infobox-grey`
  16. `.infobox-black`

- Use `.infobox-dark` class for dark style:

- Using `.infobox-small` class makes it smaller:

- You can use `.badge` or `.stat` elements inside infobox:

       ...
       +32%

  See badge section for more info about badegs

       ...
       4%

  `.stat` can have `.stat-success` & `.stat-important` classes
- When using Sparkline plugin wrap it inside a `.infobox-chart`:

            6,251
            pageviews

- When using Easy pie chart plugin wrap it inside a `.infobox-progress`:

               42%

            traffic used
            ~ 58GB remaining

### Conversation List

- Conversations are inside a `.dialogs` element and each item is a `.itemdiv.dialogdiv`:

- Each item has several optional parts, such as `.body` `.user` `.time` `.tools` etc:

             2 min

               name

            message text

- For more info please see
  `mustache/app/views/pages/partials/index/conversations.mustache`

### Task List

- Task list is an `.item-list` which contains several items with different border colors:

         ...
         ...

- Available colors are:
  1. `.item-orange`
  2. `.item-orange2`
  3. `.item-red`
  4. `.item-red2`
  5. `.item-green`
  6. `.item-green2`
  7. `.item-blue`
  8. `.item-blue2`
  9. `.item-blue3`
  10. `.item-pink`
  11. `.item-purple`
  12. `.item-black`
  13. `.item-grey`
  14. `.item-brown`
  15. `.item-default`
- For more info please see
  `mustache/app/views/pages/partials/index/tasks.mustache`

### Member List

- Member list is a `.clearfix` container with several `.itemdiv.memberdiv` items:

          ....

- Each item has several parts such as `.user` `.body`, etc :

          Name
           20 min

- For more info please see
  `mustache/app/views/pages/partials/index/members.mustache`

### Comment List

- Comments are inside `.comments` container with several `.itemdiv.commentdiv` items:

         ...

- Each item has several parts such as `.user` `.body` `.text`, etc:

              Bob Doe
               6 min

                  comment text

- For more info please see
  `mustache/app/views/pages/partials/index/comments.mustache`