adds copy paste component

components/dataViews/CopyAndPaste.js

@@ -0,0 +1,31 @@
+import copy from "copy-to-clipboard";
+
+export default (props) => (
+  <div className="icon" onClick={() => copy(props.copyText)}>
+    <svg viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
+      <path d="M13 32H41C53.1503 32 63 41.8497 63 54V94H13V32Z" />
+      <path d="M37 6H65C77.1503 6 87 15.8497 87 28V68H37V6Z" />
+    </svg>
+    <style jsx>{`
+      svg {
+        height: 100%;
+        width: auto;
+      }
+
+      path {
+        stroke: ${props.stroke ? props.stroke : "rgb(146 120 150)"};
+        stroke-width: ${props.strokeWidth ? props.strokeWidth : "10"};
+        transition: stroke 0.1s ease;
+      }
+
+      .icon {
+        padding: 0 0.5em;
+        cursor: pointer;
+      }
+
+      .icon:hover path {
+        stroke: white;
+      }
+    `}</style>
+  </div>
+);

components/dataViews/HashView.js

@@ -0,0 +1,13 @@
+import CopyAndPaste from "./CopyAndPaste";
+
+export default ({ hash }) => (
+  <div className="hash-view">
+    <div>{hash}</div>
+    <CopyAndPaste copyText={hash} />
+    <style jsx>{`
+      .hash-view {
+        display: flex;
+      }
+    `}</style>
+  </div>
+);

components/layout/Page.js

@@ -43,7 +43,7 @@ export default (props) => {
           margin: 0;
           font-weight: 400;
           line-height: 1.15;
-          font-size: 1.5em;
+          font-size: 1.4em;
           text-align: center;
         }
         h2 {

pages/multi/[address]/index.js

@@ -4,6 +4,7 @@ import { useRouter } from "next/router";
 
 import Button from "../../../components/inputs/Button";
 import { getMultisigAccount } from "../../../lib/multisigHelpers";
+import HashView from "../../../components/dataViews/HashView";
 import MultisigHoldings from "../../../components/dataViews/MultisigHoldings";
 import MultisigMembers from "../../../components/dataViews/MultisigMembers";
 import Page from "../../../components/layout/Page";
@@ -44,7 +45,9 @@ const multipage = (props) => {
       <StackableContainer base>
         <StackableContainer>
           <label>Multisig Address</label>
-          <h1>{address}</h1>
+          <h1>
+            <HashView hash={address} />
+          </h1>
         </StackableContainer>
         {props.error && (
           <StackableContainer>