1

src/App.vue

@@ -32,7 +32,8 @@ export default {
       // 需要切换主题的页面
       let paths = ["option", "exchange","contract"];
       if (paths.includes(current)) {
-        return this.theme + "-app";
+        // return this.theme + "-app";
+        return "";
       } else {
         return "";
       }
@@ -97,4 +98,7 @@ export default {
     }
   }
 }
+body{
+  background-color: #fff!important;
+}
 </style>

src/assets/js/tvStyle.js

@@ -8,7 +8,7 @@ let light={
 
 let dark = {
     // "paneProperties.background": "#222e3d",
-    "paneProperties.background": "#171A1E",
+    "paneProperties.background": "#FAFAFA",
     "paneProperties.vertGridProperties.color": "#646566",
     "paneProperties.horzGridProperties.color": "#646566",
     "scalesProperties.backgroundColor": "#222e3d",

src/assets/scss/base/_common.scss

@@ -358,13 +358,13 @@ $basew: 24;
 .el-range-editor.is-active,
 .el-input.el-date-editor .el-input__inner:focus,
 .el-input.is-focus .el-input__inner {
-    background-color: black;
+    background-color: #FAFAFA;
-    color: #F2F2F2;
+    color: #999;
-    border-color: #4e4e5d;
+    border: none;
 
     &:focus {
-        background-color: black;
+        background-color: #F5F5F5;
-        color: #F2F2F2;
+        color: #666;
     }
 
     &::-webkit-input-placeholder {
@@ -386,7 +386,7 @@ $basew: 24;
 
 .form-control:disabled,
 .form-control[readonly] {
-    background-color: #000000;
+    background-color: #fafafa;
     color: #999;
 }
 

src/assets/scss/base/_init.scss

@@ -40,7 +40,8 @@ tbody tr {
 }
 
 tbody tr:hover {
-	background: #141e2c;
+	// background: #141e2c;
+	background: #ffffde;
 }
 
 ::-webkit-scrollbar {

src/assets/scss/module/_contact-us.scss

@@ -3,7 +3,7 @@
     .light-purple{
     }
     .form-content{
-        background:#000 url('~@/assets/img/concat_us.png');
+        background:#fff url('~@/assets/img/concat_us.png');
         background-size: cover;
         max-width: 700px;
     }

src/assets/scss/module/_contract.scss

@@ -1,16 +1,20 @@
 .contract-page {
-    background: #212121;
+    background: #fff;
 
     .bg-plain {
         // background: $cls-white;
-        background: #171A1E;
+        background: #fff;
     }
 
     .page-top {
         padding-top: 1px;
+        background-color: #f5f5f5;
+        border-bottom: 1px solid #ebebeb;
 
         .kline-box {
-            background: $cls-white;
+            // background: $cls-white;
+            background: #fff;
+            // border: 1px solid #ebebeb;
 
             .coin-change {
                 height: 50px;
@@ -20,7 +24,8 @@
                 }
 
                 .el-button {
-                    color: $clr;
+                    // color: $clr;
+                    color: #666;
                 }
             }
         }
@@ -121,11 +126,10 @@
 .dark-app {
     $header: #2b2839;
     // $page-bg: #141e2c;
-    $page-bg: #171A1E;
+    $page-bg: #fff;
     // $head: #1e2834;
-    $head: #171A1E;
+    $head: #fff;
     $panel: #222e3d;
-    // $panel: #171A1E;
     $panel-1: #455c71;
     $border: #2a2e39;
     //$color: #c0c4cc;

src/assets/scss/module/_exchange.scss

@@ -1,11 +1,10 @@
 .dark-app {
   $header: #2b2839;
   // $page-bg: #141e2c;
-  $page-bg: #171A1E;
+  $page-bg: #fff;
   // $head: #1e2834;
-  $head: #171A1E;
+  $head: #fff;
   $panel:#222e3d;
-  // $panel:#171A1E;
   $panel-1: #455c71;
   $border: #2a2e39;
   // $color: #c0c4cc;
@@ -13,7 +12,8 @@
 
     background: $page-bg;
     .market-pairs,.order-book,.market-history,.market-news,.market-order{
-      border-color: $border;
+      // border-color: $border;
+      // border-color: #ebebeb;
     }
     .exchange-history .nav,.market-history .nav{
       background: $head;

src/assets/scss/module/_home.css

@@ -3789,11 +3789,6 @@ sub.transmoney-value {
   color: #1652f0;
 }
 
-.footer-bottom {
-  padding: 15px 0;
-  border-top: 1px solid rgba(255, 255, 255, 0.08);
-}
-
 .trade-volume-block {
   -webkit-box-ordinal-group: 3;
   -ms-flex-order: 2;

src/assets/scss/module/_home.scss

@@ -3726,8 +3726,8 @@ sub.transmoney-value {
 |----------------------------------------------------------------------------
 */
 .footer {
-  background: black;
+  background: #f5f5f5;
-  border-top: 1px solid #c7c7c7;
+  border-top: 1px solid #ddd;
 }
 
 .footer-upper-section {
@@ -3810,11 +3810,6 @@ sub.transmoney-value {
   color: #1652f0;
 }
 
-.footer-bottom {
-  padding: 15px 0;
-  border-top: 1px solid rgba(255, 255, 255, 0.08);
-}
-
 .trade-volume-block {
   -webkit-box-ordinal-group: 3;
   -ms-flex-order: 2;

src/assets/scss/module/_market-book.scss

@@ -22,7 +22,7 @@
   border: none;
 }
 .order-book {
-  border: 1px solid #FFFFFF;
+  border: 1px solid #ebebeb;
   border-radius: 2px;
 }
 .red-bg-80,

src/assets/scss/module/_market-history.scss

@@ -35,6 +35,6 @@
   width: 100%;
 }
 .market-history {
-  border: 1px solid #FFFFFF;
+  border: 1px solid #ebebeb;
   border-radius: 2px;
 }

src/assets/scss/module/_market-pairs.scss

@@ -1,5 +1,5 @@
 .market-pairs {
-	border: 1px solid #FFFFFF;
+	border: 1px solid #ebebeb;
 	padding-top: 14px;
 	border-radius: 2px;
 }

src/assets/scss/module/_market-trade.scss

@@ -24,7 +24,8 @@
 }
 
 .market-trade .nav .nav-item .nav-link.active {
-	background: #fff;
+	// background: #fff;
+	background: none;
 	color: #007bff;
 }
 

src/components/CommonFooter.vue

@@ -24,7 +24,7 @@
               style="
                 
                 font-size: 20px;
-                color: white;
+                color: #333;
                 font-weight: 700;
               "
             >
@@ -63,7 +63,7 @@
               style="
                 
                 font-size: 20px;
-                color: white;
+                color: #333;
                 font-weight: 700;
               "
             >
@@ -96,14 +96,14 @@
         <div class="item">
           <p
             class="item_p"
-            style="text-align: left; font-size: 20px; color: white"
+            style="text-align: left; font-size: 20px; color: #333"
           >
             {{ $t("common.contactUs") }}
           </p>
           <p class="foot_p" style="font-size: 14px">
             {{ $t("common.email") }}:
           </p>
-          <p class="foot_p" style="font-size: 14px; color: white">
+          <p class="foot_p" style="font-size: 14px; color: #666">
             {{ email }}
           </p>
         </div>
@@ -336,7 +336,7 @@ export default {
   // margin-left: 233px;
   justify-content: center;
   padding: 0 400px;
-  background-color: #000;
+  background-color: #f5f5f5;
   .footer-upper-section-left {
     display: flex;
     justify-content: space-between;
@@ -392,12 +392,13 @@ export default {
 .footer-bottom {
   width: 100%;
   height: 57px;
-  background-color: rgba(0, 0, 0, 1);
+  background-color: #F5F5F5;
   text-align: center;
-  border: 1px solid #0C0C0C;
+  border: 1px solid #ddd;
   .container {
     width: 100%;
-    height: 57px;
+    height: 55px;
+    line-height: 55px;
     margin: 0 auto;
   }
 }
@@ -408,16 +409,16 @@ export default {
 
 
 .foot_p {
-  color: #797979;
+  color: #bbb;
   font-size: 14px;
   margin: 0;
 
   a:hover {
-    color: #797979;
+    color: #bbb;
   }
 
   a:visited {
-    color: #797979;
+    color: #bbb;
   }
 }
 

src/components/CommonHeader.vue

@@ -608,9 +608,10 @@ color: #000 !important;
       
     }
     .btn-outline-light {
-      color: #fff !important;
+      color: #000 !important;
       
-      background-color: $underpainting;
+      // background-color: $underpainting;
+      background-color: #fff;
       
       &:hover {
         color: #000 !important;
@@ -631,8 +632,8 @@ color: #000 !important;
   .nav-bar .router-link-active {
     // color: #c99445;
     // color: black;
-    // color: #fff;
+    color: #F7D558;
-    border-bottom: 2px solid black;
+    border-bottom: 2px solid #F7D558;
     // background-color:rgba(53, 83, 210, 0.2) ;
   }
 

src/views/contactUs/index.vue

@@ -1,14 +1,14 @@
 <template>
-<div class="contact-us-page">
+<div class="contact-us-page" style="background-color: #fff;padding-bottom: 2rem;">
 
-    <div class="text-center mt-5 pt-5">
+    <div class="text-center pt-5" style="color: #333;">
-        <h2 class="">{{$t('contact.contact')}}</h2>
+        <h2>{{$t('contact.contact')}}</h2>
         <div class="h6 mt-3">{{$t('contact.help')}}</div>
     </div>
 
     <div class="body">
         <div class="container form-content rounded-sm mt-5 shadow py-4">
-            <div class="row">
+            <div class="row" style="color: #999;">
                 <!-- <div class="col-8 border-right">
                     <form class="cont-body">
                         <div class="form-group">

src/views/contract/account.vue

@@ -11,7 +11,7 @@
                 </router-link>
                 </div>
             </div>
-            <div class="">
+            <div class="" style="color: #999;">
                 <div class="d-flex p-3 justify-content-between">
                     <div>{{$t('contract.a2')}}（USDT）</div>
                     <div>{{ accountInfo.account_equity || "--" }}</div>

src/views/contract/exchange-store.vue

@@ -20,7 +20,7 @@
         >
           <div
             class="rounded border p-1 bg-black pointer"
-            slot="reference"
+            slot="reference" style="color: #999;"
             @click="visible = !visible"
           >
             {{ $t("contract.b0") }}
@@ -53,7 +53,7 @@
           <span class="input-group-text">USDT</span>
         </div>
       </div>
-      <div class="d-flex align-items-center" style="margin: 0.5rem 0;">
+      <div class="d-flex align-items-center" style="margin: 0.5rem 0;color: #666;">
         <div class="nav nav-pills">
           <div class="nav-item">
             <a style="display:block;padding:5px 0px;margin:0 15px 0 0;" :class="{ active: form.type == 1 }" @click="form.type = 1">
@@ -67,7 +67,7 @@
           </div>
         </div>
       </div>
-      <div class="d-flex">
+      <div class="d-flex" style="color: #666;">
           <div style="margin-right: 10px;">{{ $t("contract.a3") }}</div>
           <div>
             {{ accountInfo.usable_balance }} USDT
@@ -137,7 +137,7 @@
       </div>
       <!-- 开仓 -->
       <div v-if="tab == 1" class="kaicang">
-        <div class="d-flex justify-content-between mb-3">
+        <div class="d-flex justify-content-between mb-3" style="color: #999;">
             <div>{{ $t("contract.e1") }}：</div>
             <!-- {{$t("contract.e2")}} -->
             <div>{{ amount }} </div>
@@ -164,7 +164,7 @@
           <div>{{ shortPosition }} {{ $t("contract.e2") }}</div>
         </div>
       </div>
-      <div class="exchange_button" v-if="tab == 1">
+      <div class="exchange_button" v-if="tab == 1" style="color: #999;">
         <div class="px-1 flex-fill mb-4">
           <button
             @click="ifOpenPosition(1)"

src/views/contract/handicap.vue

@@ -44,7 +44,7 @@
             <!-- ({{ $t("contract.e2") }}) -->
           </div>
         </div>
-        <div class="sell">
+        <div class="sell" style="color: #666;">
           <template v-for="(item, idx) in sellListShow">
             <div
               class="item pointer"
@@ -76,7 +76,7 @@
             <!-- <button class="btn btn-sm btn-outline-primary fn-12">更多</button> -->
           </div>
         </div>
-        <div class="buy">
+        <div class="buy" style="color: #666;">
           <template v-for="(item, idx) in buyListShow">
             <div
               class="item pointer"
@@ -97,7 +97,7 @@
         </div>
       </div>
       <!-- 实时成交 -->
-      <div class="real-time p-3" v-if="tab == 2 || 1" style="height: 235px;overflow: hidden;">
+      <div class="real-time p-3" v-if="tab == 2 || 1" style="height: 235px;overflow: hidden;color: #666;">
         <div class="nav-item">{{ $t("contract.f8") }}</div>
         <div class="d-flex text-secondary fn-12">
           <div class="w-10/24">

src/views/contract/page-bottom.vue

@@ -100,9 +100,31 @@ export default {
   }
 };
 </script>
-<style scoped>
+<style scoped lang="scss">
 .bg-plain{
     width: 367px !important;
     font-size: 16px;
 }
+.markets-pair-list {
+  .nav-link.active{
+    color: #C7A048;
+  }
+  .nav-link:hover{
+    color: #C7A048;
+  }
+}
+/deep/ .table{
+  color: #666;
+}
+/deep/ thead th{
+  color: #999;
+}
+/deep/ .btn-danger{
+  background-color: #C7A048;
+  background-image: none;
+}
+/deep/ .btn-primary{
+  background-color: #F7D558;
+  background-image: none;
+}
 </style>

src/views/exchange/book-trades.vue

@@ -106,8 +106,8 @@
                         <tr v-for="(item, index) in tradeList" :key="index">
                             <td style="display:block;width:100%">
                                 <div class="w-33" :style="{color : item.color}">{{ item.price }}</div>
-                                <div class="w-33 text-right">{{ item.amount }}</div>
+                                <div class="w-33 text-right" style="color: #666;">{{ item.amount }}</div>
-                                <div class="w-33 text-right">{{ item.time }}</div>
+                                <div class="w-33 text-right" style="color: #666;">{{ item.time }}</div>
                             </td>
                         </tr>
 
@@ -381,4 +381,23 @@ export default {
     border: 1px solid #333;
     box-shadow: 0 0 5px #555;
 }
+/deep/ thead th{
+    color: #999;
+}
+.table td, .table th{
+    border-top: 1px solid #e0e0e0;
+}
+.order-item{
+    color: #666;
+    background-color: #f5f5f5!important;
+}
+.order-item tr{
+    background-color: #f5f5f5!important;
+}
+.order-item tr td{
+    background-color: #f5f5f5!important;
+}
+.ob-heading{
+    border: 1px solid #e0e0e0;
+}
 </style>

src/views/exchange/index.vue

@@ -7,7 +7,7 @@
 <!--          </el-carousel-item>-->
 <!--        </el-carousel>-->
 <!--    </div>-->
-    <div class="container-fluid mtb15 no-fluid">
+    <div class="container-fluid no-fluid" style="background-color: #f5f5f5;padding: 15px 0px;">
         <div class="row sm-gutters">
 
             <!-- symbols -->

src/views/exchange/make-deal.vue

@@ -748,4 +748,17 @@ export default {
     padding: 0!important;
     background: transparent!important;
 }
+.market-trade .input-group-text{
+    background-color: #f5f5f5;
+}
+.sellPercentActive a:link, .market-trade-sell .market-trade-list li a:hover{
+    background-color: #F7D558;
+    color: #fff!important;
+}
+/deep/ .chart-controls-bar{
+    background-color: #fff!important;
+}
+/deep/ #footer-chart-panel{
+    background-color: #fff!important;
+}
 </style>

src/views/exchange/symbols.vue

@@ -245,7 +245,16 @@ export default {
     vertical-align: top !important;
     width: 32% !important;
 }
-.active{
+.active, a:hover{
     color: #f0a70a!important;
 }
+thead th{
+    color: #999!important;
+}
+tbody tr{
+    color: #666;
+}
+.table td, .table th {
+    border-top: 1px solid #e0e0e0;
+}
 </style>

src/views/option/kline.vue

@@ -333,7 +333,7 @@ methods: {
             datafeed: Tdata,
             locale: _this.lang,
             // toolbar_bg: _this.theme == "black" ? "#f1f3f6" : "#222e3d",
-            toolbar_bg: _this.theme == "black" ? "#f1f3f6" : "#171A1E",
+            toolbar_bg: _this.theme == "black" ? "#f1f3f6" : "#fff",
             enable_publishing: false,
             withdateranges: true,
             hide_side_toolbar: false,
@@ -496,3 +496,6 @@ methods: {
   },
 };
 </script>
+<style scoped lang="scss">
+
+</style>

static/Kline/charting_library/static/css/tradingview_black.css

@@ -1,30 +1,32 @@
 .header-group-fullscreen{float: right;}
 .header-group-intervals > .intervals-container > .quick span{padding-left: 15px; padding-right: 15px;}
 .chart-page .header-chart-panel .my-group{float: left;}
-.separator-3cgsM4c1-{background-color: #2c303b;}
+.separator-3cgsM4c1-{background-color: #dbdbdb;}
 .chart-page .header-chart-panel .my-group.active .mydate,
 .feature-no-touch .chart-controls-bar-buttons a:not(.disabled):hover{background:linear-gradient(135deg,rgba(188,106,188,1) 0%,rgba(104,86,166,1) 100%);}
 .header-chart-panel .button,
 .feature-no-touch .header-chart-panel .button:active,
 /* .favored-list-container span{background-color: #222e3d; color: #758696; border-color: #222e3d;border-radius:3px;} */
-.favored-list-container span{background-color: #171A1E; color: #758696; border-color: #222e3d;border-radius:3px;}
+.favored-list-container span{background-color: #fff; color: #758696; border-color: #dbdbdb;border-radius:3px;}
 
 .chart-controls-bar-buttons a:before{border-color: #2c303b;}
 .button.indicators svg,
 .button.fullscreen svg,
 .button.properties svg{fill: #4e5b85;}
 .feature-no-touch .header-chart-panel .button:hover,
-.favored-list-container span.selected{background: #2c3b59; color: #58c3e5;}
+/* .favored-list-container span.selected{background: #2c3b59; color: #58c3e5;} */
-.feature-no-touch .favored-list-container span:hover{background: #2c3b59; color: #58c3e5;}
+.favored-list-container span.selected{background: #ffffde; color: #F7D558!important;}
+/* .feature-no-touch .favored-list-container span:hover{background: #2c3b59; color: #58c3e5;} */
+.feature-no-touch .favored-list-container span:hover{background: #ffffde; color: #F7D558;}
 /* .favored-list-container span.disabled{background: #171820; color: #4e5b85!important;} */
-.favored-list-container span.disabled{background: #171A1E; color: #4e5b85!important;}
+.favored-list-container span.disabled{background: #fff; color: #4e5b85!important;}
 
-.chart-page .chart-container{border-color: #2c303b;}
+.chart-page .chart-container{border-color: #a6a6a3;}
 
 .charting-mask{display: block; position: absolute; top: 38px; width: 100%; left: 0; bottom: 0;}
 
 /* .chart-page .layout__area--left [class^="drawingToolbar-"]{background: #222e3d!important;} */
-.chart-page .layout__area--left [class^="drawingToolbar-"]{background: #171A1E!important;}
+.chart-page .layout__area--left [class^="drawingToolbar-"]{background: #fff!important;}
 .bottom-widgetbar-content.backtesting .button, .header-chart-panel .button, .hotlist-controls .button, .symbol-edit-widget .button{
     padding:4px 4px;
 }