winter/modules/system/assets/ui/less/button.less

//
// Dependencies
// --------------------------------------------------

@import "global.less";

//
// Buttons
// --------------------------------------------------

@import "button.base.less";
@import "button.groups.less";

//
// Buttons
// --------------------------------------------------

.btn {
    font-size: @font-size-base - 1;
    text-align: left;
    outline: none !important;

    &[class^="oc-icon-"],
    &[class*=" oc-icon-"] {
        &:before {
            font-size: 14px;
            line-height: 14px;
            position: relative;
            opacity: .5;
        }

        &.on,
        &:hover,
        &:focus,
        &.focus {
            &:before {
                opacity: 1;
            }
        }
    }

    &[disabled] {
        color: rgba(255,255,255,.6);
    }

    &.active,
    &:active {
        .box-shadow(inset 0 1px 0 rgba(0,0,0,.3));
    }
}

.btn-secondary {
    text-shadow: 0 1px 0 rgba(255,255,255,.8);

    &[disabled] {
        color: rgba(0,0,0,.6);
    }
}

.btn-link {
    .box-shadow(none) !important;
    text-shadow: none !important;
}

.btn-group {
    .btn {
        border-right: 1px solid rgba(0,0,0,0.09);
        margin-left: 0 !important;

        &:last-child, &.last {
            border-right: none;
        }

        &.last {
            .border-right-radius(@border-radius-base) !important;
        }
    }

    > .dropdown {
        float: left;

        &:not(:last-child, .last) > .btn {
            border-right: 1px solid rgba(0,0,0,0.09);
            .border-right-radius(0) !important;
        }

        &:not(:first-child) > .btn {
            .border-left-radius(0) !important;
        }

        &.last {
            .btn {
                border-right: none;
            }
        }
    }
}

.btn, .btn-group {
    &.offset-right {
        margin-right: 10px;
    }
}

.btn-icon {
    display: inline-block;
    height: 36px;
    font-size: 21px;
    background: transparent;
    border: none;
    outline: none;

    &:before {
        display: block;
        color: @color-icon-btn-default;
    }

    &:hover:before {
        color: @link-color;
    }

    &.danger:hover:before {
        color: @color-btn-danger;
    }

    &.pull-right:before {
        margin-right: 0;
    }

    &.margin-left {
        margin-left: 5px;
    }

    &.small {
        font-size: 17px;
        height: 17px;
        line-height: 15px;
    }

    &.larger {
        font-size: 21px;
        height: 21px;
        line-height: 17px;
    }
}

.btn-text {
    font-size: @font-size-base;
    padding: 8px 0;
    vertical-align: middle;
    display: inline-block;
    color: @btn-default-bg;

    a {
        color: @btn-default-bg;
        text-decoration: underline;

        &:hover {
            color: @link-color;
        }
    }
}