Improve styling for terminal logs and details table

pull/1/head
ninabreznik 8 years ago committed by yann300
parent 84a30d55ab
commit 1ac03a7ce6
  1. 2
      assets/css/universal-dapp.css
  2. 26
      src/app/execution/txLogger.js

@ -215,7 +215,7 @@
padding: 0 0.4em;
box-sizing: border-box;
float: left;
word-wrap: break-word;
min-width: 100%;
}
#runTabView .contractProperty.hasArgs input {

@ -17,12 +17,17 @@ var css = csjs`
.log {
display: flex;
align-items: baseline;
justify-content: space-between;
}
.txBlock, .txVM {
color: ${styles.colors.violet};
width: 45%;
}
.txTable, .tr, .td {
border: 1px solid ${styles.colors.lightOrange};
border-collapse: collapse;
font-size: 10px;
color: ${styles.colors.grey};
border: 1px dashed ${styles.colors.black};
}
#txTable {
width: 450px;
@ -32,6 +37,9 @@ var css = csjs`
.tr, .td {
padding: 4px;
}
.tableTitle {
width: 25%;
}
.buttons {
display: flex;
}
@ -229,36 +237,36 @@ function createTable (opts) {
var table = yo`
<table class="${css.txTable}" id="txTable">
<tr class="${css.tr}">
<td class="${css.td}">from</td>
<td class="${css.td} ${css.tableTitle}"> from </td>
<td class="${css.td}">${from}</td>
</tr class="${css.tr}">
<tr class="${css.tr}">
<td class="${css.td}">to:</td>
<td class="${css.td}"> to </td>
<td class="${css.td}">${to}</td>
</tr class="${css.tr}">
<tr class="${css.tr}">
<td class="${css.td}">value:</td>
<td class="${css.td}"> value </td>
<td class="${css.td}">${value(val)} wei</td>
</tr class="${css.tr}">
<tr class="${css.tr}">
<td class="${css.td}">input:</td>
<td class="${css.td}"> input </td>
<td class="${css.td}">${helper.shortenHexData(input)}</td>
</tr class="${css.tr}">
<tr class="${css.tr}">
<td class="${css.td}">hash:</td>
<td class="${css.td}"> hash </td>
<td class="${css.td}">${hash}</td>
</tr class="${css.tr}">
<tr class="${css.tr}">
<td class="${css.td}">gas:</td>
<td class="${css.td}"> gas </td>
<td class="${css.td}">${gas}</td>
</tr class="${css.tr}">
</table>
`
if (opts.logs) {
var logs = opts.logs
var logs = yo`
logs = yo`
<tr class="${css.tr}">
<td class="${css.td}">logs:</td>
<td class="${css.td}"> logs </td>
<td class="${css.td}">${logs}</td>
</tr class="${css.tr}">
`

Loading…
Cancel
Save