cell-detail-panel.less

@small-panel-height: 30px;
@small-panel-margin: 10px;
@small-panel-border-color: #E4E4E4;

.cell-detial-show {
    display: inline-block;
    vertical-align: top;   
    min-height:650px;   
    cursor: move;  
}

.cell-detail {
    .cell-detial-show;
    width:400px;
    min-width:400px;
    position: relative;
    background-color:#fff;
    .header {
        background-color: #333333;
        height: @small-panel-height;
        padding:0px;
        .icon-common {
            color: #fff;
            margin: 5px @small-panel-margin;
        }

        .drag-icon {
            float: left;
            .icon-common;
        }

        .close-icon {
            float: right;
            .icon-common;
            cursor: pointer;
        }

        .expand-icon {
            .icon-common;
            float: right;
            cursor: pointer;
            /*margin-left:300px;*/
        }
    }

    .content {
        height: calc(~"100% - 30px");
        /*background-color: #fff;*/
        border: 1px solid @small-panel-border-color;
        border-bottom: none;

        .pair-item {
            margin: @small-panel-margin @small-panel-margin @small-panel-margin*2 @small-panel-margin;

            .position {
                height: @small-panel-height;
                line-height: @small-panel-height;
            }

            .cell-position {
                .position;
                width: 18%;
                text-align: center;
            }

            .formula-desc {
                padding-left: 8px;
            }

            .value-panel {
                border: 1px solid @small-panel-border-color;
                word-wrap: break-word;
                min-height: @small-panel-height;

                .source-list {
                    padding-left: 15px;
                    margin-top: 5px;
                    list-style-type: none;
                }

                .source-item > span {
                    display: table-cell;
                }

                .col-sm-7 {
                    padding-left: 2px;
                    width: 58%;
                }

                .text-align-source {
                    text-align: right;
                    padding-right: 10px;
                }

                .col-sm-5 {
                    width: 42%;
                    padding-left: 0px;
                    .text-align-source;
                }

                .row {
                    margin: 10px 0px 20px 0px;
                }

                .source-total {
                    color: red;
                    font-weight: bold;
                    .row;
                    height:15px;
                }

                .horizontal-dot-line {
                    background-image: linear-gradient(to right, #a6a6a6 50%, rgba(255, 255, 255, 0) 0%);
                    background-position: top;
                    background-size: 10px 1px;
                    background-repeat: repeat-x;
                    height: 1px;
                }
            }
        }
    }
}