diff --git a/src/app/style-guide.js b/src/app/style-guide.js index 0c40a13074..140753c5c9 100644 --- a/src/app/style-guide.js +++ b/src/app/style-guide.js @@ -93,7 +93,7 @@ function styleGuide () { .title-box { margin-bottom : 0.4em; - padding : 1em; + padding : .3em; background-color : transparent; font-weight : bold; display : flex; diff --git a/src/universal-dapp.js b/src/universal-dapp.js index 433ead1c10..0e2eafc316 100644 --- a/src/universal-dapp.js +++ b/src/universal-dapp.js @@ -54,9 +54,10 @@ var css = csjs` var cssInstance = csjs` .title { display: flex; - justify-content: center; + justify-content: space-around; + align-items: center; margin-bottom: 1em; - padding: 1em; + padding: .3em; font-size: .95em; cursor: pointer; background-color: ${styles.colors.violet}; @@ -89,12 +90,11 @@ var cssInstance = csjs` border: 1px dotted ${styles.colors.grey}; border-radius: 5px; text-align: center; - padding: 1em .3em; + padding: .3em .3em; min-width: 30%; } .copy:hover{ - background-color: ${styles.colors.lightGrey}; - opacity: .8; + opacity: .7; } ` @@ -349,9 +349,11 @@ UniversalDApp.prototype.getInstanceInterface = function (contract, address, $tar var context = self.executionContext.isVM() ? 'memory' : 'blockchain' address = (address.slice(0, 2) === '0x' ? '' : '0x') + address.toString('hex') + var len = address.length + var shortAddress = address.slice(0, 5) + '...' + address.slice(len - 5, len) var title = yo`
-
${contract.name} at ${address} (${context})
+
${contract.name} at ${shortAddress} (${context})
Copy address
`