diff --git a/src/universal-dapp.js b/src/universal-dapp.js index 0e2eafc316..fbedf2876c 100644 --- a/src/universal-dapp.js +++ b/src/universal-dapp.js @@ -32,15 +32,18 @@ var css = csjs` .title extends ${styles.titleBox} { cursor: pointer; background-color: ${styles.colors.violet}; - } - .title:hover { - opacity: .8; + justify-content: flex-start; + min-width: 400px; } .contract .title:before { + margin-right: 30%; + margin-left: 5%; content: "\\25BE"; } .contract.hidesub .title:before { - content: "\\25B8" + margin-right: 30%; + margin-left: 5%; + content: "\\25B8"; } .contract.hidesub { padding-bottom: 0; @@ -49,12 +52,16 @@ var css = csjs` .contract.hidesub > *:not(.title) { display: none; } + .size { + margin-left: 20%; + } ` var cssInstance = csjs` .title { display: flex; justify-content: space-around; + min-width: 400px; align-items: center; margin-bottom: 1em; padding: .3em; @@ -68,16 +75,15 @@ var cssInstance = csjs` margin-right: 1em; word-break: break-all; } - .titleText:hover { - opacity: .8; - } .instance .title:before { content: "\\25BE"; margin-right: .5em; + margin-left: .5em; } .instance.hidesub .title:before { - content: "\\25B8" + content: "\\25B8"; margin-right: .5em; + margin-left: .5em; } .instance.hidesub { padding-bottom: 0; @@ -86,12 +92,10 @@ var cssInstance = csjs` .instance.hidesub > *:not(.title) { display: none; } - .copy extends ${styles.button} { + .copy extends ${styles.button} { border: 1px dotted ${styles.colors.grey}; - border-radius: 5px; - text-align: center; - padding: .3em .3em; - min-width: 30%; + padding: 0 .3em; + font-weight: bold; } .copy:hover{ opacity: .7; @@ -254,7 +258,7 @@ UniversalDApp.prototype.render = function () { var $title = $(``).text(self.contracts[c].name) $title.click(function (ev) { $(this).closest(`.${css.contract}`).toggleClass(`${css.hidesub}`) }) if (self.contracts[c].bytecode) { - $title.append($('
').text((self.contracts[c].bytecode.length / 2) + ' bytes')) + $title.append($(`
`).text((self.contracts[c].bytecode.length / 2) + ' bytes')) } $contractEl.append($title).append(self.getCreateInterface($contractEl, self.contracts[c])) } @@ -352,8 +356,8 @@ UniversalDApp.prototype.getInstanceInterface = function (contract, address, $tar var len = address.length var shortAddress = address.slice(0, 5) + '...' + address.slice(len - 5, len) var title = yo` -
-
${contract.name} at ${shortAddress} (${context})
+
+
${contract.name} at ${shortAddress} (${context})
Copy address
` @@ -361,7 +365,8 @@ UniversalDApp.prototype.getInstanceInterface = function (contract, address, $tar $instance.toggleClass(`${cssInstance.hidesub}`) } - function copyToClipboard () { + function copyToClipboard (event) { + event.stopPropagation(); copy(address) }