.popover-title-container {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 1px;
}


.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.form-design {
    height: 100%;
    display: flex;
    flex-direction: column;

    .design-sortable-drag {
        background: #f00;
    }

    a {
        text-decoration: none;
    }

    // 修改属性配置elementUi tab的样式
    .tab-attribute {
        .el-tabs__item {
            width: 140px;
            text-align: center;
        }
    }

    >.design-header {
        height: 53px;
        padding: 0 10px;
        box-sizing: border-box;
        display: flex;
        justify-content: space-between;
        align-items: center;
        color: #fff;
        box-shadow: 0 1px #ccc;
        margin-bottom: 1px;
        box-sizing: border-box;
        background: linear-gradient(90deg, #1179f4 45%, #079dc8, #01b3ac);

        .header-left {
            display: flex;
            font-size: 14px;
            align-items: center;

            .title {
                margin: 0;
                padding: 0;
                font-size: 19px;
                height: 53px;
                line-height: 55px;
            }

            .header-github-image {
                width: 35px;
                height: 35px;
                margin-right: 12px;
            }
        }

        .header-right {
            display: flex;
            font-size: 14px;
            align-items: center;

            >.tool {
                cursor: pointer;
                margin-left: 10px;
            }
        }
    }

    .widget-title {
        height: 25px;
        line-height: 25px;
        font-size: 14px;
        margin-left: 3px;
    }


    >.design-content {
        height: calc(100% - 30px);
        position: relative;
        display: flex;

        .left-view-panel {
            height: 100%;
            width: 200px;
            transition: width 0.3s;
            overflow: hidden;
        }

        .base-widgets {
            padding-right: 2px;

            .base-components {
                display: flex;
                flex-wrap: wrap;
                justify-content: space-between;

                >.base-component-item {
                    height: 30px;
                    line-height: 30px;
                    width: 49.5%;
                    text-align: center;
                    font-size: 12px;
                    background: #eff0f3;
                    margin: 3px 0;
                    cursor: move;
                    box-sizing: border-box;
                }

                >.base-component-item:hover {
                    border: 1px dashed #01b3ac;
                }
            }
        }

        .design-canvas {
            height: calc(100% - 22px);
        }
    }
}