Display contract block creation (#4069)

* Add contract block creation to metadata

* Display mined block for contract on Contracts view

* Better use of Summary for Accounts

* Add sorted by mined block for contracts

* Proper Block Number sort // display in contract page

* PR Grumble

* Linting issues

js/src/ui/Balance/balance.css

@@ -23,7 +23,7 @@
 
 .empty {
   line-height: 24px;
-  margin: 0.75em 0.5em 0 0;
+  margin: 0 0.5em 0 0;
   opacity: 0.25;
 }
 

js/src/ui/Container/Title/title.css

@@ -14,7 +14,7 @@
 /* You should have received a copy of the GNU General Public License
 /* along with Parity.  If not, see <http://www.gnu.org/licenses/>.
 */
-.byline {
+.byline, .description {
   overflow: hidden;
   position: relative;
   line-height: 1.2em;
@@ -31,6 +31,11 @@
   }
 }
 
+.description {
+  font-size: 0.75em;
+  margin: 0.5em 0 0;
+}
+
 .title {
   text-transform: uppercase;
   margin: 0;

js/src/ui/Container/Title/title.js

@@ -22,13 +22,14 @@ import styles from './title.css';
 
 export default class Title extends Component {
   static propTypes = {
+    byline: nodeOrStringProptype(),
     className: PropTypes.string,
-    title: nodeOrStringProptype(),
-    byline: nodeOrStringProptype()
+    description: nodeOrStringProptype(),
+    title: nodeOrStringProptype()
   }
 
   render () {
-    const { className, title, byline } = this.props;
+    const { byline, className, title } = this.props;
 
     const byLine = typeof byline === 'string'
       ? (
@@ -46,6 +47,29 @@ export default class Title extends Component {
         <div className={ styles.byline }>
           { byLine }
         </div>
+        { this.renderDescription() }
+      </div>
+    );
+  }
+
+  renderDescription () {
+    const { description } = this.props;
+
+    if (!description) {
+      return null;
+    }
+
+    const desc = typeof description === 'string'
+      ? (
+        <span title={ description }>
+          { description }
+        </span>
+      )
+      : description;
+
+    return (
+      <div className={ styles.description }>
+        { desc }
       </div>
     );
   }