1

public/static/wap/css/trade.css

@@ -0,0 +1,165 @@
+.trade-content header{
+	height: 0.7rem;
+	width: 100%;
+	border-top:1px solid black;
+	display: flex;
+}
+.trade-content header section{
+	height: 0.7rem;
+	-webkit-flex-basis: 20%;
+	flex-basis: 20%;
+	padding-top: 0.15rem;
+}
+.trade-content header section p{
+	margin:0;
+	height: 0.2rem;
+	line-height: 0.2rem;
+	font-size: 0.12rem;
+	width: 100%;
+	text-align: left;
+	color: #737373;
+}
+.trade-content header section p:nth-of-type(2){
+	font-size: 0.16rem;
+	font-weight: 700;
+}
+.trade-content header section:nth-of-type(1){
+	padding: 0;
+	-webkit-flex-basis: 40%;
+	flex-basis: 40%;
+	font-size: 0.3rem;
+	text-align: center;
+	line-height: 0.7rem;
+	font-weight: 800;
+}
+.trade-content nav{
+	height: 0.4rem;
+	background: #252529;
+	display: flex;
+	width: 100%;
+	padding: 0 2%;
+}
+.trade-content nav section{
+	flex: 1;
+	color: #737373;
+	margin-top:0.03rem;
+	height: 0.34rem;
+	line-height: 0.34rem;
+	text-align: center;
+	font-size: 0.13rem;
+}
+.trade-content nav article{
+	padding: 0 0.02rem;
+	flex: 2;
+	height: 0.3rem;
+	display: flex;
+	border-radius:0.1rem ;
+	background: #17171a;
+	color: white;
+	margin-top:0.05rem ;
+}
+.trade-content nav article span{
+	display: inline-block;
+	height: 0.26rem;
+	margin-top:0.02rem;
+	flex: 1;
+	text-align: center;
+	font-weight: 700;
+	line-height: 0.26rem;
+}
+.trade-content nav article span.active{
+	color: #3b7eff;
+	background: #323237;
+	border-radius:0.1rem ;
+	box-shadow: 0 0 2px #3e3c42;
+	
+}
+.trade-content nav section.active{
+	color: #3b7eff;
+	border-bottom:1px solid #3b7eff ;
+}
+.trade-content footer{
+	width: 100%;
+	height: 72%;
+	position: relative;
+}
+.trade-content footer .history_chart{
+    position: absolute !important;
+    left: 0px;
+    right: 0px;
+    top: 0px;
+    height: 4.4rem;
+}
+.trade-content footer .chart-tip {
+    position: absolute;
+    left: 0.1rem;
+    top: -0.5%;
+    color: white;
+}
+
+.trade-content footer .func-tip {
+    position: absolute;
+    left: 0.1rem;
+    top: 70%;
+    color: white;
+}
+
+.trade-content footer .chart-tip > ul > li {
+    float: left;
+    margin-right: 5px;
+    font-size: 12px;
+}
+
+.trade-content footer .func-tip > ul > li {
+    float: left;
+    margin-right: 5px;
+    font-size: 12px;
+}
+
+.trade-content footer .history-open {
+    color: red;
+}
+
+.trade-content footer .history-close {
+    color: blue;
+}
+
+.trade-content footer .history-high {
+    color: green;
+}
+
+.trade-content footer .history-low {
+    color: yellow;
+}
+.trade-view .trade_bar{
+	position: absolute;
+	bottom: 0;
+	left: 0.1rem;
+	height: 0.5rem;
+    right: 0.1rem;
+	z-index: 9999;
+	display:flex;
+	justify-content:space-between;
+}
+.trade-view .trade_bar section{
+	flex: 0 0 32%;
+	height: 0.5rem;
+	font-size: 0.12rem;
+	text-align: center;
+	border-radius:5px;
+}
+.trade-view .trade_bar section p{
+	margin: 0;
+	height: 0.5rem;
+	line-height: 0.5rem;
+	color:#fff;
+}
+.trade-view .trade_bar section p span{
+	color: #3b7eff;
+}
+.trade-view .trade_bar section i{
+	font-size: 0.18rem;
+	display: block;
+	height: 0.2rem;
+	line-height: 0.2rem;
+}