<!doctype html>
<html>

	<head>
		<meta charset="UTF-8">
		<title></title>
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no,viewport-fit=cover">
		<link href="../../lib/css/mui.min.css" rel="stylesheet" />
		<!--引入公共样式-->
		<link href="../../lib/css/basic.css" rel="stylesheet" />
		<link href="../../lib/css/icons-extra.css" rel="stylesheet" />
		<script src="../../lib/js/rem-layout.js"></script>
		<script type="text/javascript" src="../../lib/js/mui.min.js"></script>
		<script type="text/javascript" src="../../lib/js/mui.pullToRefresh.js"></script>
		<script type="text/javascript" src="../../lib/js/mui.pullToRefresh.material.js"></script>
		<script type="text/javascript" src="../../lib/js/vue.min.js"></script>
		<script type="text/javascript" src="../../lib/js/app.js"></script>
		<script type="text/javascript" src="../../lib/js/sockjs.min.js"></script>
		<script type="text/javascript" src="../../lib/js/stomp.min.js"></script>
		<style type="text/css">
			html,
			body {
				background: #FFFFFF;
			}
			
			.mui-slider-indicator.mui-segmented-control {
				color: #333333;
				margin: .05rem 0px;
			}
			
			.mui-icon,
			.mui-icon-extra {
				border: none !important;
				margin: 0 !important;
				font-size: 20px;
				line-height: 30px;
				width: 40px;
				height: 30px;
			}
			
			.mui-segmented-control.mui-segmented-control-inverted .mui-control-item.mui-active {
				color: #007aff;
				border-bottom: none;
				border-radius: .05rem;
				text-decoration: underline;
			}
			
			.mui-table-view-cell.mui-active {
				background-color: #EEEEEE;
			}
			
			.app-fullscreen {
				position: relative;
			}
			
			.dapp-table-view {
				background: #FFFFFF;
			}
			
			.dapp-table-view:before {
				height: 0;
			}
			
			.dapp-table-view:after {
				height: 0;
			}
			
			.dapp-table-view-cell {
				display: flex;
				align-items: center;
			}
			
			.dapp-table-view-cell:after {
				height: 0px;
			}
			
			.dapp-table-view-cell-head {
				padding: .15rem 5%;
				color: #FFFFFF;
			}
			
			.dapp-table-view-cell-head:after {
				position: absolute;
				right: 0;
				top: .78rem;
				left: 0;
				height: 1px;
				content: '';
				background-color: #EEEEEE;
			}
			
			.dapp-table-view-cell .dapp-market-info {
				font-size: .24rem;
				font-weight: 400;
				width: 30%;
				text-align: left;
				line-height: .43rem;
				color: #333333;
				flex: 1;
				margin-left: .3rem;
			}
			
			.dapp-table-view-cell-head .dapp-market-info {
				font-weight: 400;
			}
			
			.dapp-table-view-cell-head .dapp-market-info:last-child {
				width: 40%;
			}
			
			.dapp-table-view-cell .dapp-market-percent {
				width:1.12rem;
                height:.43rem;
				border-radius: .07rem;
				font-size: .2rem;
				font-weight: 600;
				color: #fff;
				text-align: center;
				line-height: .43rem;
			}
			
			.app-coin-percent-up {
				background: #73D13D;
				border-radius: 4px;
			}
			
			.app-coin-percent-down {
				background: #E32E33;
				border-radius: 4px;
			}
			
			.dapp-market-currency {
				color: #666666;
				font-size: .17rem;
			}
			
			.name2,
			.price2 {
				font-size: .2rem;
				font-weight: 400;
				color: #999999;
				line-height: .2rem;
				display: block;
				padding: .2rem 0;
			}
		</style>
	</head>

	<body>
		<div id="js-data-info">
			<header class="mui-bar mui-bar-nav">
				<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
				<h1 class="mui-title">{{langue.title}}</h1>
			</header>
			<div class="mui-content">
				<div class="app-fullscreen">
					<div id="app-scroll" class="mui-scroll">
						<div id="sliderSegmentedControl" class="mui-slider-indicator mui-segmented-control mui-segmented-control-inverted">
							<a id="choice-item" class="mui-control-item" href="#choice">
								{{langue.favorites}}
							</a>
							<a id="USDT-item" class="mui-control-item" href="#USDT">
								USDT
							</a>
						</div>
						<div id="USDT" class="mui-control-content">
							<ul id="USDT-ul" class="dapp-table-view mui-table-view">
								<!--<li class="dapp-table-view-cell mui-table-view-cell mui-media">
									<div class="dapp-market-info">
										<span class="name1">ETH<span class="dapp-market-currency">/USDT</span></span>
										<span class="name2">24H 2453333.56</span>
									</div>
									<div id="BTC-market" class="dapp-market-info">
										<span class="price1">0.0006744</span>
										<span class="price2">¥0.07</span>
									</div>
									<div id="BTC-percent" class="dapp-market-percent app-coin-percent-down ">-10.93%</div>
								</li>-->
								
							</ul>
						</div>
						<div id="choice" class="mui-control-content">
							<ul id="market-choice-ul" class="dapp-table-view mui-table-view">
							</ul>
						</div>
					</div>
				</div>
			</div>
		</div>
		</div>
	</body>
	<script type="text/javascript" src="js/market.js"></script>

</html>