.studio-view.view-container.mode-style2 {
    display: flex;
    flex-direction: column;

    .view-top {
        flex-shrink: 0;
        height: 40px;
        overflow: hidden;
        color: var(--view-font-color);
        border-bottom: 1px solid var(--app-dividing-line-color-bright);
    }

    .view-toolbar {
        height: 100%;
        float: left;
        .toolbar-container{
            margin-top: 3px;
        }
    }
    .data-panel{
        padding: 4px 8px 4px 4px;
    }
    .quick-search {
        float: right;
        width: 230px;
        margin-right: 8px;
        margin-top: 4px;
        .ivu-input-wrapper{
            margin-top: 4px !important;
        }
        .ivu-icon-ios-search {
            border-radius: 0px 5px 5px 0px;
        }

        .ivu-input.ivu-input-default.ivu-input-with-suffix {
            height: 28px;
            line-height: 28px;
            border: 1px solid var(--form-editor-border-color);
            color: var(--form-editor-font-color);
            background-color: var(--form-editor-background-color);
        }

        .ivu-input.ivu-input-default.ivu-input-with-suffix:hover {
            border-color: var(--form-editor-active-color);
        }

        .ivu-input.ivu-input-default.ivu-input-with-suffix::-webkit-input-placeholder {
            color: var(--form-editor-placeholder-font-color);
        }

        .ivu-input-icon {
            width: 28px;
            height: 28px;
            line-height: 28px;
        }
    }

    .view-header {
        flex-shrink: 0;
        height: auto;
        border: 0;

        > .title {
            font-size: 20px;
            height: 50px;

            .caption-image {
                margin-right: 6px;
            }
        }

        > .data-panel {
            float: right;
        }

        > .quick-search {
            float: right;
        }
    }

    .view-header.hidden-top {
        border-bottom: 1px solid var(--app-dividing-line-color-bright);

        .quick-search {
            .ivu-input.ivu-input-default.ivu-input-with-suffix {
                height: 28px;
                line-height: 28px;
            }

            .ivu-input-icon {
                width: 28px;
                height: 28px;
                line-height: 28px;
            }
        }
    }

    .quick-group-tab {
        border-bottom: 1px solid var(--app-dividing-line-color-bright);
    }

    .view-content {
        flex-grow: 1;
        height: 100%;
    }

    .view-content.show-search-form {
        flex-direction: row;
        overflow: hidden;
        height: 100%;

        > .search-form-wrapper {
            flex-shrink: 0;
            overflow-y: auto;
            overflow-x: hidden;

            .app-search-form {
                display: block;
                width: 250px;
                height: 100%;
                border-right: 1px solid var(--app-dividing-line-color-bright);

                .ivu-select-input,
                .el-input .el-input__inner {
                    height: 26px;
                    line-height: 26px;
                }
            }
        }

        > .content-wrapper {
            flex-grow: 1;
            overflow-y: auto;
            overflow-x: hidden;
        }
    }

    .view-footer {
        flex-shrink: 0;
    }
}

@import './studio-view-style2-layout.less';