From d50f9a2d262342ab6c39e8d3e5717ff381064572 Mon Sep 17 00:00:00 2001
From: tengsx <tengsx1009@163.com>
Date: Wed, 05 Apr 2023 22:39:35 +0800
Subject: [PATCH] page one

---
 src/styles/index.scss |  261 ++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 files changed, 260 insertions(+), 1 deletions(-)

diff --git a/src/styles/index.scss b/src/styles/index.scss
index 4b7dc89..bab44d4 100644
--- a/src/styles/index.scss
+++ b/src/styles/index.scss
@@ -2,4 +2,263 @@
 @import "./dc/index.scss";
 @import "./icon/index.scss";
 @import "./tool/index.scss";
-@import "./element-ui/element-ui.scss";
\ No newline at end of file
+@import "./element-ui/element-ui.scss";
+
+@font-face {
+  font-family: Roboto-Bold;
+  src: url(./font/Roboto-Bold.ttf);
+}
+.pageContainer {
+  color: #fff;
+  width: 100%;
+  .mt-15 {
+    margin-top: 15px;
+  }
+  .flex {
+    display: flex;
+    align-items: center;
+  }
+  .justify-between {
+    justify-content: space-between;
+  }
+  .justify-center {
+    justify-content: center;
+  }
+  .common-text {
+    font-size: 16px;
+    font-family: Alibaba PuHuiTi;
+    font-style: italic;
+    color: #F6F9FE;
+  }
+  .left-container,
+  .right-container {
+    display: flex;
+    flex-direction: column;
+    position: absolute;
+    top: 0;
+    width: 408px;
+    height: 100%;
+    pointer-events: auto;
+    background: rgba(28, 115, 195, 0.05);
+
+    &>div {
+      display: flex;
+      flex-direction: column;
+      flex-shrink: 0;
+
+      .title-box {
+        position: relative;
+        height: 38px;
+        line-height: 38px;
+        background: url(/images/title-box.png) no-repeat center / 100% 100%;
+
+        .title {
+          margin-left: 30px;
+          text-align: left;
+          font-size: 18px;
+          font-family: Alibaba PuHuiTi;
+          font-weight: bold;
+          font-style: italic;
+          color: transparent;
+          text-shadow: 0px 2px 8px rgba(5, 28, 55, 0.42);
+          background-image: linear-gradient(180deg, rgba(14, 197, 236, 0.36) 5%, rgba(49, 190, 255, 0.36) 20%, rgba(255, 255, 255, 1) 40%);
+          -webkit-background-clip: text;
+          -webkit-text-fill-color: transparen
+        }
+        .title-sub {
+          position: absolute;
+          right: 10px;
+          bottom: 4px;
+          line-height: 1;
+        }
+      }
+
+      .content-box {
+        flex: 1;
+      }
+    }
+    .chart-box {
+      // background:  rgba(42,64,120,0.68);
+    }
+  }
+  .common-empty {
+    padding-top: 46px;
+    display: flex;
+    justify-content: center;
+  }
+  .left-container {
+    left: 0;
+
+    .one {
+      height: 258px;
+      position: relative;
+      .content-data  {
+        padding-left: 18px;
+        &>.common-text {
+          margin-right: 8px
+        }
+      };
+      .data-item {
+        height: 26px;
+        line-height: 26px;
+        background: #879EC7;
+        border-radius: 6px;
+        padding: 0 15px;
+        margin-right: 12px;
+      }
+      .more-text {
+        position: absolute;
+        color: #3BCAFF;
+        right: 10px;
+        bottom: 36px;
+        cursor: pointer;
+      }
+    }
+
+    .two {
+      height: 454px;
+    }
+
+    .three {
+      flex: 1;
+    }
+  }
+
+  .right-container {
+    right: 0;
+
+    .one {
+      height: 266px;
+    }
+
+    .two {
+      height: 260px;
+    }
+
+    .three {
+      height: 210px;
+    }
+
+    .four {
+      flex: 1;
+    }
+  }
+  .scroll-table {
+    font-family: Alibaba PuHuiTi;
+    font-weight: 400;
+    font-style: italic;
+    color: #AFBED8;
+    .scroll-table-head {
+      height: 38px;
+      font-size: 16px;
+      border-bottom: 2px solid #6187E4;
+      background: rgba(42,64,120,0.68);
+      &>div {
+        flex: 1;
+        text-align: center;
+      }
+    }
+    .scroll-table-body {
+      overflow: hidden;
+      height: 155px;
+      margin-top: 10px;
+    }
+    .scroll-item {
+      margin-top: 5px;
+      height: 38px;
+      border: 1px solid rgba(36, 57, 110, 1);
+      background: rgba(36,57,110,0.34);
+      &>div {
+        text-align: center;
+        flex: 1;
+        color: #D4E8F8;
+        font-size: 14px;
+      }
+    }
+    .type-img {
+      margin-left: 5px;
+    }
+  }
+  .carousel-box {
+    position: relative;
+    .el-carousel__container {
+      height: 142px;
+    }
+    .card-item {
+      height: 142px;
+      width: 122px;
+      border: 1px solid rgba(110, 135, 197, .32);
+      background: rgba(36,57,110,0.34);
+      line-height: 1;
+      padding: 10px 0 0 0;
+      text-align: left;
+      text-indent: 10px;
+      .type-img {
+        margin-left: 5px;
+        position: relative;
+        top: 3px;
+      }
+      &>div:nth-of-type(2) {
+        margin-top: 10px;
+        & .num {
+          font-size: 20px;
+          font-family: Roboto-Bold;
+          font-weight: bold;
+        }
+      }
+      &>div:nth-of-type(3) {
+        margin-top: 8px;
+        color: #F7101A;
+      }
+      &>div:nth-of-type(4) {
+        margin-top: 12px;
+      }
+      &>div:nth-of-type(5) {
+        margin-top: 5px;
+      }
+    }
+    .justify-between {
+      padding: 0 10px;
+    }
+    .btn-item  {
+      width: 40px;
+      height: 40px;
+      cursor: pointer;
+    }
+    .btn-left {
+      background-image: url(./../../public/images/ctrl-left.png);
+    }
+    .btn-right {
+      margin-left: 3px ;
+      transform: rotate(180deg);
+    }
+  }
+  .big-num {
+    margin: 10px 0;
+    line-height: 1;
+    .num-num {
+      margin-left: 10px;
+      font-size: 48px;
+      font-family: Roboto-Bold;
+      font-weight: bold;
+    }
+    .num-text{
+      margin-left: 10px;
+    }
+  }
+  .big-section {
+    flex: 1;
+    .big-num {
+      padding-left: 30px;
+    }
+    .section-text {
+      height: 22px;
+      line-height: 22px;
+      text-align: right;
+    }
+    .time {
+      margin-top: 5px;
+      color: #B5C5D4;
+    }
+  }
+}
\ No newline at end of file

--
Gitblit v1.9.3