ad-manage/src/components/ImgPreview/index.less

#imgPreview{
    position: fixed;
    width: 100%;
    height: 100%;
    z-index: 888;
    top: 0;
    left: 0;
    padding: 40px;
    box-sizing: border-box;

    &>div.carousel-root{
        height: 100%;
        &>.carousel-slider{
            height: 80%;
            &>.slider-wrapper{
                height: 100%;
                ul.slider{
                    height: 100%;
                    li{
                        height: 100%;
                        &>div{
                            height: 100%;
                            position: relative;
                            img{
                                // height: 100%;
                                // width: auto;
                                max-height: 100%;
                                width: auto;
                                max-width: 1200px;
                                position: absolute;
                                top: 50%;
                                left: 50%;
                                transform: translate(-50%, -50%);
                            }
                        }
                    }
                }
            }
        }
        &>.carousel > .thumbs-wrapper .thumbs{
            text-align: center;
        }
    }
    &>.close{
        position: absolute;
        right: 250px;
        top: 5px;
        color: #fff;
        font-size: 24px;
        z-index: 890;
    }
    &>.back{
        position: absolute;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, .7);
        top: 0;
        left: 0;
    }
}