Odometer

Odometer Example

A basic number total component, provides feedback of total cars available on a search result. The numbers update when a user changes filters within the search.
<div class="c-odometer | t-odometer--default">
    <div class="c-odometer__digit-wrapper">
        <ol class="c-odometer__digits | o-list-stacked">
            <li class="o-list__item">
                0
            </li>
            <li class="o-list__item">
                1
            </li>
            <li class="o-list__item">
                2
            </li>
            <li class="o-list__item">
                3
            </li>
            <li class="o-list__item">
                4
            </li>
            <li class="o-list__item">
                5
            </li>
            <li class="o-list__item">
                6
            </li>
            <li class="o-list__item">
                7
            </li>
            <li class="o-list__item">
                8
            </li>
            <li class="o-list__item">
                9
            </li>
        </ol>
    </div>
    <div class="c-odometer__digit-wrapper">
        <ol class="c-odometer__digits c-digit-1 | o-list-stacked">
            <li class="o-list__item">
                0
            </li>
            <li class="o-list__item">
                1
            </li>
            <li class="o-list__item">
                2
            </li>
            <li class="o-list__item">
                3
            </li>
            <li class="o-list__item">
                4
            </li>
            <li class="o-list__item">
                5
            </li>
            <li class="o-list__item">
                6
            </li>
            <li class="o-list__item">
                7
            </li>
            <li class="o-list__item">
                8
            </li>
            <li class="o-list__item">
                9
            </li>
        </ol>
    </div>
    <div class="c-odometer__digit-wrapper">
        <ol class="c-odometer__digits c-digit-2 | o-list-stacked">
            <li class="o-list__item">
                0
            </li>
            <li class="o-list__item">
                1
            </li>
            <li class="o-list__item">
                2
            </li>
            <li class="o-list__item">
                3
            </li>
            <li class="o-list__item">
                4
            </li>
            <li class="o-list__item">
                5
            </li>
            <li class="o-list__item">
                6
            </li>
            <li class="o-list__item">
                7
            </li>
            <li class="o-list__item">
                8
            </li>
            <li class="o-list__item">
                9
            </li>
        </ol>
    </div>
    <div class="c-odometer__digit-wrapper">
        <ol class="c-odometer__digits c-digit-3 | o-list-stacked">
            <li class="o-list__item">
                0
            </li>
            <li class="o-list__item">
                1
            </li>
            <li class="o-list__item">
                2
            </li>
            <li class="o-list__item">
                3
            </li>
            <li class="o-list__item">
                4
            </li>
            <li class="o-list__item">
                5
            </li>
            <li class="o-list__item">
                6
            </li>
            <li class="o-list__item">
                7
            </li>
            <li class="o-list__item">
                8
            </li>
            <li class="o-list__item">
                9
            </li>
        </ol>
    </div>
</div>