From 696dbed418d5fe514b4ca4ac2f91a6044f607891 Mon Sep 17 00:00:00 2001
From: Dawid Potocki <dpot@disroot.org>
Date: Sun, 13 Oct 2019 15:18:04 +1300
Subject: [PATCH] Remove inline JavaScript

---
 _includes/footer.html  |  2 +-
 _includes/head.html    |  2 +-
 _includes/nav.html     |  4 +--
 _includes/scripts.html |  2 +-
 assets/css/style.scss  |  1 +
 assets/js/main.js      |  5 +++
 pages/donate.html      | 72 +++++++++++++++++++++---------------------
 7 files changed, 47 insertions(+), 41 deletions(-)

diff --git a/_includes/footer.html b/_includes/footer.html
index e390ba79..5c7cfa7b 100644
--- a/_includes/footer.html
+++ b/_includes/footer.html
@@ -44,7 +44,7 @@
   <h3>Copy URL and Description</h3>
 
   <p>
-  <input type="text" value="privacytools.io - encryption against global mass surveillance" onclick="this.focus();this.select()" class="form-control input-lg">
+  <input type="text" value="privacytools.io - encryption against global mass surveillance" class="form-control input-lg onclick-select">
   <span class="help-block">For easy copy and paste. Share this text snippet.</span>
   </p>
 
diff --git a/_includes/head.html b/_includes/head.html
index dda47d7b..cce89706 100644
--- a/_includes/head.html
+++ b/_includes/head.html
@@ -43,6 +43,6 @@
   <link rel="shortcut icon" href="/assets/img/favicons/favicon.ico">
 
   <!-- CSS stylesheets -->
-  <link href="/assets/css/style.css?v=7" rel="stylesheet">
+  <link href="/assets/css/style.css?v=8" rel="stylesheet">
   <link id="dark-css" href="/assets/css/dark.css?v=4" rel="stylesheet" media="(prefers-color-scheme: dark)">
 </head>
diff --git a/_includes/nav.html b/_includes/nav.html
index a58cb2a4..c59cecfd 100644
--- a/_includes/nav.html
+++ b/_includes/nav.html
@@ -145,9 +145,9 @@
         <a href="/donate/" class="nav-anchor">
           Donate <span class="fas fa-heart text-danger fa-fw"></span>
         </a>
-        <a id="nav-switch-theme" class="nav-anchor" href="javascript:void(0)" onClick="changeColorScheme()">
+        <span id="nav-switch-theme" class="nav-anchor">
           Theme <span class="nav-theme-icon fas fa-fw"></span>
-        </a>
+        </span>
       </div>
     </div>
   </nav>
diff --git a/_includes/scripts.html b/_includes/scripts.html
index d236060a..d5e84077 100644
--- a/_includes/scripts.html
+++ b/_includes/scripts.html
@@ -2,7 +2,7 @@
 <script src="/assets/js/popper.min.js?v=4"></script>
 <script src="/assets/js/bootstrap.min.js?v=4"></script>
 <script src="/assets/js/sortable.min.js?v=4"></script>
-<script src="/assets/js/main.js?v=4"></script>
+<script src="/assets/js/main.js?v=5"></script>
 
 <!--
   Matomo is the leading open-source analytics platform:
diff --git a/assets/css/style.scss b/assets/css/style.scss
index 528665ea..8a8d4c63 100644
--- a/assets/css/style.scss
+++ b/assets/css/style.scss
@@ -295,6 +295,7 @@ input#nav-toggle,
   /* We will make it visible with JavaScript
    * as it does not work without it */
   display: none;
+  cursor: pointer;
 }
 
 /*
diff --git a/assets/js/main.js b/assets/js/main.js
index 559480c9..548d1dd9 100644
--- a/assets/js/main.js
+++ b/assets/js/main.js
@@ -1,6 +1,10 @@
 $(function() {
   $("[data-toggle='tooltip']").tooltip();
 });
+document.querySelectorAll(".onclick-select").forEach(element => {
+  element.addEventListener("click", element.select);
+});
+
 
 // Navbar dropdowns
 const navSections = document.querySelectorAll(".nav-details");
@@ -30,6 +34,7 @@ function navSectionsClose(event) {
 
 // Dark/Light color scheme switch button
 document.querySelector("#nav-switch-theme").style.display = "inline";
+document.querySelector("#nav-switch-theme").addEventListener("click", changeColorScheme);
 
 function changeColorScheme() {
   // Use whatever users want
diff --git a/pages/donate.html b/pages/donate.html
index 54b26d19..a7a2c46a 100644
--- a/pages/donate.html
+++ b/pages/donate.html
@@ -26,49 +26,49 @@ permalink: /donate/
       <div class="form-group row">
         <label for="BTC" class="col-sm-4 col-form-label"><strong>Bitcoin (BTC)</strong> <a href="/assets/img/qr/BTC.png"><i class="fa fa-qrcode"></i></a></label>
         <div class="col-sm-8">
-          <input id="BTC" type="text" value="1C3MVvvJwfEiS5KQmZzJkiVq7obYi2zRqb" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="BTC" type="text" value="1C3MVvvJwfEiS5KQmZzJkiVq7obYi2zRqb" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="BCH" class="col-sm-4 col-form-label"><strong>Bitcoin Cash (BCH)</strong> <a href="/assets/img/qr/BCH.png"><i class="fa fa-qrcode"></i></a></label>
         <div class="col-sm-8">
-          <input id="BCH" type="text" value="bitcoincash:qzs5eh484cc7gq2frw4y0ygdg33uv6ucrq48ewgqqf" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="BCH" type="text" value="bitcoincash:qzs5eh484cc7gq2frw4y0ygdg33uv6ucrq48ewgqqf" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="ETH" class="col-sm-4 col-form-label"><strong>Ethereum (ETH)</strong> <a href="/assets/img/qr/ETH.png"><i class="fa fa-qrcode"></i></a></label>
         <div class="col-sm-8">
-          <input id="ETH" type="text" value="0x1DdD9c188aaf9198b664CeBce9a9cD03E75FdD49" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="ETH" type="text" value="0x1DdD9c188aaf9198b664CeBce9a9cD03E75FdD49" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="ZEC" class="col-sm-4 col-form-label"><strong>Zcash (ZEC)</strong> <a href="/assets/img/qr/ZEC.png"><i class="fa fa-qrcode"></i></a></label>
         <div class="col-sm-8">
-          <input id="ZEC" type="text" value="t1Sv6rSRchWUXkWNz7PkeYixTs9M2aAs4wX" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="ZEC" type="text" value="t1Sv6rSRchWUXkWNz7PkeYixTs9M2aAs4wX" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="LTC" class="col-sm-4 col-form-label"><strong>Litecoin (LTC)</strong> <a href="/assets/img/qr/LTC.png"><i class="fa fa-qrcode"></i></a></label>
         <div class="col-sm-8">
-          <input id="LTC" type="text" value="LSccXrCDm7zu4Gc6PiiW6sBaKjADfFGQSQ" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="LTC" type="text" value="LSccXrCDm7zu4Gc6PiiW6sBaKjADfFGQSQ" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="XLM" class="col-sm-4 col-form-label"><strong>Stellar (XLM)</strong> <a href="/assets/img/qr/XLM.png"><i class="fa fa-qrcode"></i></a></label>
         <div class="col-sm-8">
-          <input id="XLM" type="text" value="GA3GFFRS2PEZHFYOKYO5FSK5GAMW44AOGI4RY5ISXOWMD3PWAARFVAA4" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="XLM" type="text" value="GA3GFFRS2PEZHFYOKYO5FSK5GAMW44AOGI4RY5ISXOWMD3PWAARFVAA4" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="XMR" class="col-sm-4 col-form-label"><strong>Monero (XMR)</strong> <a href="/assets/img/qr/XMR.png"><i class="fa fa-qrcode"></i></a></label>
         <div class="col-sm-8">
-          <input id="XMR" type="text" value="45yJ8LkShLt2f9gCqbBQUcDw7um9XxD2vZ8h2Rt3GoLq9kMrznB3UAHBS1chJk9KjugpBbbJFGtdAeXE5j99wuGxDcbYUri" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="XMR" type="text" value="45yJ8LkShLt2f9gCqbBQUcDw7um9XxD2vZ8h2Rt3GoLq9kMrznB3UAHBS1chJk9KjugpBbbJFGtdAeXE5j99wuGxDcbYUri" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
@@ -90,203 +90,203 @@ permalink: /donate/
       <div class="form-group row">
         <label for="BNB" class="col-sm-4 col-form-label"><strong>Binance Coin (BNB)</strong></label>
         <div class="col-sm-8">
-          <input id="BNB" type="text" value="bnb17zlv4xnkjsujks80cclx46uhm9h8txms82htwj" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="BNB" type="text" value="bnb17zlv4xnkjsujks80cclx46uhm9h8txms82htwj" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="EOS" class="col-sm-4 col-form-label"><strong>EOS</strong></label>
         <div class="col-sm-8">
-          <input id="EOS" type="text" value="privacytools" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="EOS" type="text" value="privacytools" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="BAT" class="col-sm-4 col-form-label"><strong>Brave (BAT)</strong></label>
         <div class="col-sm-8">
-          <input id="BAT" type="text" value="0x13DA8c6176a9bd171B8285067Ae38420B39eC11E" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="BAT" type="text" value="0x13DA8c6176a9bd171B8285067Ae38420B39eC11E" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="XRP" class="col-sm-4 col-form-label"><strong>Ripple (XRP)</strong></label>
         <div class="col-sm-8">
-          <input id="XRP" type="text" value="r3EPSFMZNoHPKKhWUBfobtxck5UVR2T8mF" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="XRP" type="text" value="r3EPSFMZNoHPKKhWUBfobtxck5UVR2T8mF" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="DOGE" class="col-sm-4 col-form-label"><strong>Dogecoin (DOGE)</strong></label>
         <div class="col-sm-8">
-          <input id="DOGE" type="text" value="DHHPUaDq562BzET6QxhudJepXNDoG7yP12" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="DOGE" type="text" value="DHHPUaDq562BzET6QxhudJepXNDoG7yP12" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="ETC" class="col-sm-4 col-form-label"><strong>Ethereum Classic (ETC)</strong></label>
         <div class="col-sm-8">
-          <input id="ETC" type="text" value="0x6807739f23B74AE07F8902aBDA03cF854678dc7e" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="ETC" type="text" value="0x6807739f23B74AE07F8902aBDA03cF854678dc7e" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="BSV" class="col-sm-4 col-form-label"><strong>Bitcoin SV (BSV)</strong></label>
         <div class="col-sm-8">
-          <input id="BSV" type="text" value="1GamahbRfa4EBDBSN3ufEhJaE8xnH7kLim" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="BSV" type="text" value="1GamahbRfa4EBDBSN3ufEhJaE8xnH7kLim" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="DASH" class="col-sm-4 col-form-label"><strong>Dash (DASH)</strong></label>
         <div class="col-sm-8">
-          <input id="DASH" type="text" value="Xb62GojDghypwwwZj96kAiPwktjrxWMqf9" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="DASH" type="text" value="Xb62GojDghypwwwZj96kAiPwktjrxWMqf9" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="ADA" class="col-sm-4 col-form-label"><strong>Cardano (ADA)</strong></label>
         <div class="col-sm-8">
-          <input id="ADA" type="text" value="DdzFFzCqrht9wMYGwijaPDVocdpoJHXSE6MMr6L44QtxTBfSoBycXMtnrbTKzpqcRG88LZcUvJd3zXWADfgxX8K3errkhn9oB9ZuwBYe" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="ADA" type="text" value="DdzFFzCqrht9wMYGwijaPDVocdpoJHXSE6MMr6L44QtxTBfSoBycXMtnrbTKzpqcRG88LZcUvJd3zXWADfgxX8K3errkhn9oB9ZuwBYe" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="CLO" class="col-sm-4 col-form-label"><strong>Callisto (CLO)</strong></label>
         <div class="col-sm-8">
-          <input id="CLO" type="text" value="0xfAE4cd989afADc4ad2Cef6d33f3C50fd1F216846" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="CLO" type="text" value="0xfAE4cd989afADc4ad2Cef6d33f3C50fd1F216846" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="DCR" class="col-sm-4 col-form-label"><strong>Decred (DCR)</strong></label>
         <div class="col-sm-8">
-          <input id="DCR" type="text" value="DsbNyFxiKssCA4Sa2yEa4wiWrLD1EFnivFG" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="DCR" type="text" value="DsbNyFxiKssCA4Sa2yEa4wiWrLD1EFnivFG" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="DGB" class="col-sm-4 col-form-label"><strong>DigiByte (DGB)</strong></label>
         <div class="col-sm-8">
-          <input id="DGB" type="text" value="DGsMoXne1VrSd7YuA6EaKh9ca7HUCnxi7Y" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="DGB" type="text" value="DGsMoXne1VrSd7YuA6EaKh9ca7HUCnxi7Y" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="EXP" class="col-sm-4 col-form-label"><strong>Expanse (EXP)</strong></label>
         <div class="col-sm-8">
-          <input id="EXP" type="text" value="0x131b777EcdD546dfecCCC4f72642Ee4570c5B9f9" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="EXP" type="text" value="0x131b777EcdD546dfecCCC4f72642Ee4570c5B9f9" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="GRS" class="col-sm-4 col-form-label"><strong>Groestlcoin (GRS)</strong></label>
         <div class="col-sm-8">
-          <input id="GRS" type="text" value="Ffjva2xhmoUmt1Xmc1LR3tHHJVuQfTDAPz" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="GRS" type="text" value="Ffjva2xhmoUmt1Xmc1LR3tHHJVuQfTDAPz" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="KIN" class="col-sm-4 col-form-label"><strong>Kin (KIN)</strong></label>
         <div class="col-sm-8">
-          <input id="KIN" type="text" value="GBQT5R43PLKWLUOPFKDZFIXCIOG3QXU3KIJ432UQQALWSZIBW2QR43B2" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="KIN" type="text" value="GBQT5R43PLKWLUOPFKDZFIXCIOG3QXU3KIJ432UQQALWSZIBW2QR43B2" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="KMD" class="col-sm-4 col-form-label"><strong>Komodo (KMD)</strong></label>
         <div class="col-sm-8">
-          <input id="KMD" type="text" value="RDMncz9ddWUY1PQ6D9PDqkeJBLEwYvwSHC" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="KMD" type="text" value="RDMncz9ddWUY1PQ6D9PDqkeJBLEwYvwSHC" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="LSK" class="col-sm-4 col-form-label"><strong>Lisk (LSK)</strong></label>
         <div class="col-sm-8">
-          <input id="LSK" type="text" value="15983493180249602776L" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="LSK" type="text" value="15983493180249602776L" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="NGL" class="col-sm-4 col-form-label"><strong>Gulden (NGL)</strong></label>
         <div class="col-sm-8">
-          <input id="NGL" type="text" value="GRCpgMzWfFk1GveSrYP7FpH7BYwpt2hLQz" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="NGL" type="text" value="GRCpgMzWfFk1GveSrYP7FpH7BYwpt2hLQz" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="QTUM" class="col-sm-4 col-form-label"><strong>Qtum (QTUM)</strong></label>
         <div class="col-sm-8">
-          <input id="QTUM" type="text" value="QYwvS7gongbRhyG2khg2wh1LymxVGRA8Rs" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="QTUM" type="text" value="QYwvS7gongbRhyG2khg2wh1LymxVGRA8Rs" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="RDD" class="col-sm-4 col-form-label"><strong>Reddcoin (RDD)</strong></label>
         <div class="col-sm-8">
-          <input id="RDD" type="text" value="RmoLdW9DVXkxHjoFZyiDu1xzVtvckRf2Mn" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="RDD" type="text" value="RmoLdW9DVXkxHjoFZyiDu1xzVtvckRf2Mn" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="TRX" class="col-sm-4 col-form-label"><strong>Tron (TRX)</strong></label>
         <div class="col-sm-8">
-          <input id="TRX" type="text" value="TVjrf7S4C2ATcejmL4Z1BnH8us4QC24Gdq" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="TRX" type="text" value="TVjrf7S4C2ATcejmL4Z1BnH8us4QC24Gdq" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="UBQ" class="col-sm-4 col-form-label"><strong>Ubiq (UBQ)</strong></label>
         <div class="col-sm-8">
-          <input id="UBQ" type="text" value="0x2Aa4EfF8C9f8877fC733FA54d459B68840303707" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="UBQ" type="text" value="0x2Aa4EfF8C9f8877fC733FA54d459B68840303707" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="VTC" class="col-sm-4 col-form-label"><strong>Vertcoin (VTC)</strong></label>
         <div class="col-sm-8">
-          <input id="VTC" type="text" value="VgCf1Fwks8yaKMcDTzu5wkQTc5QLVMCwPd" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="VTC" type="text" value="VgCf1Fwks8yaKMcDTzu5wkQTc5QLVMCwPd" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="WAVES" class="col-sm-4 col-form-label"><strong>Waves (WAVES)</strong></label>
         <div class="col-sm-8">
-          <input id="WAVES" type="text" value="3PES6AF194L56BuhRwrLF41eAsGzcGDARCi" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="WAVES" type="text" value="3PES6AF194L56BuhRwrLF41eAsGzcGDARCi" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="XEM" class="col-sm-4 col-form-label"><strong>NEM (XEM)</strong></label>
         <div class="col-sm-8">
-          <input id="XEM" type="text" value="NC7KTVGV7MH2EJMDM4YHAJ2AECQEBE2AXJSFACG6" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="XEM" type="text" value="NC7KTVGV7MH2EJMDM4YHAJ2AECQEBE2AXJSFACG6" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="XTZ" class="col-sm-4 col-form-label"><strong>Tezos (XTZ)</strong></label>
         <div class="col-sm-8">
-          <input id="XTZ" type="text" value="tz1SUiszXUx8njTueLdnwqahYRM4QTEQ2wT3" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="XTZ" type="text" value="tz1SUiszXUx8njTueLdnwqahYRM4QTEQ2wT3" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="XVG" class="col-sm-4 col-form-label"><strong>Verge (XVG)</strong></label>
         <div class="col-sm-8">
-          <input id="XVG" type="text" value="D5vWPfcSbwdc55amx4Z2kVvXuHa6kiaGUH" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="XVG" type="text" value="D5vWPfcSbwdc55amx4Z2kVvXuHa6kiaGUH" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="XZC" class="col-sm-4 col-form-label"><strong>ZCoin (XZC)</strong></label>
         <div class="col-sm-8">
-          <input id="XZC" type="text" value="a2sHJ3A2mo1yggmkhj4Ki6nqAT5ZnVE42n" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="XZC" type="text" value="a2sHJ3A2mo1yggmkhj4Ki6nqAT5ZnVE42n" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>
 
       <div class="form-group row">
         <label for="ZEN" class="col-sm-4 col-form-label"><strong>Horizen (ZEN)</strong></label>
         <div class="col-sm-8">
-          <input id="ZEN" type="text" value="znSwHaaYhPr2Uu6MTi5T7QCW3qP5UWmWDuY" onclick="this.focus();this.select()" class="form-control input-lg" readonly>
+          <input id="ZEN" type="text" value="znSwHaaYhPr2Uu6MTi5T7QCW3qP5UWmWDuY" class="form-control input-lg onclick-select" readonly>
         </div>
       </div>