1
shuishen
2022-12-08 c2be4af9340731060df079f02abf50538d1c33ea
1
2 files modified
500 ■■■■ changed files
src/styles/media/index.scss 497 ●●●● patch | view | raw | blame | history
src/styles/scssFile.scss 3 ●●●● patch | view | raw | blame | history
src/styles/media/index.scss
@@ -40,207 +40,205 @@
                    }
                }
                .main-containter {
                    .main-content {
                        top: countSizeVh(60);
                        height: calc(100% - countSizeVh(60));
                .main-content {
                    top: countSizeVh(60);
                    height: calc(100% - countSizeVh(60));
                        .home-page {
                    .home-page {
                            .left-container,
                            .right-container {
                                top: countSizeVh(60);
                                width: countSizeVw(400, 1920);
                                height: calc(100% - countSizeVh(60));
                        .left-container,
                        .right-container {
                            top: countSizeVh(60);
                            width: countSizeVw(400, 1920);
                            height: calc(100% - countSizeVh(60));
                                .person-box,
                                .land-box,
                                .case-box,
                                .crowd-box {
                                    height: countSizeVh(320);
                                }
                                .person-box,
                                .house-box,
                                .land-box,
                                .case-box,
                                .alert-box,
                                .crowd-box {
                                    .title {
                                        padding: 0 countSizeVw(18, 1920) 0 countSizeVw(18, 1920);
                                        height: countSizeVh(58);
                                        line-height: countSizeVh(58);
                                        font-size: countSizeVh(16);
                                    }
                                    .sub-title {
                                        line-height: countSizeVh(36);
                                    }
                                    .sub-tab {
                                        padding: countSizeVh(10);
                                        .tab {
                                            &>div {
                                                height: countSizeVh(22);
                                                line-height: countSizeVh(22);
                                            }
                                        }
                                    }
                                }
                                .house-box,
                                .alert-box {
                                    .title {
                                        height: countSizeVh(62);
                                        line-height: countSizeVh(62);
                                    }
                                }
                            }
                            .bottom-container {
                                left: countSizeVw(400, 1920);
                                width: calc(100% - countSizeVw(400, 1920) * 2);
                            .person-box,
                            .land-box,
                            .case-box,
                            .crowd-box {
                                height: countSizeVh(320);
                            }
                            .region-select {
                                top: countSizeVh(20);
                            }
                            .person-box,
                            .house-box,
                            .land-box,
                            .case-box,
                            .alert-box,
                            .crowd-box {
                            .center-container {
                                bottom: countSizeVh(340);
                                .layers-control-btn {
                                    width: countSizeVw(96, 1920);
                                    height: countSizeVh(40);
                                    border-radius: countSizeVh(20)
                                .title {
                                    padding: 0 countSizeVw(18, 1920) 0 countSizeVw(18, 1920);
                                    height: countSizeVh(58);
                                    line-height: countSizeVh(58);
                                    font-size: countSizeVh(16);
                                }
                                .sub-title {
                                    line-height: countSizeVh(36);
                                }
                                .sub-tab {
                                    padding: countSizeVh(10);
                                    .tab {
                                        &>div {
                                            height: countSizeVh(22);
                                            line-height: countSizeVh(22);
                                        }
                                    }
                                }
                            }
                            .el-checkbox__inner {
                                width: countSizeVh(20);
                                height: countSizeVh(20);
                            }
                            .house-box,
                            .alert-box {
                            .el-checkbox__label {
                                font-size: countSizeVh(16) !important;
                                .title {
                                    height: countSizeVh(62);
                                    line-height: countSizeVh(62);
                                }
                            }
                        }
                        .house-page {
                            .container-content {
                        .bottom-container {
                            left: countSizeVw(400, 1920);
                            width: calc(100% - countSizeVw(400, 1920) * 2);
                            height: countSizeVh(320);
                        }
                                .search-box {
                                    height: countSizeVh(48);
                        .region-select {
                            top: countSizeVh(20);
                        }
                                    input {
                                        font-size: countSizeVh(18);
                                    }
                        .center-container {
                            bottom: countSizeVh(340);
                                    button {
                                        width: countSizeVw(80, 1920);
                                        font-size: countSizeVh(24);
                                    }
                            .layers-control-btn {
                                width: countSizeVw(96, 1920);
                                height: countSizeVh(40);
                                border-radius: countSizeVh(20)
                            }
                        }
                        .el-checkbox__inner {
                            width: countSizeVh(20);
                            height: countSizeVh(20);
                        }
                        .el-checkbox__label {
                            font-size: countSizeVh(16) !important;
                        }
                    }
                    .house-page {
                        .container-content {
                            .search-box {
                                height: countSizeVh(48);
                                input {
                                    font-size: countSizeVh(18);
                                }
                                .search-val-box {
                                    top: countSizeVh(48);
                                    left: countSizeVw(6, 1920);
                                    width: calc(100% - 2 * countSizeVw(6, 1920));
                                    max-height: countSizeVh(160);
                                    border-radius: countSizeVh(10);
                                button {
                                    width: countSizeVw(80, 1920);
                                    font-size: countSizeVh(24);
                                }
                            }
                                    &>div {
                                        div {
                            .search-val-box {
                                top: countSizeVh(48);
                                left: countSizeVw(6, 1920);
                                width: calc(100% - 2 * countSizeVw(6, 1920));
                                max-height: countSizeVh(160);
                                border-radius: countSizeVh(10);
                                &>div {
                                    div {
                                        padding: 0 countSizeVw(10, 1920);
                                        line-height: countSizeVh(36);
                                        cursor: pointer;
                                    }
                                }
                            }
                            .result-content {
                                height: calc(100% - countSizeVh(48));
                                .housing-estate-info {
                                    .housing-title {
                                        padding: 0 countSizeVw(10, 1920);
                                        height: countSizeVh(40);
                                        line-height: countSizeVh(40);
                                        font-size: countSizeVh(28);
                                        &::after {
                                            top: countSizeVh(18);
                                            left: countSizeVw(10, 1920);
                                            right: countSizeVw(10, 1920);
                                            top: countSizeVh(4);
                                        }
                                    }
                                    .housing-bg {
                                        margin-top: countSizeVh(6);
                                        height: countSizeVh(200);
                                    }
                                    .housing-introduce {
                                        &>div {
                                            padding: 0 countSizeVw(10, 1920);
                                            line-height: countSizeVh(36);
                                            cursor: pointer;
                                            .l {
                                                width: countSizeVw(80, 1920);
                                                line-height: countSizeVh(40);
                                            }
                                            .r {
                                                line-height: countSizeVh(40);
                                            }
                                        }
                                    }
                                }
                                .result-content {
                                    height: calc(100% - countSizeVh(48));
                                .nav-tab {
                                    .housing-estate-info {
                                        .housing-title {
                                            padding: 0 countSizeVw(10, 1920);
                                            height: countSizeVh(40);
                                            line-height: countSizeVh(40);
                                            font-size: countSizeVh(28);
                                            &::after {
                                                top: countSizeVh(18);
                                                left: countSizeVw(10, 1920);
                                                right: countSizeVw(10, 1920);
                                                top: countSizeVh(4);
                                            }
                                        }
                                        .housing-bg {
                                            margin-top: countSizeVh(6);
                                            height: countSizeVh(200);
                                        }
                                        .housing-introduce {
                                            &>div {
                                                padding: 0 countSizeVw(10, 1920);
                                                .l {
                                                    width: countSizeVw(80, 1920);
                                                    line-height: countSizeVh(40);
                                                }
                                                .r {
                                                    line-height: countSizeVh(40);
                                                }
                                            }
                                        }
                                    .nav {
                                        height: countSizeVh(40);
                                        line-height: countSizeVh(40);
                                        border-bottom: countSizeVh(1) solid #33566c;
                                    }
                                }
                                    .nav-tab {
                                .base-info {
                                        .nav {
                                            height: countSizeVh(40);
                                            line-height: countSizeVh(40);
                                            border-bottom: countSizeVh(1) solid #33566c;
                                    .sub-nav-list {
                                        padding: countSizeVw(14, 1920) 0;
                                        .sub-nav {
                                            width: countSizeVw(76, 1920);
                                            height: countSizeVh(26);
                                            line-height: countSizeVh(26);
                                            border-radius: countSizeVh(13);
                                        }
                                    }
                                    .base-info {
                                        .sub-nav-list {
                                            padding: countSizeVw(14, 1920) 0;
                                            .sub-nav {
                                                width: countSizeVw(76, 1920);
                                                height: countSizeVh(26);
                                                line-height: countSizeVh(26);
                                                border-radius: countSizeVh(13);
                                            }
                                            .on {
                                                border: countSizeVh(1) solid #fff;
                                            }
                                        .on {
                                            border: countSizeVh(1) solid #fff;
                                        }
                                    }
                                }
                            }
                        }
                    }
                    .main-content.spread {
                        width: countSizeVw(400, 1920);
                    }
                }
                .main-content.spread {
                    width: countSizeVw(400, 1920);
                }
                .flexible-btn {
@@ -255,102 +253,103 @@
                .flexible-btn.spread {
                    left: countSizeVw(400, 1920);
                }
            }
        }
        // 地图,控制按钮
        .screen-full-btn {
            left: countSizeVh(10);
            bottom: countSizeVh(10);
            width: countSizeVh(36);
            height: countSizeVh(36);
            font-size: countSizeVh(20);
        }
                // 地图,控制按钮
                .screen-full-btn {
                    left: countSizeVh(10);
                    bottom: countSizeVh(10);
                    width: countSizeVh(36);
                    height: countSizeVh(36);
                    font-size: countSizeVh(20);
                }
        .screen-full-btn.homebottom {
            left: countSizeVw(402, 1920) !important;
            bottom: countSizeVh(340);
        }
                .screen-full-btn.homebottom {
                    left: countSizeVw(402, 1920) !important;
                    bottom: countSizeVh(340);
                }
        .screen-full-btn.shrink-btn {
            left: countSizeVw(410, 1920) !important;
        }
                .screen-full-btn.shrink-btn {
                    left: countSizeVw(410, 1920) !important;
                }
        .dc-zoom-controller {
            left: countSizeVh(10) !important;
            bottom: countSizeVh(56) !important;
            width: countSizeVh(36) !important;
                .dc-zoom-controller {
                    left: countSizeVh(10) !important;
                    bottom: countSizeVh(56) !important;
                    width: countSizeVh(36) !important;
            &>div {
                width: countSizeVh(36) !important;
                height: countSizeVh(36) !important;
                    &>div {
                        width: countSizeVh(36) !important;
                        height: countSizeVh(36) !important;
                svg {
                    width: countSizeVh(20) !important;
                    height: countSizeVh(20) !important;
                        svg {
                            width: countSizeVh(20) !important;
                            height: countSizeVh(20) !important;
                        }
                    }
                }
                .dc-zoom-controller.homebottom {
                    left: countSizeVw(402, 1920) !important;
                    bottom: countSizeVh(386) !important;
                }
                .dc-zoom-controller.shrink-btn {
                    left: countSizeVw(410, 1920) !important;
                }
                .image-switch-icon-btn {
                    left: countSizeVh(10);
                    bottom: countSizeVh(178);
                    width: countSizeVh(36);
                    height: countSizeVh(36);
                    font-size: countSizeVh(20);
                }
                .image-switch-icon-btn.iconbottom {
                    left: countSizeVw(402, 1920) !important;
                    bottom: countSizeVh(506) !important;
                }
                .image-switch-icon-btn.shrink-btn {
                    left: countSizeVw(410, 1920) !important;
                }
                .dc-location-bar.homebottom {
                    bottom: countSizeVh(390) !important;
                }
                .image-switch-img-btn {
                    left: countSizeVw(46, 1920);
                    bottom: countSizeVh(190);
                    font-size: countSizeVh(20);
                    border-radius: countSizeVh(5);
                    .img,
                    .elec {
                        width: countSizeVh(80);
                        height: countSizeVh(60);
                        border: countSizeVh(2) solid $table-header-bg-color;
                        span {
                            right: countSizeVh(2);
                            bottom: countSizeVh(2);
                            padding: 0 countSizeVh(2);
                        }
                    }
                }
                .image-switch-img-btn.imgbottom {
                    left: countSizeVw(446, 1920);
                    bottom: countSizeVh(480);
                }
                .image-switch-img-btn.shrink-btn {
                    left: countSizeVw(454, 1920);
                    bottom: countSizeVh(154);
                }
            }
        }
        .dc-zoom-controller.homebottom {
            left: countSizeVw(402, 1920) !important;
            bottom: countSizeVh(386) !important;
        }
        .dc-zoom-controller.shrink-btn {
            left: countSizeVw(410, 1920) !important;
        }
        .image-switch-icon-btn {
            left: countSizeVh(10);
            bottom: countSizeVh(178);
            width: countSizeVh(36);
            height: countSizeVh(36);
            font-size: countSizeVh(20);
        }
        .image-switch-icon-btn.iconbottom {
            left: countSizeVw(402, 1920) !important;
            bottom: countSizeVh(506) !important;
        }
        .image-switch-icon-btn.shrink-btn {
            left: countSizeVw(410, 1920) !important;
        }
        .dc-location-bar.homebottom {
            bottom: countSizeVh(390) !important;
        }
        .image-switch-img-btn {
            left: countSizeVw(46, 1920);
            bottom: countSizeVh(190);
            font-size: countSizeVh(20);
            border-radius: countSizeVh(5);
            .img,
            .elec {
                width: countSizeVh(80);
                height: countSizeVh(60);
                border: countSizeVh(2) solid $table-header-bg-color;
                span {
                    right: countSizeVh(2);
                    bottom: countSizeVh(2);
                    padding: 0 countSizeVh(2);
                }
            }
        }
        .image-switch-img-btn.imgbottom {
            left: countSizeVw(446, 1920);
            bottom: countSizeVh(480);
        }
        .image-switch-img-btn.shrink-btn {
            left: countSizeVw(454, 1920);
            bottom: countSizeVh(154);
        }
    }
}
@@ -359,7 +358,7 @@
    html,
    body {
        font-size: 1.44vh !important;
        font-size: countSizeVh(16) !important;
        #app {
            width: 100vw;
src/styles/scssFile.scss
@@ -14,7 +14,8 @@
$sub-tab-on-border-color: rgb(0, 188, 212);
$menu-tab-bg-color: rgba(19, 41, 168, .8);
$menu-tab-bg-color: $bg-one-color;
$menu-tab-shadow: rgba(144, 202, 249, 0.8);