Fix styling for the table

pull/1/head
ninabreznik 7 years ago committed by yann300
parent 174040e2c4
commit a31be1fd5b
  1. 73
      src/app/execution/txLogger.js

@ -64,19 +64,8 @@ var css = csjs`
.txTable, .tr, .td {
border-collapse: collapse;
font-size: 10px;
}
.tr {
width: 70%;
border-bottom: 1px solid white;
display: flex;
align-items: center;
}
.td:first-child {
min-width: 30%;
width: 30%;
display: flex;
align-items: baseline;
font-weight: bold;
color: ${styles.terminal.text_Primary};
border: 1px solid ${styles.terminal.text_Secondary};
}
#txTable {
margin-top: 1%;
@ -85,6 +74,7 @@ var css = csjs`
width: 85%;
}
.tr, .td {
padding: 4px;
vertical-align: baseline;
}
.td:first-child {
@ -394,10 +384,9 @@ function createTable (opts) {
var contractAddress = yo`
<tr class="${css.tr}">
<td class="${css.td}"> contractAddress
${copyToClipboard(() => opts.contractAddress)}
</td>
<td class="${css.td}"> contractAddress </td>
<td class="${css.td}">${opts.contractAddress}
${copyToClipboard(() => opts.contractAddress)}
</td>
</tr>
`
@ -405,10 +394,9 @@ function createTable (opts) {
var from = yo`
<tr class="${css.tr}">
<td class="${css.td} ${css.tableTitle}"> from
${copyToClipboard(() => opts.from)}
</td>
<td class="${css.td} ${css.tableTitle}"> from </td>
<td class="${css.td}">${opts.from}
${copyToClipboard(() => opts.from)}
</td>
</tr>
`
@ -423,10 +411,9 @@ function createTable (opts) {
}
var to = yo`
<tr class="${css.tr}">
<td class="${css.td}"> to
${copyToClipboard(() => data.to ? data.to : toHash)}
</td>
<td class="${css.td}"> to </td>
<td class="${css.td}">${toHash}
${copyToClipboard(() => data.to ? data.to : toHash)}
</td>
</tr>
`
@ -434,10 +421,9 @@ function createTable (opts) {
var gas = yo`
<tr class="${css.tr}">
<td class="${css.td}"> gas
${copyToClipboard(() => opts.gas)}
</td>
<td class="${css.td}"> gas </td>
<td class="${css.td}">${opts.gas} gas
${copyToClipboard(() => opts.gas)}
</td>
</tr>
`
@ -450,10 +436,9 @@ function createTable (opts) {
if (opts.transactionCost) {
table.appendChild(yo`
<tr class="${css.tr}">
<td class="${css.td}"> transaction cost
${copyToClipboard(() => opts.transactionCost)}
</td>
<td class="${css.td}"> transaction cost </td>
<td class="${css.td}">${opts.transactionCost} gas ${callWarning}
${copyToClipboard(() => opts.transactionCost)}
</td>
</tr>`)
}
@ -461,20 +446,18 @@ function createTable (opts) {
if (opts.executionCost) {
table.appendChild(yo`
<tr class="${css.tr}">
<td class="${css.td}"> execution cost
${copyToClipboard(() => opts.executionCost)}
</td>
<td class="${css.td}"> execution cost </td>
<td class="${css.td}">${opts.executionCost} gas ${callWarning}
${copyToClipboard(() => opts.executionCost)}
</td>
</tr>`)
}
var hash = yo`
<tr class="${css.tr}">
<td class="${css.td}"> hash
${copyToClipboard(() => opts.hash)}
</td>
<td class="${css.td}"> hash </td>
<td class="${css.td}">${opts.hash}
${copyToClipboard(() => opts.hash)}
</td>
</tr>
`
@ -482,10 +465,9 @@ function createTable (opts) {
var input = yo`
<tr class="${css.tr}">
<td class="${css.td}"> input
${copyToClipboard(() => opts.input)}
</td>
<td class="${css.td}"> input </td>
<td class="${css.td}">${opts.input}
${copyToClipboard(() => opts.input)}
</td>
</tr>
`
@ -494,10 +476,9 @@ function createTable (opts) {
if (opts['decoded input']) {
var inputDecoded = yo`
<tr class="${css.tr}">
<td class="${css.td}"> decoded input
${copyToClipboard(opts['decoded input'])}
</td>
<td class="${css.td}"> decoded input </td>
<td class="${css.td}">${opts['decoded input']}
${copyToClipboard(opts['decoded input'])}
</td>
</tr>`
table.appendChild(inputDecoded)
@ -518,12 +499,11 @@ function createTable (opts) {
}
var logs = yo`
<tr class="${css.tr}">
<td class="${css.td}"> logs
${copyToClipboard(() => JSON.stringify(stringified, null, '\t'))}
${copyToClipboard(() => JSON.stringify(opts.logs.raw || '0'))}
</td>
<td class="${css.td}"> logs </td>
<td class="${css.td}" id="logs">
${JSON.stringify(stringified, null, '\t')}
${copyToClipboard(() => JSON.stringify(stringified, null, '\t'))}
${copyToClipboard(() => JSON.stringify(opts.logs.raw || '0'))}
</td>
</tr>
`
@ -532,10 +512,9 @@ function createTable (opts) {
var val = opts.val != null ? typeConversion.toInt(opts.val) : 0
val = yo`
<tr class="${css.tr}">
<td class="${css.td}"> value
${copyToClipboard(() => `${val} wei`)}
</td>
<td class="${css.td}"> value </td>
<td class="${css.td}">${val} wei
${copyToClipboard(() => `${val} wei`)}
</td>
</tr>
`

Loading…
Cancel
Save