@vtx/modals2 3.2.0 → 3.2.2

package/lib/vtx-throw-point-modal/components/OverView/index.less

@@ -1,321 +1,321 @@
-@import '../../style/index';
-
-.summary-item {
-    display: flex;
-    gap: 16px;
-    align-items: center;
-    color: var(--info-color);
-    .summary-item-text {
-        & > p:nth-child(2) {
-            color: #9ba8b0;
-            span {
-                color: var(--info-color);
-                font-size: 20px;
-                margin-right: 8px;
-            }
-        }
-    }
-}
-
-.@{prefix-cls}-overview {
-    display: flex;
-    gap: 10px;
-    height: 820px;
-    &-left {
-        display: flex;
-        flex-direction: column;
-        height: 100%;
-        width: 360px;
-        padding: 10px;
-        background: var(--bg-color2);
-        &-title {
-            color: #fff;
-            font-size: 16px;
-        }
-        &-title1 {
-            span {
-                &:last-child {
-                    color: #34ffd2;
-                    font-size: 14px;
-                }
-            }
-        }
-        &-title2 {
-            font-size: 14px;
-            color: #cecece;
-            span {
-                &:last-child {
-                    font-size: 12px;
-                }
-            }
-        }
-        &-img {
-            height: 260px;
-            width: 100%;
-        }
-        &-middle {
-            height: 200px;
-            display: flex;
-            font-size: 14px;
-            color: #fff;
-            font-family: PingFangSC-Regular, PingFang SC;
-        }
-        &-item1,
-        &-item3,
-        &-item4,
-        &-item5,
-        &-item6 {
-            display: flex;
-            flex-direction: column;
-            padding: 12px;
-        }
-        &-item1 {
-            height: 196px;
-            width: 106px;
-            margin-right: 6px;
-            background-image: url('../../imgs/my-tfd.png');
-            background-size: 100% 100%;
-            &-big {
-                font-size: 22px;
-            }
-        }
-        &-item2 {
-            width: 240px;
-            display: flex;
-            flex-wrap: wrap;
-        }
-        &-item3,
-        &-item4,
-        &-item5,
-        &-item6 {
-            width: 108px;
-            height: 93px;
-            margin-bottom: 6px;
-            margin-right: 6px;
-        }
-        &-item3 {
-            background-image: url('../../imgs/twtf-tfd.png');
-            background-size: 100% 100%;
-        }
-        &-item4 {
-            background-image: url('../../imgs/wstf-tfd.png');
-            background-size: 100% 100%;
-        }
-        &-item5 {
-            background-image: url('../../imgs/wpd.png');
-            background-size: 100% 100%;
-        }
-        &-item6 {
-            background-image: url('../../imgs/ht-tfd.png');
-            background-size: 100% 100%;
-        }
-        &-info {
-            position: relative;
-            flex: 1;
-            padding: 10px;
-            .vm-estate-summary {
-                position: absolute;
-                right: 29px;
-                &-img {
-                    display: flex;
-                    align-items: center;
-                    justify-content: flex-end;
-                    position: relative;
-                    padding-right: 16px;
-                    width: 136px;
-                    height: 50px;
-                    color: var(--info-color);
-                    span {
-                        z-index: 1;
-                    }
-                    img {
-                        position: absolute;
-                        left: 0;
-                        right: 0;
-                        top: 0;
-                        bottom: 0;
-                    }
-                }
-                &-text {
-                    margin-top: -12px;
-                    text-align: center;
-                    span:nth-child(1) {
-                        font-size: 26px;
-                        margin-right: 8px;
-                    }
-                }
-            }
-        }
-    }
-    &-middle {
-        height: 100%;
-        display: flex;
-        flex-direction: column;
-        gap: 10px;
-        width: 455px;
-    }
-    &-hot {
-        display: flex;
-        flex-direction: column;
-        padding: 10px;
-        height: 460px;
-        background: var(--bg-color2);
-        &-summary {
-            display: flex;
-            justify-content: space-around;
-            height: 155px;
-            .garbage-summary {
-                width: 100px;
-                height: 100%;
-                text-align: center;
-                color: var(--info-color);
-                padding-top: 12px;
-                &-bucket {
-                    margin: 0 auto;
-                    margin-bottom: 12px;
-                    display: flex;
-                    align-items: center;
-                    justify-content: center;
-                    width: 45px;
-                    height: 52px;
-                }
-                p {
-                    span {
-                        font-size: 18px;
-                        margin-right: 4px;
-                    }
-                }
-            }
-        }
-        &-buttons {
-            padding: 8px 0;
-            text-align: center;
-        }
-        &-chart {
-            flex: 1;
-        }
-    }
-    &-trend {
-        flex: 1;
-        display: flex;
-        flex-direction: column;
-        background: var(--bg-color2);
-        padding: 10px;
-        &-chart {
-            flex: 1;
-        }
-    }
-    &-right {
-        height: 100%;
-        flex: 1;
-        display: flex;
-        flex-direction: column;
-        gap: 10px;
-    }
-    &-manage {
-        padding: 10px;
-        background: var(--bg-color2);
-        color: var(--info-color);
-        display: flex;
-        flex-direction: column;
-        &-top {
-            display: flex;
-            .top-item {
-                display: flex;
-                gap: 32px;
-                align-items: center;
-                padding-left: 24px;
-                padding-right: 8px;
-                margin-bottom: 16px;
-                .img {
-                    text-align: center;
-                    .name--1 {
-                        color: #1febff;
-                    }
-                    .name--2 {
-                        color: #7fffd8;
-                    }
-                    img {
-                        margin-top: -10px;
-                    }
-                }
-                .statistic {
-                    flex: 1;
-                    & > div:nth-child(1) {
-                        padding-left: 16px;
-                        display: flex;
-                        justify-content: space-between;
-                        background: url('../../imgs/manage-bg-1.png') no-repeat;
-                        background-size: 100% 100%;
-                        margin-bottom: 16px;
-                    }
-                    & > div:nth-child(2) {
-                        padding-left: 16px;
-                        display: flex;
-                        justify-content: space-between;
-                        background: url('../../imgs/manage-bg-2.png') no-repeat;
-                        background-size: 100% 100%;
-                    }
-                    .statistic-value--1 {
-                        font-size: 20px;
-                        font-weight: 400;
-                        color: #50ffdc;
-                        background: linear-gradient(
-                            0deg,
-                            #1febff 0%,
-                            #7ddcff 49.90234375%,
-                            #ffffff 100%
-                        );
-                        -webkit-background-clip: text;
-                        -webkit-text-fill-color: transparent;
-                    }
-                    .statistic-value--2 {
-                        font-size: 20px;
-                        font-weight: 400;
-                        color: #5cff84;
-                        background: linear-gradient(
-                            0deg,
-                            #1febff 0%,
-                            #7dffd0 49.90234375%,
-                            #ffffff 100%
-                        );
-                        -webkit-background-clip: text;
-                        -webkit-text-fill-color: transparent;
-                    }
-                }
-            }
-        }
-        &-bottom {
-            height: 50px;
-            display: flex;
-            justify-content: space-between;
-        }
-    }
-    &-rightbottom {
-        flex: 1;
-        padding: 10px;
-        background: var(--bg-color2);
-        color: var(--info-color);
-        display: flex;
-        flex-direction: column;
-        &--buttons {
-            margin-bottom: 16px;
-            text-align: center;
-        }
-        &-echarts {
-            display: flex;
-            .content {
-                width: 50%;
-            }
-        }
-        &--pie {
-        }
-        &--gauges {
-            flex: 1;
-            display: flex;
-            .gauges-chart {
-                flex: 1;
-            }
-        }
-    }
-}
+@import '../../style/index';
+
+.summary-item {
+    display: flex;
+    gap: 16px;
+    align-items: center;
+    color: var(--info-color);
+    .summary-item-text {
+        & > p:nth-child(2) {
+            color: #9ba8b0;
+            span {
+                color: var(--info-color);
+                font-size: 20px;
+                margin-right: 8px;
+            }
+        }
+    }
+}
+
+.@{prefix-cls}-overview {
+    display: flex;
+    gap: 10px;
+    height: 820px;
+    &-left {
+        display: flex;
+        flex-direction: column;
+        height: 100%;
+        width: 360px;
+        padding: 10px;
+        background: var(--bg-color2);
+        &-title {
+            color: #fff;
+            font-size: 16px;
+        }
+        &-title1 {
+            span {
+                &:last-child {
+                    color: #34ffd2;
+                    font-size: 14px;
+                }
+            }
+        }
+        &-title2 {
+            font-size: 14px;
+            color: #cecece;
+            span {
+                &:last-child {
+                    font-size: 12px;
+                }
+            }
+        }
+        &-img {
+            height: 260px;
+            width: 100%;
+        }
+        &-middle {
+            height: 200px;
+            display: flex;
+            font-size: 14px;
+            color: #fff;
+            font-family: PingFangSC-Regular, PingFang SC;
+        }
+        &-item1,
+        &-item3,
+        &-item4,
+        &-item5,
+        &-item6 {
+            display: flex;
+            flex-direction: column;
+            padding: 12px;
+        }
+        &-item1 {
+            height: 196px;
+            width: 106px;
+            margin-right: 6px;
+            background-image: url('../../imgs/my-tfd.png');
+            background-size: 100% 100%;
+            &-big {
+                font-size: 22px;
+            }
+        }
+        &-item2 {
+            width: 240px;
+            display: flex;
+            flex-wrap: wrap;
+        }
+        &-item3,
+        &-item4,
+        &-item5,
+        &-item6 {
+            width: 108px;
+            height: 93px;
+            margin-bottom: 6px;
+            margin-right: 6px;
+        }
+        &-item3 {
+            background-image: url('../../imgs/twtf-tfd.png');
+            background-size: 100% 100%;
+        }
+        &-item4 {
+            background-image: url('../../imgs/wstf-tfd.png');
+            background-size: 100% 100%;
+        }
+        &-item5 {
+            background-image: url('../../imgs/wpd.png');
+            background-size: 100% 100%;
+        }
+        &-item6 {
+            background-image: url('../../imgs/ht-tfd.png');
+            background-size: 100% 100%;
+        }
+        &-info {
+            position: relative;
+            flex: 1;
+            padding: 10px;
+            .vm-estate-summary {
+                position: absolute;
+                right: 29px;
+                &-img {
+                    display: flex;
+                    align-items: center;
+                    justify-content: flex-end;
+                    position: relative;
+                    padding-right: 16px;
+                    width: 136px;
+                    height: 50px;
+                    color: var(--info-color);
+                    span {
+                        z-index: 1;
+                    }
+                    img {
+                        position: absolute;
+                        left: 0;
+                        right: 0;
+                        top: 0;
+                        bottom: 0;
+                    }
+                }
+                &-text {
+                    margin-top: -12px;
+                    text-align: center;
+                    span:nth-child(1) {
+                        font-size: 26px;
+                        margin-right: 8px;
+                    }
+                }
+            }
+        }
+    }
+    &-middle {
+        height: 100%;
+        display: flex;
+        flex-direction: column;
+        gap: 10px;
+        width: 455px;
+    }
+    &-hot {
+        display: flex;
+        flex-direction: column;
+        padding: 10px;
+        height: 460px;
+        background: var(--bg-color2);
+        &-summary {
+            display: flex;
+            justify-content: space-around;
+            height: 155px;
+            .garbage-summary {
+                width: 100px;
+                height: 100%;
+                text-align: center;
+                color: var(--info-color);
+                padding-top: 12px;
+                &-bucket {
+                    margin: 0 auto;
+                    margin-bottom: 12px;
+                    display: flex;
+                    align-items: center;
+                    justify-content: center;
+                    width: 45px;
+                    height: 52px;
+                }
+                p {
+                    span {
+                        font-size: 18px;
+                        margin-right: 4px;
+                    }
+                }
+            }
+        }
+        &-buttons {
+            padding: 8px 0;
+            text-align: center;
+        }
+        &-chart {
+            flex: 1;
+        }
+    }
+    &-trend {
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        background: var(--bg-color2);
+        padding: 10px;
+        &-chart {
+            flex: 1;
+        }
+    }
+    &-right {
+        height: 100%;
+        flex: 1;
+        display: flex;
+        flex-direction: column;
+        gap: 10px;
+    }
+    &-manage {
+        padding: 10px;
+        background: var(--bg-color2);
+        color: var(--info-color);
+        display: flex;
+        flex-direction: column;
+        &-top {
+            display: flex;
+            .top-item {
+                display: flex;
+                gap: 32px;
+                align-items: center;
+                padding-left: 24px;
+                padding-right: 8px;
+                margin-bottom: 16px;
+                .img {
+                    text-align: center;
+                    .name--1 {
+                        color: #1febff;
+                    }
+                    .name--2 {
+                        color: #7fffd8;
+                    }
+                    img {
+                        margin-top: -10px;
+                    }
+                }
+                .statistic {
+                    flex: 1;
+                    & > div:nth-child(1) {
+                        padding-left: 16px;
+                        display: flex;
+                        justify-content: space-between;
+                        background: url('../../imgs/manage-bg-1.png') no-repeat;
+                        background-size: 100% 100%;
+                        margin-bottom: 16px;
+                    }
+                    & > div:nth-child(2) {
+                        padding-left: 16px;
+                        display: flex;
+                        justify-content: space-between;
+                        background: url('../../imgs/manage-bg-2.png') no-repeat;
+                        background-size: 100% 100%;
+                    }
+                    .statistic-value--1 {
+                        font-size: 20px;
+                        font-weight: 400;
+                        color: #50ffdc;
+                        background: linear-gradient(
+                            0deg,
+                            #1febff 0%,
+                            #7ddcff 49.90234375%,
+                            #ffffff 100%
+                        );
+                        -webkit-background-clip: text;
+                        -webkit-text-fill-color: transparent;
+                    }
+                    .statistic-value--2 {
+                        font-size: 20px;
+                        font-weight: 400;
+                        color: #5cff84;
+                        background: linear-gradient(
+                            0deg,
+                            #1febff 0%,
+                            #7dffd0 49.90234375%,
+                            #ffffff 100%
+                        );
+                        -webkit-background-clip: text;
+                        -webkit-text-fill-color: transparent;
+                    }
+                }
+            }
+        }
+        &-bottom {
+            height: 50px;
+            display: flex;
+            justify-content: space-between;
+        }
+    }
+    &-rightbottom {
+        flex: 1;
+        padding: 10px;
+        background: var(--bg-color2);
+        color: var(--info-color);
+        display: flex;
+        flex-direction: column;
+        &--buttons {
+            margin-bottom: 16px;
+            text-align: center;
+        }
+        &-echarts {
+            display: flex;
+            .content {
+                width: 50%;
+            }
+        }
+        &--pie {
+        }
+        &--gauges {
+            flex: 1;
+            display: flex;
+            .gauges-chart {
+                flex: 1;
+            }
+        }
+    }
+}