Contents

/**
 * @copyright   2010-2013, The Titon Project
 * @license     http://opensource.org/licenses/bsd-license.php
 * @link        http://titon.io
 */

@import "../common";

/**
 *    <nav class="pagination small pill">
 *        <ul>
 *            <li><a href="" class="button">Previous</a></li>
 *            <li><a href="" class="button">1</a></li>
 *            <li><a href="" class="button">2</a></li>
 *            <li class="active"><a href="" class="button">3</a></li>
 *            <li><a href="" class="button">4</a></li>
 *            <li><a href="" class="button">5</a></li>
 *            <li class="disabled"><a href="" class="button">Next</a></li>
 *        </ul>
 *    </nav>
 */

.pagination {
    display: block;
    margin: $margin 0;

    ul,
    li {
        @include reset-inline-block;
        list-style: none;
    }

    li {
        float: left;
        margin-right: $padding / 2;

        .button {
            float: left;
        }

        &.is-active {
            z-index: 1;
        }
    }

    @include clear-fix;
}

//-------------------- Modifiers --------------------//

.pagination.pagination--grouped {
    li {
        margin-left: -1px;
        margin-right: 0;

        &:first-child { margin-left: 0; }
        &:hover,
        .button:hover { z-index: 1; }

        .button {
            margin: 0;
            border-radius: 0;
        }
    }

    &.round {
        ul {
            border-radius: $round;
        }

        li:first-child .button {
            border-top-left-radius: $round;
            border-bottom-left-radius: $round;
        }

        li:last-child .button {
            border-top-right-radius: $round;
            border-bottom-right-radius: $round;
        }
    }
}

Version data entries

2 entries across 2 versions & 1 rubygems

Version	Path
titon-toolkit-0.14.0	scss/toolkit/ui/pagination.scss
titon-toolkit-0.13.2	scss/toolkit/ui/pagination.scss