Contents

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

@import "../common";

//-------------------- Gloss --------------------//

.#{$vendor-prefix}visual-gloss {
    &:after {
        content: "";
        position: absolute;
        width: 100%;
        height: 60%;
        top: 1%;
        left: 0;
        border-radius: 0 0 2rem 2rem / 0 0 1rem 1rem;
        @include background-image(linear-gradient(left, white(.3) 0%, white(0) 50%, white(.3) 100%));
    }

    &.round:after {
        border-radius: .2rem .2rem 2rem 2rem / .5rem .5rem 1rem 1rem;
        width: 98%;
        left: 1.5%;
    }
}

//-------------------- Reflection --------------------//

.#{$vendor-prefix}visual-reflect:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 50%;
    top: 0;
    left: 0;
    @include background-image(linear-gradient(top, white(0), white(.3)));
}

//-------------------- Glare --------------------//

.#{$vendor-prefix}visual-glare:after {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    @include background-image(linear-gradient(160deg, white(.5) 0%, white(.1) 50%, white(0) 50%, white(.3) 100%));
}

//-------------------- Popout --------------------//

.#{$vendor-prefix}visual-popout {
    box-shadow: 0 6px 0 0 black(.25) !important;
    top: -3px;

    &:active {
        box-shadow: 0 3px 0 0 black(.5) !important;
        top: 0;
    }
}

Version data entries

4 entries across 4 versions & 1 rubygems

Version	Path
titon-toolkit-1.0.5	scss/toolkit/effects/visual.scss
titon-toolkit-1.0.4	scss/toolkit/effects/visual.scss
titon-toolkit-1.0.2	scss/toolkit/effects/visual.scss
titon-toolkit-1.0.1	scss/toolkit/effects/visual.scss