Lists

Lists are a continuous group of text or images.

Unordered List Styles

Classic Daniel List.

<ul class="daniel_list">
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
</ul>

Styled Unordered List. In this case, just add the daniel_styled classname.

<ul class="daniel_list daniel_styled">
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
</ul>

Ordered List

Classic Daniel Ordered List

<ol class="daniel_list">
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
</ol>

Styled Ordered List. In this case, add the daniel_styled classname.

<ol class="daniel_list daniel_styled">
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
    <li>Unordered List Item</li>
</ol>

Lined Lists

See examples of unordered and ordered lined lists below.

<ul class="daniel_list daniel_styled daniel_lined d-flex flex-column gap-1">
    <li class="d-flex flex-column gap-2">
        <h5 class="m-0">Univercity of Boston, Computer Science</h5>
        <span>2010 - 2016</span>
        <p class="m-0">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna</p>
    </li>
    <li class="d-flex flex-column gap-2">
        <h5 class="m-0">Univercity of Boston, Computer Science</h5>
        <span>2010 - 2016</span>
        <p class="m-0">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna</p>
    </li>
</ul>

<ol class="daniel_list daniel_styled daniel_lined d-flex flex-column gap-1">
    <li class="d-flex flex-column gap-2">
        <h5 class="m-0">Univercity of Boston, Computer Science</h5>
        <span>2010 - 2016</span>
        <p class="m-0">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna</p>
    </li>
    <li class="d-flex flex-column gap-2">
        <h5 class="m-0">Univercity of Boston, Computer Science</h5>
        <span>2010 - 2016</span>
        <p class="m-0">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna</p>
    </li>
</ol>