#token_info { width: 100%; height: 87px; padding: 13px; margin-bottom: 10px; } .mode-dark #token_info { margin-top: 2px !important; } #token_info>.lbl .body_lightgray_13 { margin-bottom: 2px; } #token_info>.lbl .body_lightgray_13:last-child { margin-bottom: 0; } #token_info>.lbl>div { } #token_info>.lbl>div>span { display: inline-block; width: 32px; } #token_info select { text-align: left; border: none; -webkit-appearance: none; -moz-appearance: none; appearance: none; background: none; font-size: 18px; letter-spacing: -0.5px; height:27px; } select::-ms-expand { display: none; /* remove default arrow in IE 10 and 11 */ } #token_info .selectbox { margin-top: -2px; margin-bottom: 15px; } @media screen and (min-width:0\0) { select { background:none\9; } }
{{ priceOf(currentToken) }} EOS (${{ toUSDT(priceOf(currentToken)) }}) {{ prices[currentToken['code'] + '::' + currentToken['symbol']] ? (prices[currentToken['code'] + '::' + currentToken['symbol']]['percent'].format(2) > 0 ? '+' : '') + prices[currentToken['code'] + '::' + currentToken['symbol']]['percent'].format(2) + '%' : '0.00%' }}
Vol. {{ prices[currentToken['code'] + '::' + currentToken['symbol']] ? prices[currentToken['code'] + '::' + currentToken['symbol']]['total24h_quantity'] : '' }} {{ currentToken['symbol'] }}
High {{ prices[currentToken['code'] + '::' + currentToken['symbol']] ? prices[currentToken['code'] + '::' + currentToken['symbol']]['max_per_eos'] : '0.00000000' }} EOS{{ (' ($' + toUSDT(parseFloat(prices[currentToken['code'] + '::' + currentToken['symbol']] ? prices[currentToken['code'] + '::' + currentToken['symbol']]['max_per_eos'] : '0.0000')) + ')') }}
Low {{ prices[currentToken['code'] + '::' + currentToken['symbol']] ? prices[currentToken['code'] + '::' + currentToken['symbol']]['min_per_eos'] : '0.00000000' }} EOS{{ (' ($' + toUSDT(parseFloat(prices[currentToken['code'] + '::' + currentToken['symbol']] ? prices[currentToken['code'] + '::' + currentToken['symbol']]['min_per_eos'] : '0.0000')) + ')') }}
willExecute.push(function() { var arrowWidth = 2; $.fn.resizeselect = function(settings) { return this.each(function() { $(this).change(function(){ var $this = $(this); // create test element var text = $this.find("option:selected").text(); var $test = $("<span>").html(text).css({ "font-size": $this.css("font-size"), // ensures same size text "visibility": "hidden" // prevents FOUC }); // add to parent, get width, and get out $test.appendTo($this.parent()); var width = $test.width(); $test.remove(); // set select width $this.width(width + arrowWidth); // run on start }).change(); }); }; // run by default $("select.resizeselect").resizeselect(); });
#chart { width: 730px; margin-right: 10px; } #chart>#tv_chart { width: 100%; height: 459px; } #chart>#tv_chart>iframe { width: 100%; height: 100%; } #chart>.header>.di_left>.resolution { cursor: pointer; display: inline-block; width: 30px; height: 20px; margin-right: 2px; text-align: center; } #chart>.header>.di_left>.resolution:hover, #chart>.header>.di_left>.resolution.active { font-weight: 500; text-decoration: underline; } @media (max-width: 640px) { #chart { margin-right: 10px; } #chart>#tv_chart { width: 100%; height: 240px; } #chart>.header>.di_left>.resolution { width: 24px; } }
CHART {{ currentToken['symbol'] }} 1m 5m 15m 30m 1h 4h 1d
{{ currentMode() == 'light' ? 'Light Mode' : 'Dark Mode' }}
// Create Chart willExecuteForVue.push(function() { TradingView.onready(function() { const supportedResolutions = ["1", "5", "15", "30", "60", "240", "D", "W", "M"]; const config = { supported_resolutions: supportedResolutions } var widget = window.tvWidget = new TradingView.widget({ // debug: true, // uncomment this line to see Library errors and warnings in the console // fullscreen: true, symbol: app.currentToken['code'] + '::' + app.currentToken['symbol'], interval: '30', container_id: "tv_chart", // BEWARE: no trailing slash is expected in feed URL datafeed: { onReady: cb => { console.log('=====onReady running'); setTimeout(function() { cb(config); }, 0); tvWidget.addCustomCSSFile('/css/tv.css'); }, searchSymbols: (userInput, exchange, symbolType, onResultReadyCallback) => { console.log('====Search Symbols running'); }, resolveSymbol: (symbolName, onSymbolResolvedCallback, onResolveErrorCallback) => { if(!$('.be-wrapper').hasClass('mode-light')) { tvWidget.applyOverrides({ "paneProperties.background":"#242933", "paneProperties.vertGridProperties.color":"#1D2229", "paneProperties.horzGridProperties.color":"#1D2229" }) } else { tvWidget.applyOverrides({ "paneProperties.background":"#FFFFFF", "paneProperties.vertGridProperties.color":"#E6E6E6", "paneProperties.horzGridProperties.color":"#E6E6E6" }) } // expects a symbolInfo object in response console.log('======resolveSymbol running'); console.log(symbolName); // console.log('resolveSymbol:',{symbolName}) // console.log({split_data}) var symbol_stub = { name: symbolName, description: '', type: 'crypto', session: '24x7', timezone: 'Etc/UTC', ticker: symbolName, minmov: 1, pricescale: 100000000, has_intraday: true, intraday_multipliers: ['1', '60'], supported_resolution: supportedResolutions, volume_precision: 4, data_status: 'streaming', }; // if (split_data[2].match(/USD|EUR|JPY|AUD|GBP|KRW|CNY/)) { // symbol_stub.pricescale = 100; // } setTimeout(function() { onSymbolResolvedCallback(symbol_stub); console.log('Resolving that symbol....', symbol_stub); }, 0) // onResolveErrorCallback('Not feeling it today') }, getBars: function(symbolInfo, resolution, from, to, onHistoryCallback, onErrorCallback, firstDataRequest) { console.log('=====getBars running') console.log(symbolInfo, resolution, moment(new Date(from*1000)).format('YYYYMMDDHHmm'), moment(new Date(to*1000)).format('YYYYMMDDHHmm'), onHistoryCallback, onErrorCallback, firstDataRequest); // console.log('function args',arguments) // console.log(`Requesting bars between ${new Date(from * 1000).toISOString()} and ${new Date(to * 1000).toISOString()}`) $.ajax({ 'url': '/api/v1/chart', 'data': { 'code': symbolInfo['name'].split('::')[0], 'symbol': symbolInfo['name'].split('::')[1], 'resolution': resolution, 'from': moment(new Date(from*1000)).format('YYYYMMDDHHmm'), 'to': moment(new Date(to*1000)).format('YYYYMMDDHHmm'), }, success: function(res) { const bars = []; if(res && res.result && res.result.length > 0) { const length = res.result.length; for (var i = 0; i < length; i++) { const bar = JSON.parse(res.result[i]); bars.push({ time: (new Date(bar.timestamp)).getTime(), //TradingView requires bar time in ms low: bar.low, high: bar.high, open: bar.open, close: bar.close, volume: bar.volume }); } } for(var i = 0; i < bars.length - 1; i++) { if(bars[i].time > bars[i + 1].time) { console.log(i, new Date(bars[i].time), bars[i]); console.log(i+1, new Date(bars[i+1].time), bars[i+1]); } } if(firstDataRequest) { app.lastBars[symbolInfo['name']] = res.result && res.result.length > 0 ? res.result[res.result.length-1] : {}; } onHistoryCallback(bars, { noData: bars.length > 0 ? false : true }); }, error: function(res) { onHistoryCallback([], { noData: true }); } }); }, subscribeBars: (symbolInfo, resolution, onRealtimeCallback, subscribeUID, onResetCacheNeededCallback) => { console.log('=====subscribeBars runnning'); app.realtimeCallbacks[symbolInfo['name'].split('::')[1]] = { 'symbolInfo': symbolInfo, 'resolution': resolution, 'callback': onRealtimeCallback, }; }, unsubscribeBars: subscriberUID => { console.log('=====unsubscribeBars running'); }, calculateHistoryDepth: (resolution, resolutionBack, intervalBack) => { //optional console.log('=====calculateHistoryDepth running'); // while optional, this makes sure we request 24 hours of minute data at a time // CryptoCompare's minute data endpoint will throw an error if we request data beyond 7 days in the past, and return no data return resolution < 60 ? {resolutionBack: 'D', intervalBack: '1'} : undefined; }, getMarks: (symbolInfo, startDate, endDate, onDataCallback, resolution) => { //optional console.log('=====getMarks running'); }, getTimeScaleMarks: (symbolInfo, startDate, endDate, onDataCallback, resolution) => { //optional console.log('=====getTimeScaleMarks running'); }, getServerTime: cb => { console.log('=====getServerTime running'); } }, library_path: "/js/charting_library/", locale: 'en', // Regression Trend-related functionality is not implemented yet, so it's hidden for a while disabled_features: ["control_bar", "timeframes_toolbar", "header_widget", "header_symbol_search", "symbol_info", "header_compare", "header_chart_type", "display_market_status", "symbol_search_hot_key", "compare_symbol", "border_around_the_chart", "remove_library_container_border", "symbol_info", "header_interval_dialog_button", "show_interval_dialog_on_key_press", "volume_force_overlay", "header_saveload", "header_undo_redo", "header_screenshot", "legend_context_menu", "scales_context_menu", "main_series_scale_menu"], enabled_features: ["dont_show_boolean_study_arguments", "move_logo_to_main_pane","hide_left_toolbar_by_default","hide_last_na_study_output"], overrides:{ "paneProperties.background":"#242933", "paneProperties.vertGridProperties.color":"#1D2229", "paneProperties.horzGridProperties.color":"#E6E6E61D2229", "mainSeriesProperties.showCountdown":false,"volumePaneSize":"medium","symbolWatermarkProperties.transparency":85,"scalesProperties.backgroundColor":"#151a1e","scalesProperties.textColor":"#555","paneProperties.crossHairProperties.color":"#888888","scalesProperties.lineColor":"#555","symbolWatermarkProperties.color":"rgba(0, 0, 0, 0)","mainSeriesProperties.style":1,"mainSeriesProperties.candleStyle.upColor":"#70a800","mainSeriesProperties.candleStyle.downColor":"#ea0070","mainSeriesProperties.candleStyle.drawWick":true,"mainSeriesProperties.candleStyle.drawBorder":true,"mainSeriesProperties.candleStyle.borderColor":"#C400CB","mainSeriesProperties.candleStyle.borderUpColor":"#70a800","mainSeriesProperties.candleStyle.borderDownColor":"#ea0070","mainSeriesProperties.candleStyle.wickUpColor":"#70a800","mainSeriesProperties.candleStyle.wickDownColor":"#ea0070","study_Overlay@tv-basicstudies.barStyle.upColor":"blue","study_Overlay@tv-basicstudies.barStyle.downColor":"blue","study_Overlay@tv-basicstudies.lineStyle.color":"blue","study_Overlay@tv-basicstudies.areaStyle.color1":"blue","study_Overlay@tv-basicstudies.areaStyle.color2":"blue","study_Overlay@tv-basicstudies.areaStyle.linecolor":"blue"}, studiesOverrides: {"volume.volume.color.0":"#ea0070","volume.volume.color.1":"#70a800"}, charts_storage_url: 'http://saveload.tradingview.com', charts_storage_api_version: "1.1", client_id: 'tradingview.com', user_id: 'public_user_id', }); }); });
#trade_history { width: 360px; margin-top: 10px; margin-right: 10px; } #trade_history>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #trade_history>.table-header { } #trade_history>.de-table>.de-row>.date { width: 108px; } #trade_history>.de-table>.de-row>.qty_price { width: 160px; } #trade_history>.de-table>.de-row>.view_tx { } #trade_history>.table-body { height: 290px; overflow-y: auto; } #trade_history>.table-body>.de-row { width: 100%; height: 58px; border-bottom: 1px solid #DDDDDD; } .mode-dark #trade_history>.table-body>.de-row { border-color: #242933; }
TRADE HISTORY {{ currentToken['symbol'] }}
MARKET MY
Date Qty. @ Price
{{ formatDateWithTime(history[0]) }} {{ history[4].format(currentToken['decimal']) }}
{{ currentToken['symbol'] }} @ {{ history[5].format(8) }} EOS
View TX Dropped Tx
{{ formatDateWithTime(tx['transaction_register_date']) }}
{{ tx['transaction_buyer_account_name'] == (account ? account['account_name'] : '') ? 'BUY' : 'SELL' }}
{{ tx['transaction_quantity'].format(currentToken['decimal']) }}
{{ currentToken['symbol'] }} @ {{ tx['transaction_per_eos'].format(8) }} EOS
View TX Dropped Tx
There are no transactions yet.
You will see the details here when the buy/sell transaction is completed.
#my_open_orders { width: 360px; margin-top: 10px; margin-right: 10px; } #my_open_orders>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #my_open_orders>.table-header { } #my_open_orders>.de-table>.de-row>.date { width: 108px; } #my_open_orders>.de-table>.de-row>.order_remain { width: 174px; } #my_open_orders>.de-table>.de-row>.view_tx { } #my_open_orders>.table-body { height: 290px; overflow-y: auto; } #my_open_orders>.table-body>.de-row { width: 100%; min-height: 58px; border-bottom: 1px solid #DDDDDD; } .mode-dark #my_open_orders>.table-body>.de-row { border-color: #242933; }
MY OPEN ORDERS
ALL {{ currentToken['symbol'] }}
Date Remain / Order
{{ formatDateWithTime(order['trade_register_date']) }}
{{ typeToString(order.trade_type) }}
{{ order['trade_amount'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }} / {{ order['trade_quantity'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }}
{{ order['trade_symbol'] }} @ {{ order['trade_per_eos'].toFixed(8) }} EOS
View TX
Cancel
{{ formatDateWithTime(order['trade_register_date']) }}
{{ typeToString(order.trade_type) }}
{{ order['trade_amount'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }} / {{ order['trade_quantity'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }}
{{ order['trade_symbol'] }} @ {{ order['trade_per_eos'].toFixed(8) }} EOS
View TX
Cancel
No order history yet.
You will see the details here, when you register your order.
#orderbook { width: 360px; } #orderbook .de-table>.de-row>.price { width: 78px; } #orderbook .de-table>.de-row>.qty { width: 120px; text-align: right; } #orderbook .de-table>.de-row>.qty_eos { float: right; } #orderbook>.order-container { width: 100%; } #orderbook>.order-container.half { width: 50%; } #orderbook>.order-container>.orders { } #orderbook>.order-container>.orders>.order { position: relative; cursor: pointer; width: 100%; height: 24px; padding: 3px 12px; border-bottom: 1px solid #DDDDDD; } #orderbook>.order-container>.orders>.order:last-child { border-bottom: none; } .mode-light #orderbook>.order-container>.orders>.order { background: #FFFFFF; } .mode-dark #orderbook>.order-container>.orders>.order { background: #242933; } #orderbook>.buy.order-container>.orders { border-right: 1px solid #DDDDDD; } .mode-dark #orderbook>.order-container>.orders, .mode-dark #orderbook>.order-container>.orders>.order { border-color: #242933; } #orderbook>.order-container>.orders>.order>.stick { position: absolute; height: 23px; } #orderbook>.buy.order-container>.orders>.order>.stick { top: 0; right: 0; background-color: rgba(0, 153, 51, 0.15); } #orderbook>.sell.order-container>.orders>.order>.stick { top: 0; right: 0; background-color: rgba(255, 51, 58, 0.15); } .mode-dark #orderbook>.buy.order-container>.orders>.order>.stick { /* background-color: rgba(0, 153, 51, 0.3); */ } .mode-dark #orderbook>.sell.order-container>.orders>.order>.stick { /* background-color: rgba(255, 51, 58, 0.3); */ } #orderbook>.order-container>.request { width: 100%; border-top: 1px solid #DDDDDD; } #orderbook>.buy.order-container>.request { border-right: 1px solid #DDDDDD; } .mode-dark #orderbook>.order-container>.request { border-color: #242933; } #orderbook>.order-container>.request>.title { padding: 7px 12px; } .mode-light #orderbook>.order-container>.request>.title { border-bottom: 1px solid #dddddd; background-color: #f6f8fa; } .mode-dark #orderbook>.order-container>.request>.title { background-color: #353b4a; } #orderbook>.order-container>.request>.order-form{ display: block; text-align: center; padding: 12px; } #orderbook>.order-container>.request>.order-form>.field { position: relative; width: 100%; height: 19px; margin-bottom: 10px; text-align: center; } #orderbook>.order-container>.request>.order-form>.field { } #orderbook>.order-container>.request>.order-form>.field>input { position: absolute; top: 0; left: 35px; width: 80px; height: 19px; background: none; border: none; } #orderbook>.buy.order-container>.request>.order-form>.field>input:placeholder-shown, #orderbook>.buy.order-container>.request>.order-form>.field>input:focus { border-bottom: 1px solid #009933; } #orderbook>.sell.order-container>.request>.order-form>.field>input:placeholder-shown, #orderbook>.sell.order-container>.request>.order-form>.field>input:focus { border-bottom: 1px solid #FF333A; } #orderbook>.order-container>.request>.order-form>.fee.field { margin-bottom: 15px; } #orderbook>.order-container>.request>.order-form>button { width: 156px; height: 40px; border-radius: 3px; border: none; } #orderbook>.buy.order-container>.request>.order-form>button { background: #009933; } #orderbook>.sell.order-container>.request>.order-form>button { background: #FF333A; } #orderbook>.price { width: 100%; height: 32px; background-color: #ffffff; border: solid 1px #dddddd; border-left: none; border-right: none; text-align: center; padding: 5px; font-size: 15px; font-weight: 500; } #orderbook>.order-container>.request>.order-form>.pct-qty { height: 26px; } #orderbook .field .percent-selectbox { display: inline-block; max-width: 100%; position: relative; vertical-align: top; } #orderbook .field .percent-selectbox select { color: #999999; cursor: pointer; display: block; max-width: 100%; -moz-appearance: none; -webkit-appearance: none; appearance: none; align-items: center; border: 0; box-shadow: none; line-height: 1.5; padding-bottom: 3px; padding-left: 10px; padding-top: 3px; padding-right: 2.5em; position: relative; vertical-align: top; background-color: transparent; font-size: 12px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: -0.5px; outline: 0; border-radius: 0; } #orderbook .field .percent-selectbox::after { box-sizing: inherit; border: 2px solid transparent; border-radius: 1px; border-right: 0; border-top: 0; content: " "; display: block; height: 8px; margin-top: -5.5px; pointer-events: none; position: absolute; top: 50%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: center; transform-origin: center; width: 8px; border-color: #999999; right: 7px; z-index: 4; } .mode-dark #orderbook .field .percent-selectbox select { border: 1px solid #444444; box-sizing: border-box; } .mode-light #orderbook .field .percent-selectbox select { border: 1px solid #dddddd; } #orderbook>.order-container>.request>.order-form>.price.field, #orderbook>.order-container>.request>.order-form>.total.field { margin-bottom: 2px; } .mode-dark #orderbook>.price { background-color: #242933; border-color: #242933; } .amount-selector { cursor: pointer; position: absolute; top: 1px; right: -16px; width: 18px; height: 20px; background: none; border: none; text-align: center; } .amount-selector>ul { display: none; z-index: 1; position: absolute; border-bottom: 1px solid #CCCCCC; } .amount-selector>ul>li { padding: 2px 4px; background: #FFFFFF; border: 1px solid #CCCCCC; border-bottom: none; } .mode-dark .amount-selector>ul { border-bottom: 1px solid #555555; } .mode-dark .amount-selector>ul>li { background: #333333; border: 1px solid #555555; border-bottom: none; }
ORDERBOOK {{ currentToken['symbol'] }}
Price Qty. ({{ currentToken['symbol'] }}) Total (EOS)
{{ trade.trade_per_eos.toFixed(8) }}
{{ priceOf(currentToken) }} EOS (${{ toUSDT(priceOf(currentToken)) }})
{{ trade.trade_per_eos.toFixed(8) }}
BUY ORDER
Price EOS
Qty. {{ currentToken['symbol'] }}
Total EOS
Fee EOS
SELL ORDER
Price EOS
Qty. {{ currentToken['symbol'] }}
Total EOS
Fee EOS
#all_tokens { width: 360px; margin-top: 10px; margin-right: 10px; } #all_tokens>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #all_tokens>.table-header { } #all_tokens>.de-table>.de-row>.star-symbol-container>.star { cursor: pointer; width: 20px; margin-top: 9px; } #all_tokens>.de-table>.de-row>.name_symbol { width: 120px; } #all_tokens .price { display: inline-block; width:100px; } #all_tokens>.de-table>.de-row>.percent_vol { } #all_tokens>.table-body { max-height: 230px; overflow-y: auto; } #all_tokens>.table-body>.de-row { display: inline-block; cursor: pointer; width: 100%; height: 58px; border-bottom: 1px solid #DDDDDD; padding: 10px; } #all_tokens .star-symbol-container { width: 140px; display: inline-block; float: left; } .mode-dark #all_tokens>.table-body>.de-row { border-color: #242933; } @media (max-width:640px) { #all_tokens .price { width: 120px; } #all_tokens .star-symbol-container{ width: 170px; } } @media (max-width:400px) { #all_tokens .star-symbol-container{ width: 140px; } }
ALL TOKENS Price
24h % / vol.
{{ (token['star'] ? '★' : '☆') }} {{ all_names[token['code'] + '::' + token['symbol']] ? all_names[token['code'] + '::' + token['symbol']] : token['code'] + '::' + token['symbol'] }}
{{ token['symbol'] }}/EOS
{{ priceOf(token) }}
${{ toUSDT(priceOf(token)) }}
{{ prices[token['code'] + '::' + token['symbol']] ? (prices[token['code'] + '::' + token['symbol']]['percent'].format(2) > 0 ? '+' : '') + prices[token['code'] + '::' + token['symbol']]['percent'].format(2) + '%' : '0.00%' }}
{{ prices[token['code'] + '::' + token['symbol']] ? parseFloat(prices[token['code'] + '::' + token['symbol']]['total24h_eos']) : '0.0000' }}
#my_balance { width: 360px; margin-top: 10px; } #my_balance .total-summary { border-top: 1px solid #dddddd; background-color: white; display: flex; align-items: center; height: 58px; width: 100%; padding-left: 10px; } #my_balance .total-summary>.balance { display: block; } #my_balance>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #my_balance>.table-header { } #my_balance>.de-table>.de-row>.star { cursor: pointer; width: 18px; margin-top: 9px; } #my_balance .name_symbol, #total-summary .name_symbol { width: 140px; } #my_balance>.de-table>.de-row>.price { } #my_balance>.de-table>.de-row>.percent_vol { } #my_balance>.table-body { height: calc(230px - 58px); overflow-y: auto; } #my_balance>.table-body>.de-row { cursor: pointer; width: 100%; height: 58px; border-bottom: 1px solid #DDDDDD; padding: 10px; } #my_balance>.table-body>.de-row:last-child { border-bottom: 0; } .mode-dark #my_balance>.table-body>.de-row { border-color: #242933; } .mode-dark #my_balance .total-summary { border-top: 1px solid transparent; background-color: #242933; } @media (max-width:640px) { #my_balance .name_symbol, #total-summary .name_symbol{ width: 170px; } } @media (max-width:400px) { #my_balance .name_symbol, #total-summary .name_symbol{ width: 140px; } }
MY BALANCES
Total
EOS
EOS
{{ balances['eosio.token::EOS'] ? balances['eosio.token::EOS']['balance'].split(' ')[0].format(4) + ' ' + 'EOS' : '0.0000 EOS' }}
${{ toUSDT(balances['eosio.token::EOS'] ? balances['eosio.token::EOS']['balance'].split(' ')[0] : 0) }}
DEXEOS Penny
PEN/EOS
{{ balances[dexeosConfig.account_name + '::PEN'] ? balances[dexeosConfig.account_name + '::PEN']['balance'].split(' ')[0].format(4) + ' ' + 'PEN' : '0.0000 PEN' }}
{{ (((balances[dexeosConfig.account_name + '::PEN'] ? balances[dexeosConfig.account_name + '::PEN']['balance'].split(' ')[0] : 0)/100000000).toFixed(4)) }} EOS (${{ toUSDT(((balances[dexeosConfig.account_name + '::PEN'] ? balances[dexeosConfig.account_name + '::PEN']['balance'].split(' ')[0] : 0)/100000000)) }})
{{ all_names[token['code'] + '::' + token['symbol']] ? all_names[token['code'] + '::' + token['symbol']] : token['code'] + '::' + token['symbol'] }}
{{ token['symbol'] }}/EOS
{{ quantityFrom(token['code'], token['symbol']).split(' ')[0].format(token['decimal']) + ' ' + token['symbol'] }}
{{ parseFloat((parseFloat(quantityFrom(token['code'], token['symbol']).split(' ')[0] * priceOf(token))).toFixed(4)) + ' EOS' }} (${{ toUSDT(quantityFrom(token['code'], token['symbol']).split(' ')[0] * priceOf(token)) }})
Total
{{ getTotalEOS() }} EOS
${{ toUSDT(getTotalEOS()) }}
#trade_history { width: 360px; margin-top: 10px; margin-right: 10px; } #trade_history>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #trade_history>.table-header { } #trade_history>.de-table>.de-row>.date { width: 108px; } #trade_history>.de-table>.de-row>.qty_price { width: 160px; } #trade_history>.de-table>.de-row>.view_tx { } #trade_history>.table-body { height: 290px; overflow-y: auto; } #trade_history>.table-body>.de-row { width: 100%; height: 58px; border-bottom: 1px solid #DDDDDD; } .mode-dark #trade_history>.table-body>.de-row { border-color: #242933; }
TRADE HISTORY {{ currentToken['symbol'] }}
MARKET MY
Date Qty. @ Price
{{ formatDateWithTime(history[0]) }} {{ history[4].format(currentToken['decimal']) }}
{{ currentToken['symbol'] }} @ {{ history[5].format(8) }} EOS
View TX Dropped Tx
{{ formatDateWithTime(tx['transaction_register_date']) }}
{{ tx['transaction_buyer_account_name'] == (account ? account['account_name'] : '') ? 'BUY' : 'SELL' }}
{{ tx['transaction_quantity'].format(currentToken['decimal']) }}
{{ currentToken['symbol'] }} @ {{ tx['transaction_per_eos'].format(8) }} EOS
View TX Dropped Tx
There are no transactions yet.
You will see the details here when the buy/sell transaction is completed.
#my_open_orders { width: 360px; margin-top: 10px; margin-right: 10px; } #my_open_orders>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #my_open_orders>.table-header { } #my_open_orders>.de-table>.de-row>.date { width: 108px; } #my_open_orders>.de-table>.de-row>.order_remain { width: 174px; } #my_open_orders>.de-table>.de-row>.view_tx { } #my_open_orders>.table-body { height: 290px; overflow-y: auto; } #my_open_orders>.table-body>.de-row { width: 100%; min-height: 58px; border-bottom: 1px solid #DDDDDD; } .mode-dark #my_open_orders>.table-body>.de-row { border-color: #242933; }
MY OPEN ORDERS
ALL {{ currentToken['symbol'] }}
Date Remain / Order
{{ formatDateWithTime(order['trade_register_date']) }}
{{ typeToString(order.trade_type) }}
{{ order['trade_amount'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }} / {{ order['trade_quantity'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }}
{{ order['trade_symbol'] }} @ {{ order['trade_per_eos'].toFixed(8) }} EOS
View TX
Cancel
{{ formatDateWithTime(order['trade_register_date']) }}
{{ typeToString(order.trade_type) }}
{{ order['trade_amount'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }} / {{ order['trade_quantity'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }}
{{ order['trade_symbol'] }} @ {{ order['trade_per_eos'].toFixed(8) }} EOS
View TX
Cancel
No order history yet.
You will see the details here, when you register your order.
#all_tokens { width: 360px; margin-top: 10px; margin-right: 10px; } #all_tokens>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #all_tokens>.table-header { } #all_tokens>.de-table>.de-row>.star-symbol-container>.star { cursor: pointer; width: 20px; margin-top: 9px; } #all_tokens>.de-table>.de-row>.name_symbol { width: 120px; } #all_tokens .price { display: inline-block; width:100px; } #all_tokens>.de-table>.de-row>.percent_vol { } #all_tokens>.table-body { max-height: 230px; overflow-y: auto; } #all_tokens>.table-body>.de-row { display: inline-block; cursor: pointer; width: 100%; height: 58px; border-bottom: 1px solid #DDDDDD; padding: 10px; } #all_tokens .star-symbol-container { width: 140px; display: inline-block; float: left; } .mode-dark #all_tokens>.table-body>.de-row { border-color: #242933; } @media (max-width:640px) { #all_tokens .price { width: 120px; } #all_tokens .star-symbol-container{ width: 170px; } } @media (max-width:400px) { #all_tokens .star-symbol-container{ width: 140px; } }
ALL TOKENS Price
24h % / vol.
{{ (token['star'] ? '★' : '☆') }} {{ all_names[token['code'] + '::' + token['symbol']] ? all_names[token['code'] + '::' + token['symbol']] : token['code'] + '::' + token['symbol'] }}
{{ token['symbol'] }}/EOS
{{ priceOf(token) }}
${{ toUSDT(priceOf(token)) }}
{{ prices[token['code'] + '::' + token['symbol']] ? (prices[token['code'] + '::' + token['symbol']]['percent'].format(2) > 0 ? '+' : '') + prices[token['code'] + '::' + token['symbol']]['percent'].format(2) + '%' : '0.00%' }}
{{ prices[token['code'] + '::' + token['symbol']] ? parseFloat(prices[token['code'] + '::' + token['symbol']]['total24h_eos']) : '0.0000' }}
#my_balance { width: 360px; margin-top: 10px; } #my_balance .total-summary { border-top: 1px solid #dddddd; background-color: white; display: flex; align-items: center; height: 58px; width: 100%; padding-left: 10px; } #my_balance .total-summary>.balance { display: block; } #my_balance>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #my_balance>.table-header { } #my_balance>.de-table>.de-row>.star { cursor: pointer; width: 18px; margin-top: 9px; } #my_balance .name_symbol, #total-summary .name_symbol { width: 140px; } #my_balance>.de-table>.de-row>.price { } #my_balance>.de-table>.de-row>.percent_vol { } #my_balance>.table-body { height: calc(230px - 58px); overflow-y: auto; } #my_balance>.table-body>.de-row { cursor: pointer; width: 100%; height: 58px; border-bottom: 1px solid #DDDDDD; padding: 10px; } #my_balance>.table-body>.de-row:last-child { border-bottom: 0; } .mode-dark #my_balance>.table-body>.de-row { border-color: #242933; } .mode-dark #my_balance .total-summary { border-top: 1px solid transparent; background-color: #242933; } @media (max-width:640px) { #my_balance .name_symbol, #total-summary .name_symbol{ width: 170px; } } @media (max-width:400px) { #my_balance .name_symbol, #total-summary .name_symbol{ width: 140px; } }
MY BALANCES
Total
EOS
EOS
{{ balances['eosio.token::EOS'] ? balances['eosio.token::EOS']['balance'].split(' ')[0].format(4) + ' ' + 'EOS' : '0.0000 EOS' }}
${{ toUSDT(balances['eosio.token::EOS'] ? balances['eosio.token::EOS']['balance'].split(' ')[0] : 0) }}
DEXEOS Penny
PEN/EOS
{{ balances[dexeosConfig.account_name + '::PEN'] ? balances[dexeosConfig.account_name + '::PEN']['balance'].split(' ')[0].format(4) + ' ' + 'PEN' : '0.0000 PEN' }}
{{ (((balances[dexeosConfig.account_name + '::PEN'] ? balances[dexeosConfig.account_name + '::PEN']['balance'].split(' ')[0] : 0)/100000000).toFixed(4)) }} EOS (${{ toUSDT(((balances[dexeosConfig.account_name + '::PEN'] ? balances[dexeosConfig.account_name + '::PEN']['balance'].split(' ')[0] : 0)/100000000)) }})
{{ all_names[token['code'] + '::' + token['symbol']] ? all_names[token['code'] + '::' + token['symbol']] : token['code'] + '::' + token['symbol'] }}
{{ token['symbol'] }}/EOS
{{ quantityFrom(token['code'], token['symbol']).split(' ')[0].format(token['decimal']) + ' ' + token['symbol'] }}
{{ parseFloat((parseFloat(quantityFrom(token['code'], token['symbol']).split(' ')[0] * priceOf(token))).toFixed(4)) + ' EOS' }} (${{ toUSDT(quantityFrom(token['code'], token['symbol']).split(' ')[0] * priceOf(token)) }})
Total
{{ getTotalEOS() }} EOS
${{ toUSDT(getTotalEOS()) }}
#orderbook { width: 360px; } #orderbook .de-table>.de-row>.price { width: 78px; } #orderbook .de-table>.de-row>.qty { width: 120px; text-align: right; } #orderbook .de-table>.de-row>.qty_eos { float: right; } #orderbook>.order-container { width: 100%; } #orderbook>.order-container.half { width: 50%; } #orderbook>.order-container>.orders { } #orderbook>.order-container>.orders>.order { position: relative; cursor: pointer; width: 100%; height: 24px; padding: 3px 12px; border-bottom: 1px solid #DDDDDD; } #orderbook>.order-container>.orders>.order:last-child { border-bottom: none; } .mode-light #orderbook>.order-container>.orders>.order { background: #FFFFFF; } .mode-dark #orderbook>.order-container>.orders>.order { background: #242933; } #orderbook>.buy.order-container>.orders { border-right: 1px solid #DDDDDD; } .mode-dark #orderbook>.order-container>.orders, .mode-dark #orderbook>.order-container>.orders>.order { border-color: #242933; } #orderbook>.order-container>.orders>.order>.stick { position: absolute; height: 23px; } #orderbook>.buy.order-container>.orders>.order>.stick { top: 0; right: 0; background-color: rgba(0, 153, 51, 0.15); } #orderbook>.sell.order-container>.orders>.order>.stick { top: 0; right: 0; background-color: rgba(255, 51, 58, 0.15); } .mode-dark #orderbook>.buy.order-container>.orders>.order>.stick { /* background-color: rgba(0, 153, 51, 0.3); */ } .mode-dark #orderbook>.sell.order-container>.orders>.order>.stick { /* background-color: rgba(255, 51, 58, 0.3); */ } #orderbook>.order-container>.request { width: 100%; border-top: 1px solid #DDDDDD; } #orderbook>.buy.order-container>.request { border-right: 1px solid #DDDDDD; } .mode-dark #orderbook>.order-container>.request { border-color: #242933; } #orderbook>.order-container>.request>.title { padding: 7px 12px; } .mode-light #orderbook>.order-container>.request>.title { border-bottom: 1px solid #dddddd; background-color: #f6f8fa; } .mode-dark #orderbook>.order-container>.request>.title { background-color: #353b4a; } #orderbook>.order-container>.request>.order-form{ display: block; text-align: center; padding: 12px; } #orderbook>.order-container>.request>.order-form>.field { position: relative; width: 100%; height: 19px; margin-bottom: 10px; text-align: center; } #orderbook>.order-container>.request>.order-form>.field { } #orderbook>.order-container>.request>.order-form>.field>input { position: absolute; top: 0; left: 35px; width: 80px; height: 19px; background: none; border: none; } #orderbook>.buy.order-container>.request>.order-form>.field>input:placeholder-shown, #orderbook>.buy.order-container>.request>.order-form>.field>input:focus { border-bottom: 1px solid #009933; } #orderbook>.sell.order-container>.request>.order-form>.field>input:placeholder-shown, #orderbook>.sell.order-container>.request>.order-form>.field>input:focus { border-bottom: 1px solid #FF333A; } #orderbook>.order-container>.request>.order-form>.fee.field { margin-bottom: 15px; } #orderbook>.order-container>.request>.order-form>button { width: 156px; height: 40px; border-radius: 3px; border: none; } #orderbook>.buy.order-container>.request>.order-form>button { background: #009933; } #orderbook>.sell.order-container>.request>.order-form>button { background: #FF333A; } #orderbook>.price { width: 100%; height: 32px; background-color: #ffffff; border: solid 1px #dddddd; border-left: none; border-right: none; text-align: center; padding: 5px; font-size: 15px; font-weight: 500; } #orderbook>.order-container>.request>.order-form>.pct-qty { height: 26px; } #orderbook .field .percent-selectbox { display: inline-block; max-width: 100%; position: relative; vertical-align: top; } #orderbook .field .percent-selectbox select { color: #999999; cursor: pointer; display: block; max-width: 100%; -moz-appearance: none; -webkit-appearance: none; appearance: none; align-items: center; border: 0; box-shadow: none; line-height: 1.5; padding-bottom: 3px; padding-left: 10px; padding-top: 3px; padding-right: 2.5em; position: relative; vertical-align: top; background-color: transparent; font-size: 12px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: -0.5px; outline: 0; border-radius: 0; } #orderbook .field .percent-selectbox::after { box-sizing: inherit; border: 2px solid transparent; border-radius: 1px; border-right: 0; border-top: 0; content: " "; display: block; height: 8px; margin-top: -5.5px; pointer-events: none; position: absolute; top: 50%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: center; transform-origin: center; width: 8px; border-color: #999999; right: 7px; z-index: 4; } .mode-dark #orderbook .field .percent-selectbox select { border: 1px solid #444444; box-sizing: border-box; } .mode-light #orderbook .field .percent-selectbox select { border: 1px solid #dddddd; } #orderbook>.order-container>.request>.order-form>.price.field, #orderbook>.order-container>.request>.order-form>.total.field { margin-bottom: 2px; } .mode-dark #orderbook>.price { background-color: #242933; border-color: #242933; } .amount-selector { cursor: pointer; position: absolute; top: 1px; right: -16px; width: 18px; height: 20px; background: none; border: none; text-align: center; } .amount-selector>ul { display: none; z-index: 1; position: absolute; border-bottom: 1px solid #CCCCCC; } .amount-selector>ul>li { padding: 2px 4px; background: #FFFFFF; border: 1px solid #CCCCCC; border-bottom: none; } .mode-dark .amount-selector>ul { border-bottom: 1px solid #555555; } .mode-dark .amount-selector>ul>li { background: #333333; border: 1px solid #555555; border-bottom: none; }
ORDERBOOK {{ currentToken['symbol'] }}
Price Qty. ({{ currentToken['symbol'] }}) Total (EOS)
{{ trade.trade_per_eos.toFixed(8) }}
{{ priceOf(currentToken) }} EOS (${{ toUSDT(priceOf(currentToken)) }})
{{ trade.trade_per_eos.toFixed(8) }}
BUY ORDER
Price EOS
Qty. {{ currentToken['symbol'] }}
Total EOS
Fee EOS
SELL ORDER
Price EOS
Qty. {{ currentToken['symbol'] }}
Total EOS
Fee EOS
#all_tokens { width: 360px; margin-top: 10px; margin-right: 10px; } #all_tokens>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #all_tokens>.table-header { } #all_tokens>.de-table>.de-row>.star-symbol-container>.star { cursor: pointer; width: 20px; margin-top: 9px; } #all_tokens>.de-table>.de-row>.name_symbol { width: 120px; } #all_tokens .price { display: inline-block; width:100px; } #all_tokens>.de-table>.de-row>.percent_vol { } #all_tokens>.table-body { max-height: 230px; overflow-y: auto; } #all_tokens>.table-body>.de-row { display: inline-block; cursor: pointer; width: 100%; height: 58px; border-bottom: 1px solid #DDDDDD; padding: 10px; } #all_tokens .star-symbol-container { width: 140px; display: inline-block; float: left; } .mode-dark #all_tokens>.table-body>.de-row { border-color: #242933; } @media (max-width:640px) { #all_tokens .price { width: 120px; } #all_tokens .star-symbol-container{ width: 170px; } } @media (max-width:400px) { #all_tokens .star-symbol-container{ width: 140px; } }
ALL TOKENS Price
24h % / vol.
{{ (token['star'] ? '★' : '☆') }} {{ all_names[token['code'] + '::' + token['symbol']] ? all_names[token['code'] + '::' + token['symbol']] : token['code'] + '::' + token['symbol'] }}
{{ token['symbol'] }}/EOS
{{ priceOf(token) }}
${{ toUSDT(priceOf(token)) }}
{{ prices[token['code'] + '::' + token['symbol']] ? (prices[token['code'] + '::' + token['symbol']]['percent'].format(2) > 0 ? '+' : '') + prices[token['code'] + '::' + token['symbol']]['percent'].format(2) + '%' : '0.00%' }}
{{ prices[token['code'] + '::' + token['symbol']] ? parseFloat(prices[token['code'] + '::' + token['symbol']]['total24h_eos']) : '0.0000' }}
#my_balance { width: 360px; margin-top: 10px; } #my_balance .total-summary { border-top: 1px solid #dddddd; background-color: white; display: flex; align-items: center; height: 58px; width: 100%; padding-left: 10px; } #my_balance .total-summary>.balance { display: block; } #my_balance>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #my_balance>.table-header { } #my_balance>.de-table>.de-row>.star { cursor: pointer; width: 18px; margin-top: 9px; } #my_balance .name_symbol, #total-summary .name_symbol { width: 140px; } #my_balance>.de-table>.de-row>.price { } #my_balance>.de-table>.de-row>.percent_vol { } #my_balance>.table-body { height: calc(230px - 58px); overflow-y: auto; } #my_balance>.table-body>.de-row { cursor: pointer; width: 100%; height: 58px; border-bottom: 1px solid #DDDDDD; padding: 10px; } #my_balance>.table-body>.de-row:last-child { border-bottom: 0; } .mode-dark #my_balance>.table-body>.de-row { border-color: #242933; } .mode-dark #my_balance .total-summary { border-top: 1px solid transparent; background-color: #242933; } @media (max-width:640px) { #my_balance .name_symbol, #total-summary .name_symbol{ width: 170px; } } @media (max-width:400px) { #my_balance .name_symbol, #total-summary .name_symbol{ width: 140px; } }
MY BALANCES
Total
EOS
EOS
{{ balances['eosio.token::EOS'] ? balances['eosio.token::EOS']['balance'].split(' ')[0].format(4) + ' ' + 'EOS' : '0.0000 EOS' }}
${{ toUSDT(balances['eosio.token::EOS'] ? balances['eosio.token::EOS']['balance'].split(' ')[0] : 0) }}
DEXEOS Penny
PEN/EOS
{{ balances[dexeosConfig.account_name + '::PEN'] ? balances[dexeosConfig.account_name + '::PEN']['balance'].split(' ')[0].format(4) + ' ' + 'PEN' : '0.0000 PEN' }}
{{ (((balances[dexeosConfig.account_name + '::PEN'] ? balances[dexeosConfig.account_name + '::PEN']['balance'].split(' ')[0] : 0)/100000000).toFixed(4)) }} EOS (${{ toUSDT(((balances[dexeosConfig.account_name + '::PEN'] ? balances[dexeosConfig.account_name + '::PEN']['balance'].split(' ')[0] : 0)/100000000)) }})
{{ all_names[token['code'] + '::' + token['symbol']] ? all_names[token['code'] + '::' + token['symbol']] : token['code'] + '::' + token['symbol'] }}
{{ token['symbol'] }}/EOS
{{ quantityFrom(token['code'], token['symbol']).split(' ')[0].format(token['decimal']) + ' ' + token['symbol'] }}
{{ parseFloat((parseFloat(quantityFrom(token['code'], token['symbol']).split(' ')[0] * priceOf(token))).toFixed(4)) + ' EOS' }} (${{ toUSDT(quantityFrom(token['code'], token['symbol']).split(' ')[0] * priceOf(token)) }})
Total
{{ getTotalEOS() }} EOS
${{ toUSDT(getTotalEOS()) }}
#trade_history { width: 360px; margin-top: 10px; margin-right: 10px; } #trade_history>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #trade_history>.table-header { } #trade_history>.de-table>.de-row>.date { width: 108px; } #trade_history>.de-table>.de-row>.qty_price { width: 160px; } #trade_history>.de-table>.de-row>.view_tx { } #trade_history>.table-body { height: 290px; overflow-y: auto; } #trade_history>.table-body>.de-row { width: 100%; height: 58px; border-bottom: 1px solid #DDDDDD; } .mode-dark #trade_history>.table-body>.de-row { border-color: #242933; }
TRADE HISTORY {{ currentToken['symbol'] }}
MARKET MY
Date Qty. @ Price
{{ formatDateWithTime(history[0]) }} {{ history[4].format(currentToken['decimal']) }}
{{ currentToken['symbol'] }} @ {{ history[5].format(8) }} EOS
View TX Dropped Tx
{{ formatDateWithTime(tx['transaction_register_date']) }}
{{ tx['transaction_buyer_account_name'] == (account ? account['account_name'] : '') ? 'BUY' : 'SELL' }}
{{ tx['transaction_quantity'].format(currentToken['decimal']) }}
{{ currentToken['symbol'] }} @ {{ tx['transaction_per_eos'].format(8) }} EOS
View TX Dropped Tx
There are no transactions yet.
You will see the details here when the buy/sell transaction is completed.
#my_open_orders { width: 360px; margin-top: 10px; margin-right: 10px; } #my_open_orders>.header>.di_right>.trade_history_status:hover { font-weight: 500; color: #0081F2; } #my_open_orders>.table-header { } #my_open_orders>.de-table>.de-row>.date { width: 108px; } #my_open_orders>.de-table>.de-row>.order_remain { width: 174px; } #my_open_orders>.de-table>.de-row>.view_tx { } #my_open_orders>.table-body { height: 290px; overflow-y: auto; } #my_open_orders>.table-body>.de-row { width: 100%; min-height: 58px; border-bottom: 1px solid #DDDDDD; } .mode-dark #my_open_orders>.table-body>.de-row { border-color: #242933; }
MY OPEN ORDERS
ALL {{ currentToken['symbol'] }}
Date Remain / Order
{{ formatDateWithTime(order['trade_register_date']) }}
{{ typeToString(order.trade_type) }}
{{ order['trade_amount'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }} / {{ order['trade_quantity'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }}
{{ order['trade_symbol'] }} @ {{ order['trade_per_eos'].toFixed(8) }} EOS
View TX
Cancel
{{ formatDateWithTime(order['trade_register_date']) }}
{{ typeToString(order.trade_type) }}
{{ order['trade_amount'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }} / {{ order['trade_quantity'].format(getDecimal(order['trade_code'], order['trade_symbol'])) }}
{{ order['trade_symbol'] }} @ {{ order['trade_per_eos'].toFixed(8) }} EOS
View TX
Cancel
No order history yet.
You will see the details here, when you register your order.
#orderbook { width: 360px; } #orderbook .de-table>.de-row>.price { width: 78px; } #orderbook .de-table>.de-row>.qty { width: 120px; text-align: right; } #orderbook .de-table>.de-row>.qty_eos { float: right; } #orderbook>.order-container { width: 100%; } #orderbook>.order-container.half { width: 50%; } #orderbook>.order-container>.orders { } #orderbook>.order-container>.orders>.order { position: relative; cursor: pointer; width: 100%; height: 24px; padding: 3px 12px; border-bottom: 1px solid #DDDDDD; } #orderbook>.order-container>.orders>.order:last-child { border-bottom: none; } .mode-light #orderbook>.order-container>.orders>.order { background: #FFFFFF; } .mode-dark #orderbook>.order-container>.orders>.order { background: #242933; } #orderbook>.buy.order-container>.orders { border-right: 1px solid #DDDDDD; } .mode-dark #orderbook>.order-container>.orders, .mode-dark #orderbook>.order-container>.orders>.order { border-color: #242933; } #orderbook>.order-container>.orders>.order>.stick { position: absolute; height: 23px; } #orderbook>.buy.order-container>.orders>.order>.stick { top: 0; right: 0; background-color: rgba(0, 153, 51, 0.15); } #orderbook>.sell.order-container>.orders>.order>.stick { top: 0; right: 0; background-color: rgba(255, 51, 58, 0.15); } .mode-dark #orderbook>.buy.order-container>.orders>.order>.stick { /* background-color: rgba(0, 153, 51, 0.3); */ } .mode-dark #orderbook>.sell.order-container>.orders>.order>.stick { /* background-color: rgba(255, 51, 58, 0.3); */ } #orderbook>.order-container>.request { width: 100%; border-top: 1px solid #DDDDDD; } #orderbook>.buy.order-container>.request { border-right: 1px solid #DDDDDD; } .mode-dark #orderbook>.order-container>.request { border-color: #242933; } #orderbook>.order-container>.request>.title { padding: 7px 12px; } .mode-light #orderbook>.order-container>.request>.title { border-bottom: 1px solid #dddddd; background-color: #f6f8fa; } .mode-dark #orderbook>.order-container>.request>.title { background-color: #353b4a; } #orderbook>.order-container>.request>.order-form{ display: block; text-align: center; padding: 12px; } #orderbook>.order-container>.request>.order-form>.field { position: relative; width: 100%; height: 19px; margin-bottom: 10px; text-align: center; } #orderbook>.order-container>.request>.order-form>.field { } #orderbook>.order-container>.request>.order-form>.field>input { position: absolute; top: 0; left: 35px; width: 80px; height: 19px; background: none; border: none; } #orderbook>.buy.order-container>.request>.order-form>.field>input:placeholder-shown, #orderbook>.buy.order-container>.request>.order-form>.field>input:focus { border-bottom: 1px solid #009933; } #orderbook>.sell.order-container>.request>.order-form>.field>input:placeholder-shown, #orderbook>.sell.order-container>.request>.order-form>.field>input:focus { border-bottom: 1px solid #FF333A; } #orderbook>.order-container>.request>.order-form>.fee.field { margin-bottom: 15px; } #orderbook>.order-container>.request>.order-form>button { width: 156px; height: 40px; border-radius: 3px; border: none; } #orderbook>.buy.order-container>.request>.order-form>button { background: #009933; } #orderbook>.sell.order-container>.request>.order-form>button { background: #FF333A; } #orderbook>.price { width: 100%; height: 32px; background-color: #ffffff; border: solid 1px #dddddd; border-left: none; border-right: none; text-align: center; padding: 5px; font-size: 15px; font-weight: 500; } #orderbook>.order-container>.request>.order-form>.pct-qty { height: 26px; } #orderbook .field .percent-selectbox { display: inline-block; max-width: 100%; position: relative; vertical-align: top; } #orderbook .field .percent-selectbox select { color: #999999; cursor: pointer; display: block; max-width: 100%; -moz-appearance: none; -webkit-appearance: none; appearance: none; align-items: center; border: 0; box-shadow: none; line-height: 1.5; padding-bottom: 3px; padding-left: 10px; padding-top: 3px; padding-right: 2.5em; position: relative; vertical-align: top; background-color: transparent; font-size: 12px; font-weight: normal; font-style: normal; font-stretch: normal; line-height: normal; letter-spacing: -0.5px; outline: 0; border-radius: 0; } #orderbook .field .percent-selectbox::after { box-sizing: inherit; border: 2px solid transparent; border-radius: 1px; border-right: 0; border-top: 0; content: " "; display: block; height: 8px; margin-top: -5.5px; pointer-events: none; position: absolute; top: 50%; -webkit-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: center; transform-origin: center; width: 8px; border-color: #999999; right: 7px; z-index: 4; } .mode-dark #orderbook .field .percent-selectbox select { border: 1px solid #444444; box-sizing: border-box; } .mode-light #orderbook .field .percent-selectbox select { border: 1px solid #dddddd; } #orderbook>.order-container>.request>.order-form>.price.field, #orderbook>.order-container>.request>.order-form>.total.field { margin-bottom: 2px; } .mode-dark #orderbook>.price { background-color: #242933; border-color: #242933; } .amount-selector { cursor: pointer; position: absolute; top: 1px; right: -16px; width: 18px; height: 20px; background: none; border: none; text-align: center; } .amount-selector>ul { display: none; z-index: 1; position: absolute; border-bottom: 1px solid #CCCCCC; } .amount-selector>ul>li { padding: 2px 4px; background: #FFFFFF; border: 1px solid #CCCCCC; border-bottom: none; } .mode-dark .amount-selector>ul { border-bottom: 1px solid #555555; } .mode-dark .amount-selector>ul>li { background: #333333; border: 1px solid #555555; border-bottom: none; }
ORDERBOOK {{ currentToken['symbol'] }}
Price Qty. ({{ currentToken['symbol'] }}) Total (EOS)
{{ trade.trade_per_eos.toFixed(8) }}
{{ priceOf(currentToken) }} EOS (${{ toUSDT(priceOf(currentToken)) }})
{{ trade.trade_per_eos.toFixed(8) }}
BUY ORDER
Price EOS
Qty. {{ currentToken['symbol'] }}
Total EOS
Fee EOS
SELL ORDER
Price EOS
Qty. {{ currentToken['symbol'] }}
Total EOS
Fee EOS