List

Lists are very useful when you want to group some elements.

Kodhus supports a general layout for list that can be modified to achieve different usecases.

Let's take a look at Kodhus library's list layout.

<div class="cdt-list">
    <header>
        List header (Optional)
    </header>
    <ul>
        <li>
        <div class="cdt-list-item">
            <span class="avatar">
            Avatar (Optional)
            </span>
            <div class="item">
            list item
            </div>
            <div class="extra">Extra (Optional)</div>
        </div>
        </li>
    </ul>
</div>
          
        

Examples

You can use lists for general purpose vertical menus and also lists in preferences or list of peoples/events, etc.

Let's take a look at some of the examples

Vertical menu with icons
Settings/Pereferences page
List of profiles