Viewing File: /usr/local/cpanel/share/libraries/base_styles/src/buttons.less

/*
# buttons.less                                       Copyright 2022 cPanel, L.L.C.
#                                                           All rights reserved.
# copyright@cpanel.net                                         http://cpanel.net
# This code is subject to the cPanel license. Unauthorized copying is prohibited
*/

@import (reference) "variables.less";

/* ------------------------------------------------------------------------------ */
/* Buttons
/* ------------------------------------------------------------------------------ */

.btn {
    border-radius: @border-radius;
}

.btn-primary,
.btn-default {
    cursor: pointer;
    overflow: hidden;
    transition: all 0.3s ease-out 0s;
    vertical-align: middle;
    z-index: 1;
}

.btn-primary {
    color: @btn-primary-color;
    text-align: center;
    background: @btn-primary-bg;
    border: 1px solid @btn-primary-border;
    cursor: pointer;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16),
        0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

.btn-primary:focus {
    background-color: @btn-primary-focus-bg;
    color: @btn-primary-focus-color;
}

.btn-primary:hover {
    color: @btn-primary-hover-color;
    background-color: @btn-primary-hover-bg;
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.18),
        0 4px 15px 0 rgba(0, 0, 0, 0.15);
}

.btn-primary:active,
.btn-primary.active {
    background-color: @btn-primary-active-bg;
    border-color: @btn-primary-active-border;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 rgba(0, 0, 0, 0);
}

.btn-primary[disabled],
.btn-primary[disabled]:hover,
.btn-primary[disabled]:focus,
.btn-primary[disabled]:active,
.btn-primary[disabled].active {
    cursor: not-allowed;
    opacity: 0.65;
    color: @btn-primary-color;
    text-align: center;
    background: @btn-primary-bg;
    border: 1px solid @btn-primary-border;
    box-shadow: none;
}

.btn-default {
    color: @btn-default-color;
    text-align: center;
    background: @btn-default-bg;
    border: 1px solid @btn-default-border;
    cursor: pointer;
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16),
        0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

.btn-default:focus {
    background-color: @btn-default-active-bg;
    color: @btn-default-color;
}

.btn-default:hover {
    color: @btn-default-color;
    background-color: @btn-default-active-bg;
    box-shadow: 0 5px 11px 0 rgba(0, 0, 0, 0.1), 0 4px 15px 0 rgba(0, 0, 0, 0.1);
}

.btn-default:active,
.btn-default.active {
    outline: none;
    background-color: @btn-default-active-bg;
    border-color: @btn-default-border;
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125), 0 0 0 rgba(0, 0, 0, 0);
}

.btn-default[disabled],
.btn-default[disabled]:hover,
.btn-default[disabled]:focus,
.btn-default[disabled]:active,
.btn-default[disabled].active {
    cursor: not-allowed;
    opacity: 0.65;
    color: @btn-default-color;
    text-align: center;
    background: @btn-default-bg;
    border: 1px solid @btn-default-border;
    box-shadow: none;
}

.btn.disabled,
.btn[disabled],
fieldset[disabled] .btn {
    pointer-events: inherit;
}

.btn-link[disabled],
.btn-link[disabled]:hover,
.btn-link[disabled]:focus {
    color: @btn-link-disabled-color;
}

.input-group-btn .btn-default,
.input-group-btn .btn-primary,
.btn-group .btn-default,
.btn-group .btn-primary {
    box-shadow: none;
    border-width: 1px;
    --webkit-box-shadow: none;
}

/* ------------------------------------------------------------------------------ */
/* Button Loading Indicator
/* ------------------------------------------------------------------------------ */

.btn-loading {
    position: relative;
}

.btn-loading .btn-label {
    visibility: hidden;
    display: inline-block;
}

.btn-loading-indicator {
    display: none;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -7px;
    margin-top: -7px;
}

.btn-loading .btn-loading-indicator {
    display: inline-block;
}

.btn-loading .btn-loading-indicator {
    -webkit-animation: spin 0.8s infinite linear;
    -moz-animation: spin 0.8s infinite linear;
    -o-animation: spin 0.8s infinite linear;
    animation: spin 0.8s infinite linear;
}

.btn-label {
    visibility: hidden;
}