|
|
@ -115,6 +115,19 @@ class TradePortal extends LitElement { |
|
|
|
--_lumo-grid-border-color: var(--border); |
|
|
|
--_lumo-grid-border-color: var(--border); |
|
|
|
--_lumo-grid-secondary-border-color: var(--border2); |
|
|
|
--_lumo-grid-secondary-border-color: var(--border2); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.myhover vaadin-grid::part(first-column-cell):hover { |
|
|
|
|
|
|
|
background-color: var(--black); |
|
|
|
|
|
|
|
color: var(--white); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.myfocused vaadin-grid::part(focused-cell) { |
|
|
|
|
|
|
|
background-color: var(--black); |
|
|
|
|
|
|
|
color: var(--white); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
vaadin-grid::part(selected-row) { |
|
|
|
|
|
|
|
background-color: var(--black); |
|
|
|
|
|
|
|
color: var(--white); |
|
|
|
|
|
|
|
} |
|
|
|
paper-spinner-lite { |
|
|
|
paper-spinner-lite { |
|
|
|
height: 30px; |
|
|
|
height: 30px; |
|
|
|
width: 30px; |
|
|
|
width: 30px; |
|
|
@ -847,19 +860,26 @@ class TradePortal extends LitElement { |
|
|
|
|
|
|
|
|
|
|
|
openTradesTemplate() { |
|
|
|
openTradesTemplate() { |
|
|
|
return html` |
|
|
|
return html` |
|
|
|
<div class="open-trades"> |
|
|
|
<div class="open-trades myhover myfocused"> |
|
|
|
<div class="box"> |
|
|
|
<div class="box"> |
|
|
|
<header><span>${translate("tradepage.tchange5")}</span></header> |
|
|
|
<header><span>${translate("tradepage.tchange5")}</span></header> |
|
|
|
<div class="border-wrapper"> |
|
|
|
<div class="border-wrapper"> |
|
|
|
<div class="loadingContainer" id="loadingHistoricTrades" style="display:${this.isLoadingOpenTrades ? 'block' : 'none'}"><div class="loading"></div><span style="color: var(--black);">${translate("login.loading")}</span></div> |
|
|
|
<div class="loadingContainer" id="loadingHistoricTrades" style="display:${this.isLoadingOpenTrades ? 'block' : 'none'}"><div class="loading"></div><span style="color: var(--black);">${translate("login.loading")}</span></div> |
|
|
|
<vaadin-grid multi-sort="true" theme="compact column-borders row-stripes wrap-cell-content" id="openOrdersGrid" aria-label="Open Orders" .items="${this.listedCoins.get(this.selectedCoin).openFilteredOrders}"> |
|
|
|
<vaadin-grid |
|
|
|
|
|
|
|
multi-sort="true" |
|
|
|
|
|
|
|
theme="compact column-borders row-stripes" |
|
|
|
|
|
|
|
wrap-cell-content |
|
|
|
|
|
|
|
id="openOrdersGrid" |
|
|
|
|
|
|
|
aria-label="Open Orders" |
|
|
|
|
|
|
|
.items="${this.listedCoins.get(this.selectedCoin).openFilteredOrders}" |
|
|
|
|
|
|
|
> |
|
|
|
<vaadin-grid-column |
|
|
|
<vaadin-grid-column |
|
|
|
auto-width |
|
|
|
auto-width |
|
|
|
resizable |
|
|
|
resizable |
|
|
|
header="${translate("tradepage.tchange8")} (QORT)" |
|
|
|
header="${translate("tradepage.tchange8")} (QORT)" |
|
|
|
id="qortAmountColumn" |
|
|
|
id="qortAmountColumn" |
|
|
|
.renderer=${(root, column, data) => { |
|
|
|
.renderer=${(root, column, data) => { |
|
|
|
render(html`<span @click="${() => this.fillBuyForm(data)}">${this.round(data.item.qortAmount)}</span>`, root) |
|
|
|
render(html`<span style="cursor: pointer;" @click="${() => this.fillBuyForm(data)}">${this.round(data.item.qortAmount)}</span>`, root) |
|
|
|
}} |
|
|
|
}} |
|
|
|
> |
|
|
|
> |
|
|
|
</vaadin-grid-column> |
|
|
|
</vaadin-grid-column> |
|
|
|