ꦫꦣꦺꦤ꧀ꦄꦤ꧀ꦠꦱꦺꦤ

PATH: home / lab2454c / keebchat.com / themes / default / apps / cpanel / statics / scss

.input-group {
    width: 100%;
    margin-bottom: 20px;

.form-line {
        display: inline-block;
        width: 100%;
        border-bottom: 1px solid #ddd;
        position: relative;

&:after {
            content: '';
            position: absolute;
            left: 0;
            width: 100%;
            bottom: -2px;
            @include transform(scaleX(0));
            @include transition(0.25s ease-in);
            border-bottom: 2px solid #1f91f3;
        }

+ .input-group-addon {
            padding-right: 0;
            padding-left: 10px;
        }
    }

.help-info {
        float: right;
        font-size: 12px;
        margin-top: 5px;
        color: #999;
    }

label.error {
        font-size: 12px;
        display: block;
        margin-top: 5px;
        font-weight: normal;
        color: #F44336;
    }

.form-line.error {
        &:after {
            border-bottom: 2px solid #F44336;
        }
    }

.form-line.success {
        &:after {
            border-bottom: 2px solid #4CAF50;
        }
    }

.form-line.warning {
        &:after {
            border-bottom: 2px solid #FFC107;
        }
    }

.form-line.focused {
        &:after {
            @include transform(scaleX(1));
        }

.form-label {
            bottom: 25px;
            left: 0;
            font-size: 12px;
        }
    }

.input-group-addon {
        border: none;
        background-color: transparent;
        padding-left: 0;
        font-weight: bold;

.material-icons {
            font-size: 18px;
            color: #555;
        }
    }

input[type="text"],
    .form-control {
        border: none;
        box-shadow: none;
        padding-left: 0;
    }

.form-control {
        &:focus {
            @include box-shadow(none !important);
        }
    }
}

.input-group.input-group-sm {
    .input-group-addon {
        i {
            font-size: 14px;
        }
    }

.form-control {
        font-size: 12px;
    }
}

.input-group.input-group-lg {

.input-group-addon {
        i {
            font-size: 26px;
        }
    }

.form-control {
        font-size: 18px;
    }
}

.form-control-label {
    text-align: right;

label {
        margin-top: 8px;
    }
}

.form-horizontal {
    .form-group {
        margin-bottom: 0;
    }
}

.form-group {
    width: 100%;
    margin-bottom: 25px;

small.invalid-feedback{
        display: block;
        font-size: 13px;
        line-height: 140%;
        color: $red;
        margin-top: 10px;
    }

small.info-feedback{
        display: block;
        font-size: 13px;
        line-height: 140%;
        color: $blue;
        margin-top: 10px;
    }

.form-control {
        width: 100%;
        border: none;
        box-shadow: none;
        @include border-radius(0);
        padding-left: 0;
        color: $black;
        font-size: 13px;

&::placeholder{
            color: $pl_holder;
            font-size: 12px !important;
        }
    }

.help-info {
        float: right;
        font-size: 12px;
        margin-top: 5px;
        color: #999;
    }

label.error {
        font-size: 12px;
        display: block;
        margin-top: 5px;
        font-weight: normal;
        color: #F44336;
    }

.form-line {
        width: 100%;
        position: relative;
        border-bottom: 1px solid #ddd;

&:after {
            content: '';
            position: absolute;
            left: 0;
            width: 100%;
            height: 0;
            bottom: -1px;
            @include transform(scaleX(0));
            @include transition(0.25s ease-in);
            border-bottom: 2px solid #1f91f3;
        }

.form-label {
            font-weight: normal;
            color: #aaa;
            position: absolute;
            top: 10px;
            left: 0;
            cursor: text;
            @include transition(0.2s);
        }
    }

.form-line.error {
        &:after {
            border-bottom: 2px solid #F44336;
        }
    }

.form-line.success {
        &:after {
            border-bottom: 2px solid #4CAF50;
        }
    }

.form-line.warning {
        &:after {
            border-bottom: 2px solid #FFC107;
        }
    }

.form-line.focused {
        &:after {
            @include transform(scaleX(1));
        }

.form-label {
            top: -10px;
            left: 0;
            font-size: 12px;
        }
    }
}

.form-group-sm {
    .form-label {
        font-size: 12px;
    }

.form-line.focused {
        .form-label {
            bottom: 20px;
            font-size: 10px;
        }
    }
}

.form-group-lg {
    .form-label {
        font-size: 18px;
    }

.form-line.focused {
        .form-label {
            bottom: 35px;
            font-size: 12px;
        }
    }
}

.form-control[disabled],
.form-control[readonly],
fieldset[disabled] .form-control {
    background-color: transparent;
}

[-] _dropdownmenu.scss [edit]
[-] _alerts.scss [edit]
[-] _leftsidebaroverlay.scss [edit]
[-] _labels.scss [edit]
[-] _mixins.scss [edit]
[-] _general.scss [edit]
[+] ..
[-] _switch.scss [edit]
[-] _modals.scss [edit]
[-] _buttons.scss [edit]
[-] run [edit]
[-] _inputformgroup.scss [edit]
[-] _collapse.scss [edit]
[-] _multiselect.scss [edit]
[+] .sass-cache
[-] _helpers.scss [edit]
[-] _checkboxradio.scss [edit]
[-] _tables.scss [edit]
[-] style.scss [edit]
[-] _bootstrapselect.scss [edit]
[-] _card.scss [edit]
[-] _media.scss [edit]
[-] _variables.scss [edit]
[-] _breadcrumbs.scss [edit]