OpenPlatForm/static/css/app.scss

@import "./iconfont";

body {
    width: 100vw;
    overflow-x: hidden;
    margin: 0;
    padding: 0;
}

a {
    text-decoration: none;
}
.login-box {
    .el-input__inner {
        border: none !important;
        font-size: 14px;
    }
    .el-input-group__append {
        background: none;
        border: none;
    }
}

// 公共蓝色 - button
.primary-button {
    background: #1890ff;
    border-radius: 6px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    color: #fff;
    justify-content: center;
    user-select: none;
}
.primary-button:hover {
    background: #3399f8;
}
.primary-button:active {
    background: #0886fc;
}

// 公共灰色 - button
.primary-button2 {
    background: #f7f8fa;
    border-radius: 6px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    color: #333333;
    justify-content: center;
    user-select: none;
}
.primary-button2:hover {
    background: #dfdfdf;
}
.primary-button2:active {
    background: #d9dbe0;
}

.item-input {
    .el-textarea__inner,
    .el-input__inner {
        background: transparent;
        border: none;
    }
}

.index-head-box {
    .el-menu.el-menu--horizontal {
        border: none;
    }

    .el-submenu__icon-arrow {
        right: 4px;
        font-size: 15px;
    }
    .el-menu-item,
    .el-submenu__title {
        font-size: 16px;
        color: #333333;
        height: 20px;
        line-height: 20px;
    }

    .el-submenu__title,
    .el-menu-item:focus,
    .el-menu-item:hover {
        background-color: transparent;
    }
}

.control {
    .el-menu {
        border: none;
    }

    .is-opened {
        border: none !important;
    }

    .el-menu--inline {
        border: none !important;
    }

    .el-submenu__title {
        padding: 0 30px !important;
        font-size: 16px;
        height: 61px;
        line-height: 61px;
        width: 100%;
        border-left: #fff solid 4px;

        box-sizing: border-box;
    }
    .el-menu-item {
        padding: 0 30px !important;
        box-sizing: border-box;
        width: 100%;
        font-size: 16px;
        height: 61px;
        line-height: 61px;
        border-left: #fff solid 4px;
    }
    .is-active {
        border-left: #1890ff solid 4px;
    }
}

.information-head,
.password-box {
    .el-form--inline .el-form-item__label {
        padding: 0;
    }
}

.from-box {
    .el-form-item__content {
        line-height: 14px;
    }
    .el-form--label-top .el-form-item__label {
        padding-bottom: 0;
    }
}

.picker-box {
    .el-input__inner {
        width: 100%;
    }
    .el-date-editor.el-input {
        width: 162px !important;
    }

    .el-form-item .el-form-item {
        margin: 0px !important;
    }
}

.upload-box {
    .el-form-item__content {
        display: flex !important;
        justify-content: center;
        align-items: center;
        height: 170px;
        border: 0.5px solid #dcdde5;
        border-radius: 14px;
    }
    .el-upload {
        width: 48px;
        height: 48px;
        border-radius: 50%;
        background: #eff7ff;
        display: flex;
        justify-content: center;
        align-items: center;
        background: #eff7ff;
        .el-icon-plus {
            color: #2f89fc;
            font-size: 30px;
            font-weight: bold;
        }
    }
}

.replenish,
.setApp {
    .el-upload-dragger {
        height: 42px;
        display: flex;
        width: 162px;
        justify-content: center;
        align-items: center;
    }
    .el-icon-upload {
        font-size: 18px;
        line-height: 42px !important;
        height: 42px !important;
        margin: 0 5px 0 0;
    }
}

.agreement-bar {
    .el-checkbox__input {
        vertical-align: -2px;
    }
}

.from-box {
    .el-form-item {
        margin-bottom: 14px;
    }
}

.transition-box {
    .avatar-uploader {
        display: flex !important;
        justify-content: center;
        align-items: center;
        height: 170px;
        border: 0.5px solid #dcdde5;
        border-radius: 14px;
        .el-upload {
            width: 48px;
            height: 48px;
            border-radius: 50%;
            background: #eff7ff;
            display: flex;
            justify-content: center;
            align-items: center;
            background: #eff7ff;
            .el-icon-plus {
                color: #2f89fc;
                font-size: 30px;
                font-weight: bold;
            }
        }
    }
}

.api-box,
.apiBox-head {
    .el-input__inner::placeholder {
        color: #1890ff;
        font-size: 14px;
    }
    /* 谷歌 */
    .el-input__inner::-webkit-input-placeholder {
        color: #1890ff;
        font-size: 14px;
    }
    /* 火狐 */
    .el-input__inner:-moz-placeholder {
        color: #1890ff;
        font-size: 14px;
    }
    /*ie*/
    .el-input__inner:-ms-input-placeholder {
        color: #1890ff;
        font-size: 14px;
    }
    .el-input {
        box-sizing: border-box;
        width: calc(100% - 70px);
    }

    .el-textarea__inner,
    .el-input__inner {
        background: transparent;
        border: none;
        height: 34px;
        line-height: 34px;
    }
}

.demo-ruleForm {
    .el-form-item__label {
        padding: 0;
    }
    .el-select {
        width: 100%;
    }
    .el-form-item {
        position: relative;
        margin-bottom: 10px;
    }
}

.jv-container .jv-code.open {
    background: #f5f8f7;
    border-radius: 14px;
    border: 1px solid #67ba6a;
}

.jv-container.boxed {
    border: none !important;
}

.jv-container.boxed:hover {
    border: none !important;
    box-shadow: none !important;
}

.el-table th {
    background: #f8fbff;
}

.el-table td,
.el-table th {
    padding: 9px 0;
}

.setApp {
    .el-form-item {
        margin-bottom: 10px;
    }
    .el-form-item__error {
        display: none !important;
    }

}
.app-detail {
    .el-table td, .el-table th.is-leaf {
        border: none;
        line-height: 57px;
        height: 57px;
        padding: 0;
    }
}

.el-textarea__inner {
    resize: none;
    height: 100%;
}