+ initial import

assets/scripts/sprintf.min.js

@@ -0,0 +1,2 @@
+/*! sprintf-js | Alexandru Marasteanu <hello@alexei.ro> (http://alexei.ro/) | BSD-3-Clause */
+!function(a){function b(){var a=arguments[0],c=b.cache;return c[a]&&c.hasOwnProperty(a)||(c[a]=b.parse(a)),b.format.call(null,c[a],arguments)}function c(a){return"number"==typeof a?"number":"string"==typeof a?"string":Object.prototype.toString.call(a).slice(8,-1).toLowerCase()}function d(a,b){return b>=0&&7>=b&&g[a]?g[a][b]:Array(b+1).join(a)}var e={not_string:/[^s]/,not_bool:/[^t]/,not_type:/[^T]/,not_primitive:/[^v]/,number:/[diefg]/,numeric_arg:/bcdiefguxX/,json:/[j]/,not_json:/[^j]/,text:/^[^\x25]+/,modulo:/^\x25{2}/,placeholder:/^\x25(?:([1-9]\d*)\$|\(([^\)]+)\))?(\+)?(0|'[^$])?(-)?(\d+)?(?:\.(\d+))?([b-gijostTuvxX])/,key:/^([a-z_][a-z_\d]*)/i,key_access:/^\.([a-z_][a-z_\d]*)/i,index_access:/^\[(\d+)\]/,sign:/^[\+\-]/};b.format=function(a,f){var g,h,i,j,k,l,m,n=1,o=a.length,p="",q=[],r=!0,s="";for(h=0;o>h;h++)if(p=c(a[h]),"string"===p)q[q.length]=a[h];else if("array"===p){if(j=a[h],j[2])for(g=f[n],i=0;i<j[2].length;i++){if(!g.hasOwnProperty(j[2][i]))throw new Error(b('[sprintf] property "%s" does not exist',j[2][i]));g=g[j[2][i]]}else g=j[1]?f[j[1]]:f[n++];if(e.not_type.test(j[8])&&e.not_primitive.test(j[8])&&"function"==c(g)&&(g=g()),e.numeric_arg.test(j[8])&&"number"!=c(g)&&isNaN(g))throw new TypeError(b("[sprintf] expecting number but found %s",c(g)));switch(e.number.test(j[8])&&(r=g>=0),j[8]){case"b":g=parseInt(g,10).toString(2);break;case"c":g=String.fromCharCode(parseInt(g,10));break;case"d":case"i":g=parseInt(g,10);break;case"j":g=JSON.stringify(g,null,j[6]?parseInt(j[6]):0);break;case"e":g=j[7]?parseFloat(g).toExponential(j[7]):parseFloat(g).toExponential();break;case"f":g=j[7]?parseFloat(g).toFixed(j[7]):parseFloat(g);break;case"g":g=j[7]?parseFloat(g).toPrecision(j[7]):parseFloat(g);break;case"o":g=g.toString(8);break;case"s":g=String(g),g=j[7]?g.substring(0,j[7]):g;break;case"t":g=String(!!g),g=j[7]?g.substring(0,j[7]):g;break;case"T":g=c(g),g=j[7]?g.substring(0,j[7]):g;break;case"u":g=parseInt(g,10)>>>0;break;case"v":g=g.valueOf(),g=j[7]?g.substring(0,j[7]):g;break;case"x":g=parseInt(g,10).toString(16);break;case"X":g=parseInt(g,10).toString(16).toUpperCase()}e.json.test(j[8])?q[q.length]=g:(!e.number.test(j[8])||r&&!j[3]?s="":(s=r?"+":"-",g=g.toString().replace(e.sign,"")),l=j[4]?"0"===j[4]?"0":j[4].charAt(1):" ",m=j[6]-(s+g).length,k=j[6]&&m>0?d(l,m):"",q[q.length]=j[5]?s+g+k:"0"===l?s+k+g:k+s+g)}return q.join("")},b.cache={},b.parse=function(a){for(var b=a,c=[],d=[],f=0;b;){if(null!==(c=e.text.exec(b)))d[d.length]=c[0];else if(null!==(c=e.modulo.exec(b)))d[d.length]="%";else{if(null===(c=e.placeholder.exec(b)))throw new SyntaxError("[sprintf] unexpected placeholder");if(c[2]){f|=1;var g=[],h=c[2],i=[];if(null===(i=e.key.exec(h)))throw new SyntaxError("[sprintf] failed to parse named argument key");for(g[g.length]=i[1];""!==(h=h.substring(i[0].length));)if(null!==(i=e.key_access.exec(h)))g[g.length]=i[1];else{if(null===(i=e.index_access.exec(h)))throw new SyntaxError("[sprintf] failed to parse named argument key");g[g.length]=i[1]}c[2]=g}else f|=2;if(3===f)throw new Error("[sprintf] mixing positional and named placeholders is not (yet) supported");d[d.length]=c}b=b.substring(c[0].length)}return d};var f=function(a,c,d){return d=(c||[]).slice(0),d.splice(0,0,a),b.apply(null,d)},g={0:["","0","00","000","0000","00000","000000","0000000"]," ":[""," ","  ","   ","    ","     ","      ","       "],_:["","_","__","___","____","_____","______","_______"]};"undefined"!=typeof exports?(exports.sprintf=b,exports.vsprintf=f):(a.sprintf=b,a.vsprintf=f,"function"==typeof define&&define.amd&&define(function(){return{sprintf:b,vsprintf:f}}))}("undefined"==typeof window?this:window);

assets/styles/buttons.css

@@ -0,0 +1,45 @@
+.btn-etho { 
+    color: #ffffff; 
+    background-color: #7A1336; 
+    border-color: #450118; 
+  } 
+   
+  .btn-etho:hover, 
+  .btn-etho:focus, 
+  .btn-etho:active, 
+  .btn-etho.active, 
+  .open .dropdown-toggle.btn-etho { 
+    color: #ffffff; 
+    background-color: #B01549; 
+    border-color: #450118; 
+  } 
+   
+  .btn-etho:active, 
+  .btn-etho.active, 
+  .open .dropdown-toggle.btn-etho { 
+    background-image: none; 
+  } 
+   
+  .btn-etho.disabled, 
+  .btn-etho[disabled], 
+  fieldset[disabled] .btn-etho, 
+  .btn-etho.disabled:hover, 
+  .btn-etho[disabled]:hover, 
+  fieldset[disabled] .btn-etho:hover, 
+  .btn-etho.disabled:focus, 
+  .btn-etho[disabled]:focus, 
+  fieldset[disabled] .btn-etho:focus, 
+  .btn-etho.disabled:active, 
+  .btn-etho[disabled]:active, 
+  fieldset[disabled] .btn-etho:active, 
+  .btn-etho.disabled.active, 
+  .btn-etho[disabled].active, 
+  fieldset[disabled] .btn-etho.active { 
+    background-color: #7A1336; 
+    border-color: #450118; 
+  } 
+   
+  .btn-etho .badge { 
+    color: #7A1336; 
+    background-color: #ffffff; 
+  }

assets/styles/forms.css

@@ -0,0 +1,24 @@
+.select-wrapper .caret {
+    fill: #aaa;
+}
+
+.select-dropdown
+{
+    color: #aaa;
+}
+
+.dropdown-content li>a, .dropdown-content li>span {
+    color: rgb(36, 13, 21);
+}
+
+#sendFeeRange {
+    margin-top: 40px;
+}
+
+.card-panel {
+    background-color: #333
+}
+
+.sendWrapper input {
+    color: #aaa;
+}

assets/styles/please-wait.css

@@ -0,0 +1,161 @@
+/* line 17, ../src/please-wait.scss */
+body.pg-loading {
+  overflow: hidden;
+}
+
+/* line 21, ../src/please-wait.scss */
+.pg-loading-screen {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  top: 0;
+  z-index: 1000000;
+  opacity: 1;
+  background-color: #FFF;
+  -webkit-transition: background-color 0.4s ease-in-out 0s;
+  -moz-transition: background-color 0.4s ease-in-out 0s;
+  -ms-transition: background-color 0.4s ease-in-out 0s;
+  -o-transition: background-color 0.4s ease-in-out 0s;
+  transition: background-color 0.4s ease-in-out 0s;
+}
+/* line 32, ../src/please-wait.scss */
+.pg-loading-screen.pg-loaded {
+  opacity: 0;
+  -webkit-animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both;
+  -moz-animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both;
+  -ms-animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both;
+  -o-animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both;
+  animation: pgAnimLoaded 0.5s cubic-bezier(0.7, 0, 0.3, 1) both;
+}
+/* line 38, ../src/please-wait.scss */
+.pg-loading-screen.pg-loading .pg-loading-logo-header, .pg-loading-screen.pg-loading .pg-loading-html {
+  opacity: 1;
+}
+/* line 42, ../src/please-wait.scss */
+.pg-loading-screen.pg-loading .pg-loading-logo-header, .pg-loading-screen.pg-loading .pg-loading-html:not(.pg-loaded) {
+  -webkit-animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both;
+  -moz-animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both;
+  -ms-animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both;
+  -o-animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both;
+  animation: pgAnimLoading 1s cubic-bezier(0.7, 0, 0.3, 1) both;
+}
+/* line 46, ../src/please-wait.scss */
+.pg-loading-screen.pg-loading .pg-loading-html:not(.pg-loaded) {
+  -webkit-animation-delay: 0.3s;
+  -moz-animation-delay: 0.3s;
+  -ms-animation-delay: 0.3s;
+  -o-animation-delay: 0.3s;
+  animation-delay: 0.3s;
+}
+/* line 51, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-inner {
+  height: 100%;
+  width: 100%;
+  margin: 0;
+  padding: 0;
+  position: static;
+}
+/* line 59, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-center-outer {
+  width: 100%;
+  padding: 0;
+  display: table !important;
+  height: 100%;
+  position: absolute;
+  top: 0;
+  left: 0;
+  margin: 0;
+}
+/* line 70, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-center-middle {
+  padding: 0;
+  vertical-align: middle;
+  display: table-cell  !important;
+  margin: 0;
+  text-align: center;
+}
+/* line 78, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-logo-header, .pg-loading-screen .pg-loading-html {
+  width: 100%;
+  opacity: 0;
+}
+/* line 83, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-logo-header {
+  text-align: center;
+}
+/* line 86, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-logo-header img {
+  display: inline-block !important;
+}
+/* line 91, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-html {
+  margin-top: 90px;
+}
+/* line 94, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-html.pg-loaded {
+  -webkit-transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1);
+  -moz-transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1);
+  -ms-transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1);
+  -o-transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1);
+  transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1);
+}
+/* line 97, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-html.pg-loaded.pg-removing {
+  opacity: 0;
+}
+/* line 101, ../src/please-wait.scss */
+.pg-loading-screen .pg-loading-html.pg-loaded.pg-loading {
+  opacity: 1;
+}
+
+@-webkit-keyframes pgAnimLoading {
+  from {
+    opacity: 0;
+  }
+}
+@-moz-keyframes pgAnimLoading {
+  from {
+    opacity: 0;
+  }
+}
+@-o-keyframes pgAnimLoading {
+  from {
+    opacity: 0;
+  }
+}
+@-ms-keyframes pgAnimLoading {
+  from {
+    opacity: 0;
+  }
+}
+@keyframes pgAnimLoading {
+  from {
+    opacity: 0;
+  }
+}
+@-webkit-keyframes pgAnimLoaded {
+  from {
+    opacity: 1;
+  }
+}
+@-moz-keyframes pgAnimLoaded {
+  from {
+    opacity: 1;
+  }
+}
+@-o-keyframes pgAnimLoaded {
+  from {
+    opacity: 1;
+  }
+}
+@-ms-keyframes pgAnimLoaded {
+  from {
+    opacity: 1;
+  }
+}
+@keyframes pgAnimLoaded {
+  from {
+    opacity: 1;
+  }
+}

assets/styles/spinner.css

@@ -0,0 +1,41 @@
+.spinner {
+    margin: 0px auto 0;
+    width: 70px;
+    text-align: center;
+  }
+  
+  .spinner > div {
+    width: 18px;
+    height: 18px;
+    background-color: #333;
+  
+    border-radius: 100%;
+    display: inline-block;
+    -webkit-animation: sk-bouncedelay 1.4s infinite ease-in-out both;
+    animation: sk-bouncedelay 1.4s infinite ease-in-out both;
+  }
+  
+  .spinner .bounce1 {
+    -webkit-animation-delay: -0.32s;
+    animation-delay: -0.32s;
+  }
+  
+  .spinner .bounce2 {
+    -webkit-animation-delay: -0.16s;
+    animation-delay: -0.16s;
+  }
+  
+  @-webkit-keyframes sk-bouncedelay {
+    0%, 80%, 100% { -webkit-transform: scale(0) }
+    40% { -webkit-transform: scale(1.0) }
+  }
+  
+  @keyframes sk-bouncedelay {
+    0%, 80%, 100% { 
+      -webkit-transform: scale(0);
+      transform: scale(0);
+    } 40% { 
+      -webkit-transform: scale(1.0);
+      transform: scale(1.0);
+    }
+  }

assets/styles/style.css

@@ -0,0 +1,317 @@
+html {
+  color: #aaa;
+}
+
+/* hide / show the body when the loader is finished */
+body > .inner {
+  display: none;
+}
+
+body.pg-loaded > .inner {
+  display: block;
+}
+
+/* Style the sidebar - fixed full height */
+.sidebar {
+  height: 100%;
+  width: 120px;
+  position: fixed;
+  z-index: 1;
+  top: 0;
+  left: 0;
+  background-color: #111;
+  overflow-x: hidden;
+  padding-top: 16px;
+}
+  
+/* Style sidebar links */
+.sidebar a {
+  padding: 6px 8px 6px 16px;
+  text-decoration: none;
+  font-size: 20px;
+  color: #818181;
+  display: block;
+}
+
+/* Style links on mouse-over */
+.sidebar a:hover {
+  color: #f1f1f1;
+}
+
+#peerCount {
+  bottom: 0;
+  height: 20px;
+  color: #aaa;
+  position: absolute;
+  font-size: 0.8em;
+  padding-left: 5px;
+}
+ 
+#syncProgress
+{
+  height: 20px;
+  position: fixed;
+  z-index: 1;
+  left: 120px;
+  right: 0;
+  bottom: 0;
+  background-color: #111;
+  border-top: 1px solid #111;
+}
+
+#mainContent
+{
+  position: fixed;
+  z-index: 1;
+  left: 120px;
+  top: 0;
+  right: 0;
+  bottom: 20px;
+  background-color: #212529;
+}
+
+/* Style the main content */
+.main {
+  margin-left: 160px; /* Same as the width of the sidenav */
+  padding: 0px 10px;
+}
+  
+/* Add media queries for small screens (when the height of the screen is less than 450px, add a smaller padding and font-size) */
+@media screen and (max-height: 450px) {
+  .sidebar {padding-top: 15px;}
+  .sidebar a {font-size: 18px;}
+}
+
+.sidebarIcon {
+  width: 100%;
+  height: 80px;
+  line-height: 80px;
+}
+
+.sidebarIconWrapper {
+  width: 100%;
+  height: 80px;  
+  display: inline-block;
+  text-align: center;
+  vertical-align: middle;  
+}
+
+#sumBalance {
+  float: right;
+  font-weight: bold;
+  line-height: 38px;  
+  margin-right: 10px;
+}
+
+.modalBodyPassword {
+  margin: 20px;
+}
+
+#dlgGeneralError .modalBodyPassword {
+  height: 100px;
+}
+
+#dlgCreateWalletPassword .modalBodyPassword,
+#dlgCreateWalletPassword .modalBodyPassword {
+    height: 200px;
+}
+
+#dlgSendWalletPassword .modalBodyPassword {
+  height: 300px;
+}
+
+#dlgChangeWalletName .modalBodyPassword {
+  height: 150px;
+}
+
+.btn-dialog-confirm {
+  position: absolute;
+  bottom: 10px;
+  right: 20px;
+}
+
+.modalDialog {
+  display: none;
+  border-bottom: 3px solid #7A1336 !important;
+  border-radius: 0px !important;
+}
+
+.iziModal-header {
+  background: #7A1336 !important;
+}
+
+#walletsToolbar {
+  padding: 10px;
+  border-bottom: 1px solid #111;
+  border-radius: 0px;
+  height: 60px;
+}
+
+
+#transactionsWrapper {
+  color: #aaa;
+  padding-top: 10px;
+}
+
+div.iconSelected {
+  background-color: ivory;
+  border: 1px solid slategray;  
+}
+
+div.loadingText {
+  color: #aaa;
+  margin-top: 50px;
+}
+
+#tableTransactionsForAll_wrapper .dataTables_scroll {
+  font-size: 0.9em;
+}
+
+div.sidebar svg {
+  color: #7A1336;
+}
+
+#tableTransactionsForAll_filter {
+  color: #aaa;
+  padding-right: 10px;
+}
+
+#tableTransactionsForAll_filter label {
+  color: #aaa;
+  font-size: 1em;
+}
+
+#tableTransactionsForAll_filter input {
+  width: 400px;  
+  color: #aaa;
+  padding: 12px 10px;
+  display: inline-block;
+  border: 1px solid #ccc;
+  border-radius: 4px;
+  height: 2.5em;
+  box-sizing: border-box;
+}
+
+.floatThead-container {
+  background-color: #212529;
+}
+
+.dataTables_scrollBody .transactionsBlockNum {
+  color: #f92472;
+}
+
+.sendWrapper,
+.settingsWrapper
+{
+  padding: 30px;
+}
+
+#sendMaxAmmount {
+  margin-right: 5px;
+}
+
+#btnSendAll {
+  margin-left: 10px;
+}
+
+#addressList {
+  overflow-y: auto;
+  height: calc(100vh - 80px);
+}
+
+#addressList .colEdit {
+  padding-left: 20px;
+}
+
+.sendTXInfo {
+  height: 30px;
+}
+
+.sendTXInfo label {
+  line-height: 30px;
+  font-size: 1.2em;
+}
+
+.sendTXdivider {
+  margin-top: 30px;
+  margin-bottom: 20px;
+}
+
+#fromAddressInfo,
+#toAddressInfo,
+#valueToSendInfo,
+#feeToPayInfo {
+  color: #7A1336;
+  margin-left: 5px;
+  margin-right: 5px;
+}
+
+.accountName {
+  color: #7A1336;
+}
+
+.accountAddr {
+  font-size: 0.8em;
+}
+
+.pg-loading-screen .pg-loading-html {
+  margin-top: 0px;
+}
+
+.fromAddressSelect .dropdown-content {
+  width: 600px !important;
+}
+
+.loadingOverlay {
+  background-color: #212529;
+  display: none;
+  position: fixed;
+  left: 120px;
+  right: 0;
+  bottom: 20px;
+  top: 0;
+}
+
+.loadingOverlay .loadingWrapper {
+  height: 100%;
+  width: 100%;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-direction: column;
+}
+
+.loadingTextTransactions {
+  font-size: 1.3em;
+  margin-bottom: 30px;
+}
+
+.spinner .bounce {
+  background-color: #aaa;
+}
+
+.sumBalance {
+  color: white;
+  background-color: #7A1336;
+  border: 2px solid #991643;
+  border-radius: 10px;
+  padding: 5px;
+}
+
+.cleanText {
+  margin-left: 10px;
+}
+
+.cleanWrapper {
+  margin: 10px;
+}
+
+#noWalletsPresent {
+  font-size: 1.3em;
+}
+
+div.noWalletsWrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}

assets/styles/transactions.css

@@ -0,0 +1,357 @@
+/*
+ * Table styles
+ */
+table.dataTable {
+  width: 100%;
+  margin: 0 auto;
+  clear: both;
+  border-collapse: collapse;
+  border-spacing: 0;
+  /*
+   * Header and footer styles
+   */
+  /*
+   * Body styles
+   */ }
+  table.dataTable thead th,
+  table.dataTable tfoot th {
+    font-weight: bold; }
+  table.dataTable thead th,
+  table.dataTable thead td {
+    padding: 10px 18px;
+    border-bottom: 1px solid white; }
+    table.dataTable thead th:active,
+    table.dataTable thead td:active {
+      outline: none; }
+  table.dataTable tfoot th,
+  table.dataTable tfoot td {
+    padding: 10px 18px 6px 18px;
+    border-top: 1px solid white; }
+  table.dataTable thead .sorting,
+  table.dataTable thead .sorting_asc,
+  table.dataTable thead .sorting_desc,
+  table.dataTable thead .sorting_asc_disabled,
+  table.dataTable thead .sorting_desc_disabled {
+    cursor: pointer;
+    *cursor: hand;
+    background-repeat: no-repeat;
+    background-position: center right; }
+  table.dataTable thead .sorting {
+    background-image: url("../images/sort_both.png"); }
+  table.dataTable thead .sorting_asc {
+    background-image: url("../images/sort_asc.png"); }
+  table.dataTable thead .sorting_desc {
+    background-image: url("../images/sort_desc.png"); }
+  table.dataTable thead .sorting_asc_disabled {
+    background-image: url("../images/sort_asc_disabled.png"); }
+  table.dataTable thead .sorting_desc_disabled {
+    background-image: url("../images/sort_desc_disabled.png"); }
+  table.dataTable tbody tr {
+    background-color: #212529; }
+    table.dataTable tbody tr.selected {
+      background-color: #b0bed9; }
+  table.dataTable tbody th,
+  table.dataTable tbody td {
+    padding: 8px 10px; }
+  table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
+    border-top: 1px solid #666 }
+  table.dataTable.row-border tbody tr:first-child th,
+  table.dataTable.row-border tbody tr:first-child td, table.dataTable.display tbody tr:first-child th,
+  table.dataTable.display tbody tr:first-child td {
+    border-top: none; }
+  table.dataTable.cell-border tbody th, table.dataTable.cell-border tbody td {
+    border-top: 1px solid #bbb;
+    border-right: 1px solid #bbb; }
+  table.dataTable.cell-border tbody tr th:first-child,
+  table.dataTable.cell-border tbody tr td:first-child {
+    border-left: 1px solid #bbb; }
+  table.dataTable.cell-border tbody tr:first-child th,
+  table.dataTable.cell-border tbody tr:first-child td {
+    border-top: none; }
+  table.dataTable.stripe tbody tr.odd, table.dataTable.display tbody tr.odd {
+    background-color: #202428; }
+    table.dataTable.stripe tbody tr.odd.selected, table.dataTable.display tbody tr.odd.selected {
+      background-color: #abb9d3; }
+  table.dataTable.hover tbody tr:hover, table.dataTable.display tbody tr:hover {
+    background-color: #1f2327; }
+    table.dataTable.hover tbody tr:hover.selected, table.dataTable.display tbody tr:hover.selected {
+      background-color: #a9b7d1; }
+  table.dataTable.order-column tbody tr > .sorting_1,
+  table.dataTable.order-column tbody tr > .sorting_2,
+  table.dataTable.order-column tbody tr > .sorting_3, table.dataTable.display tbody tr > .sorting_1,
+  table.dataTable.display tbody tr > .sorting_2,
+  table.dataTable.display tbody tr > .sorting_3 {
+    background-color: #202428; }
+  table.dataTable.order-column tbody tr.selected > .sorting_1,
+  table.dataTable.order-column tbody tr.selected > .sorting_2,
+  table.dataTable.order-column tbody tr.selected > .sorting_3, table.dataTable.display tbody tr.selected > .sorting_1,
+  table.dataTable.display tbody tr.selected > .sorting_2,
+  table.dataTable.display tbody tr.selected > .sorting_3 {
+    background-color: #acbad4; }
+  table.dataTable.display tbody tr.odd > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
+    background-color: #1f2326; }
+  table.dataTable.display tbody tr.odd > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd > .sorting_2 {
+    background-color: #1f2327; }
+  table.dataTable.display tbody tr.odd > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd > .sorting_3 {
+    background-color: #1f2327; }
+  table.dataTable.display tbody tr.odd.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_1 {
+    background-color: #a6b3cd; }
+  table.dataTable.display tbody tr.odd.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_2 {
+    background-color: #a7b5ce; }
+  table.dataTable.display tbody tr.odd.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.odd.selected > .sorting_3 {
+    background-color: #a9b6d0; }
+  table.dataTable.display tbody tr.even > .sorting_1, table.dataTable.order-column.stripe tbody tr.even > .sorting_1 {
+    background-color: #202428; }
+  table.dataTable.display tbody tr.even > .sorting_2, table.dataTable.order-column.stripe tbody tr.even > .sorting_2 {
+    background-color: #202428; }
+  table.dataTable.display tbody tr.even > .sorting_3, table.dataTable.order-column.stripe tbody tr.even > .sorting_3 {
+    background-color: #202428; }
+  table.dataTable.display tbody tr.even.selected > .sorting_1, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_1 {
+    background-color: #acbad4; }
+  table.dataTable.display tbody tr.even.selected > .sorting_2, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_2 {
+    background-color: #adbbd6; }
+  table.dataTable.display tbody tr.even.selected > .sorting_3, table.dataTable.order-column.stripe tbody tr.even.selected > .sorting_3 {
+    background-color: #afbdd8; }
+  table.dataTable.display tbody tr:hover > .sorting_1, table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {
+    background-color: #1e2125; }
+  table.dataTable.display tbody tr:hover > .sorting_2, table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {
+    background-color: #1e2225; }
+  table.dataTable.display tbody tr:hover > .sorting_3, table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {
+    background-color: #1e2226; }
+  table.dataTable.display tbody tr:hover.selected > .sorting_1, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {
+    background-color: #a1aec7; }
+  table.dataTable.display tbody tr:hover.selected > .sorting_2, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {
+    background-color: #a2afc8; }
+  table.dataTable.display tbody tr:hover.selected > .sorting_3, table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {
+    background-color: #a4b2cb; }
+  table.dataTable.no-footer {
+    border-bottom: 1px solid white; }
+  table.dataTable.nowrap th, table.dataTable.nowrap td {
+    white-space: nowrap; }
+  table.dataTable.compact thead th,
+  table.dataTable.compact thead td {
+    padding: 4px 17px 4px 4px; }
+  table.dataTable.compact tfoot th,
+  table.dataTable.compact tfoot td {
+    padding: 4px; }
+  table.dataTable.compact tbody th,
+  table.dataTable.compact tbody td {
+    padding: 4px; }
+  table.dataTable th.dt-left,
+  table.dataTable td.dt-left {
+    text-align: left; }
+  table.dataTable th.dt-center,
+  table.dataTable td.dt-center,
+  table.dataTable td.dataTables_empty {
+    text-align: center; }
+  table.dataTable th.dt-right,
+  table.dataTable td.dt-right {
+    text-align: right; }
+  table.dataTable th.dt-justify,
+  table.dataTable td.dt-justify {
+    text-align: justify; }
+  table.dataTable th.dt-nowrap,
+  table.dataTable td.dt-nowrap {
+    white-space: nowrap; }
+  table.dataTable thead th.dt-head-left,
+  table.dataTable thead td.dt-head-left,
+  table.dataTable tfoot th.dt-head-left,
+  table.dataTable tfoot td.dt-head-left {
+    text-align: left; }
+  table.dataTable thead th.dt-head-center,
+  table.dataTable thead td.dt-head-center,
+  table.dataTable tfoot th.dt-head-center,
+  table.dataTable tfoot td.dt-head-center {
+    text-align: center; }
+  table.dataTable thead th.dt-head-right,
+  table.dataTable thead td.dt-head-right,
+  table.dataTable tfoot th.dt-head-right,
+  table.dataTable tfoot td.dt-head-right {
+    text-align: right; }
+  table.dataTable thead th.dt-head-justify,
+  table.dataTable thead td.dt-head-justify,
+  table.dataTable tfoot th.dt-head-justify,
+  table.dataTable tfoot td.dt-head-justify {
+    text-align: justify; }
+  table.dataTable thead th.dt-head-nowrap,
+  table.dataTable thead td.dt-head-nowrap,
+  table.dataTable tfoot th.dt-head-nowrap,
+  table.dataTable tfoot td.dt-head-nowrap {
+    white-space: nowrap; }
+  table.dataTable tbody th.dt-body-left,
+  table.dataTable tbody td.dt-body-left {
+    text-align: left; }
+  table.dataTable tbody th.dt-body-center,
+  table.dataTable tbody td.dt-body-center {
+    text-align: center; }
+  table.dataTable tbody th.dt-body-right,
+  table.dataTable tbody td.dt-body-right {
+    text-align: right; }
+  table.dataTable tbody th.dt-body-justify,
+  table.dataTable tbody td.dt-body-justify {
+    text-align: justify; }
+  table.dataTable tbody th.dt-body-nowrap,
+  table.dataTable tbody td.dt-body-nowrap {
+    white-space: nowrap; }
+ 
+table.dataTable,
+table.dataTable th,
+table.dataTable td {
+  box-sizing: content-box; }
+ 
+/*
+ * Control feature layout
+ */
+.dataTables_wrapper {
+  position: relative;
+  clear: both;
+  *zoom: 1;
+  zoom: 1; }
+  .dataTables_wrapper .dataTables_length {
+    float: left; }
+  .dataTables_wrapper .dataTables_filter {
+    float: right;
+    text-align: right; }
+    .dataTables_wrapper .dataTables_filter input {
+      margin-left: 0.5em; }
+  .dataTables_wrapper .dataTables_info {
+    clear: both;
+    float: left;
+    padding-top: 0.755em; }
+  .dataTables_wrapper .dataTables_paginate {
+    float: right;
+    text-align: right;
+    padding-top: 0.25em; }
+    .dataTables_wrapper .dataTables_paginate .paginate_button {
+      box-sizing: border-box;
+      display: inline-block;
+      min-width: 1.5em;
+      padding: 0.5em 1em;
+      margin-left: 2px;
+      text-align: center;
+      text-decoration: none !important;
+      cursor: pointer;
+      *cursor: hand;
+      color: #333333 !important;
+      border: 1px solid transparent;
+      border-radius: 2px; }
+      .dataTables_wrapper .dataTables_paginate .paginate_button.current, .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
+        color: #333333 !important;
+        border: 1px solid black;
+        background-color: #616c78;
+        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #616c78), color-stop(100%, #212529));
+        /* Chrome,Safari4+ */
+        background: -webkit-linear-gradient(top, #616c78 0%, #212529 100%);
+        /* Chrome10+,Safari5.1+ */
+        background: -moz-linear-gradient(top, #616c78 0%, #212529 100%);
+        /* FF3.6+ */
+        background: -ms-linear-gradient(top, #616c78 0%, #212529 100%);
+        /* IE10+ */
+        background: -o-linear-gradient(top, #616c78 0%, #212529 100%);
+        /* Opera 11.10+ */
+        background: linear-gradient(to bottom, #616c78 0%, #212529 100%);
+        /* W3C */ }
+      .dataTables_wrapper .dataTables_paginate .paginate_button.disabled, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover, .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {
+        cursor: default;
+        color: #666 !important;
+        border: 1px solid transparent;
+        background: transparent;
+        box-shadow: none; }
+      .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
+        color: white !important;
+        border: 1px solid #111111;
+        background-color: #585858;
+        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #585858), color-stop(100%, #111111));
+        /* Chrome,Safari4+ */
+        background: -webkit-linear-gradient(top, #585858 0%, #111111 100%);
+        /* Chrome10+,Safari5.1+ */
+        background: -moz-linear-gradient(top, #585858 0%, #111111 100%);
+        /* FF3.6+ */
+        background: -ms-linear-gradient(top, #585858 0%, #111111 100%);
+        /* IE10+ */
+        background: -o-linear-gradient(top, #585858 0%, #111111 100%);
+        /* Opera 11.10+ */
+        background: linear-gradient(to bottom, #585858 0%, #111111 100%);
+        /* W3C */ }
+      .dataTables_wrapper .dataTables_paginate .paginate_button:active {
+        outline: none;
+        background-color: #2b2b2b;
+        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b2b2b), color-stop(100%, #0c0c0c));
+        /* Chrome,Safari4+ */
+        background: -webkit-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
+        /* Chrome10+,Safari5.1+ */
+        background: -moz-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
+        /* FF3.6+ */
+        background: -ms-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
+        /* IE10+ */
+        background: -o-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
+        /* Opera 11.10+ */
+        background: linear-gradient(to bottom, #2b2b2b 0%, #0c0c0c 100%);
+        /* W3C */
+        box-shadow: inset 0 0 3px #111; }
+    .dataTables_wrapper .dataTables_paginate .ellipsis {
+      padding: 0 1em; }
+  .dataTables_wrapper .dataTables_processing {
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    width: 100%;
+    height: 40px;
+    margin-left: -50%;
+    margin-top: -25px;
+    padding-top: 20px;
+    text-align: center;
+    font-size: 1.2em;
+    background-color: white;
+    background: -webkit-gradient(linear, left top, right top, color-stop(0%, rgba(33, 37, 41, 0)), color-stop(25%, rgba(33, 37, 41, 0.9)), color-stop(75%, rgba(33, 37, 41, 0.9)), color-stop(100%, rgba(255, 255, 255, 0)));
+    background: -webkit-linear-gradient(left, rgba(33, 37, 41, 0) 0%, rgba(33, 37, 41, 0.9) 25%, rgba(33, 37, 41, 0.9) 75%, rgba(33, 37, 41, 0) 100%);
+    background: -moz-linear-gradient(left, rgba(33, 37, 41, 0) 0%, rgba(33, 37, 41, 0.9) 25%, rgba(33, 37, 41, 0.9) 75%, rgba(33, 37, 41, 0) 100%);
+    background: -ms-linear-gradient(left, rgba(33, 37, 41, 0) 0%, rgba(33, 37, 41, 0.9) 25%, rgba(33, 37, 41, 0.9) 75%, rgba(33, 37, 41, 0) 100%);
+    background: -o-linear-gradient(left, rgba(33, 37, 41, 0) 0%, rgba(33, 37, 41, 0.9) 25%, rgba(33, 37, 41, 0.9) 75%, rgba(33, 37, 41, 0) 100%);
+    background: linear-gradient(to right, rgba(33, 37, 41, 0) 0%, rgba(33, 37, 41, 0.9) 25%, rgba(33, 37, 41, 0.9) 75%, rgba(33, 37, 41, 0) 100%); }
+  .dataTables_wrapper .dataTables_length,
+  .dataTables_wrapper .dataTables_filter,
+  .dataTables_wrapper .dataTables_info,
+  .dataTables_wrapper .dataTables_processing,
+  .dataTables_wrapper .dataTables_paginate {
+    color: #333333; }
+  .dataTables_wrapper .dataTables_scroll {
+    clear: both; }
+    .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {
+      *margin-top: -1px;
+      -webkit-overflow-scrolling: touch; }
+      .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td {
+        vertical-align: middle; }
+      .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th > div.dataTables_sizing,
+      .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td > div.dataTables_sizing, .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th > div.dataTables_sizing,
+      .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td > div.dataTables_sizing {
+        height: 0;
+        overflow: hidden;
+        margin: 0 !important;
+        padding: 0 !important; }
+  .dataTables_wrapper.no-footer .dataTables_scrollBody {
+    border-bottom: 1px solid white; }
+  .dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,
+  .dataTables_wrapper.no-footer div.dataTables_scrollBody > table {
+    border-bottom: none; }
+  .dataTables_wrapper:after {
+    visibility: hidden;
+    display: block;
+    content: "";
+    clear: both;
+    height: 0; }
+ 
+@media screen and (max-width: 767px) {
+  .dataTables_wrapper .dataTables_info,
+  .dataTables_wrapper .dataTables_paginate {
+    float: none;
+    text-align: center; }
+  .dataTables_wrapper .dataTables_paginate {
+    margin-top: 0.5em; } }
+@media screen and (max-width: 640px) {
+  .dataTables_wrapper .dataTables_length,
+  .dataTables_wrapper .dataTables_filter {
+    float: none;
+    text-align: center; }
+  .dataTables_wrapper .dataTables_filter {
+    margin-top: 0.5em; } }

assets/templates/send.html

@@ -0,0 +1,86 @@
+<div class="sendWrapper">
+    <div class="card-panel">
+        <form class="col s12">
+            <div class="row">
+                <div class="input-field col s6">
+                    <select id="sendFromAddress">
+                        <option value="" disabled selected>Choose your address</option>
+                        {{#addressData}}
+                            <option value="{{address}}">{{name}} - {{address}}</option>
+                        {{/addressData}}
+                    </select>
+                    <label for="sendFromAddress">From address:</label>
+                </div>
+                <div class="input-field col s6">
+                    <input id="sendToAddress" placeholder="recipient address" type="text">
+                    <label for="sendToAddress" class="active">To address:</label>
+                </div>
+            </div>
+            <div class="row">
+                <div class="input-field col s6">
+                    <input id="sendAmmount" placeholder="0" type="number" value="0">
+                    <label for="sendAmmount" class="active">Ammount:</label>
+                </div>
+                <div class="input-field col s6">
+                    <div class="input-field col s12">
+                        <span id="sendMaxAmmount">0</span><span>ETHO</span>
+                        <button type="button" class="btn btn-etho" id="btnSendAll">ALL</button>   
+                    </div>
+                </div>
+            </div>
+            <div class="row">
+                <div class="input-field col s12">
+                    <button type="button" class="btn btn-etho" id="btnSendTransaction">Send</button>    
+                </div>
+            </div>
+        </form>
+    </div>
+    <div id="cardTransactionsForAddress" class="card-panel" style="display: none;">
+        <table id="tableTransactionsForAddress" class="display" style="width:100%">
+            <thead>
+                <tr>
+                    <th>Block</th>
+                    <th>Timestamp</th>
+                    <th>To</th>
+                    <th>Value</th>
+                </tr>
+            </thead>
+            <tfoot>
+                <tr>
+                    <th>Block</th>
+                    <th>Timestamp</th>
+                    <th>To</th>
+                    <th>Value</th>
+                </tr>
+            </tfoot>
+        </table>            
+    </div>
+</div>
+
+<!-- The modal for wallet password -->
+<div id="dlgSendWalletPassword" class="modalDialog" data-iziModal-title="Wallet Password" data-iziModal-subtitle="To send from this wallet, please enter the wallet password" data-iziModal-icon="icon-home">
+    <div class="modalBodyPassword">
+        <div class="form-group sendTXInfo">
+            <i class="fas fa-wallet"></i>
+            <label>From address:</label><label id="fromAddressInfo"></label>
+        </div>
+        <div class="form-group sendTXInfo">
+            <i class="fas fa-wallet"></i>
+            <label>To address:</label><label id="toAddressInfo"></label>
+        </div>
+        <div class="form-group sendTXInfo">
+            <i class="fas fa-dollar-sign"></i>
+            <label>Value to send:</label><label id="valueToSendInfo"></label><label class="currencyTicker">ETHO</label>
+        </div>
+        <div class="form-group sendTXInfo">
+            <i class="fas fa-dollar-sign"></i>
+            <label>Fee to pay:</label><label id="feeToPayInfo"></label><label class="currencyTicker">ETHO</label>
+        </div>       
+        <hr class="sendTXdivider">             
+        <div class="form-group sendTXPass">
+            <label for="usr">Type Password:</label>
+            <input type="password" class="form-control" id="walletPassword">
+        </div>
+        <button type="button" class="btn btn-etho btn-dialog-confirm" id="btnSendWalletPasswordConfirm">Confirm</button>
+    </div>
+</div>

assets/templates/settings.html

@@ -0,0 +1,17 @@
+<div class="settingsWrapper">
+    <div class="card-panel">
+        <div class="cleanWrapper">
+            <button type="button" class="btn btn-etho btnSettingsClean" id="btnSettingsCleanTransactions"><i class="far fa-trash-alt"></i></button>   
+            <span class="cleanText">Clean transactions data</span>
+        </div>
+        <div class="cleanWrapper">
+            <button type="button" class="btn btn-etho btnSettingsClean" id="btnSettingsCleanWallets"><i class="far fa-trash-alt"></i></button>   
+            <span class="cleanText">Clean wallets data</span>
+        </div>
+        <div class="cleanWrapper">
+           <button type="button" class="btn btn-etho btnSettingsClean" id="btnSettingsCleanBlockchain"><i class="far fa-trash-alt"></i></button>   
+           <span class="cleanText">Clean blockchain data</span>
+        </div>
+    </div>
+</div>
+      1

assets/templates/transactions.html

@@ -0,0 +1,33 @@
+<div id="transactionsWrapper">
+    <table id="tableTransactionsForAll" class="display tableTransactions" style="width:100%">
+        <thead>
+            <tr>
+                <th>Block</th>
+                <th>Timestamp</th>
+                <th>From</th>
+                <th>To</th>
+                <th>Value</th>
+            </tr>
+        </thead>
+        <tfoot>
+            <tr>
+                <th>Block</th>
+                <th>Timestamp</th>
+                <th>From</th>
+                <th>To</th>
+                <th>Value</th>
+            </tr>
+        </tfoot>
+    </table>
+</div>
+
+<div class="loadingOverlay" id="loadingTransactionsOverlay">
+    <div class="loadingWrapper">
+        <div class="loadingTextTransactions">Transaction are loading, please wait...</div>
+        <div class='spinner'>
+            <div class='bounce bounce1'></div>
+            <div class='bounce bounce2'></div>
+            <div class='bounce bounce3'></div>
+        </div>
+    <div>
+</div>

assets/templates/wallets.html

@@ -0,0 +1,59 @@
+<div id="walletsToolbar">
+    <button type="button" class="btn btn-etho" id="btnNewAddress">New Address</button>    
+    <div id="sumBalance">Total ETHO: <span class="sumBalance">{{sumBalance}}</span></div>
+</div>
+<div id="addressList" class="{{#if addressData.length}}walletsWrapper{{else}}noWalletsWrapper{{/if}}">
+    {{#if addressData.length}}
+        <table class="bordered" id="addressTable">
+            <thead>
+                <tr>
+                <th scope="col"></th>
+                <th scope="col">Name</th>
+                <th scope="col">Address</th>
+                <th scope="col">Balance</th>
+                </tr>
+            </thead>
+            <tbody>
+                {{#addressData}}
+                    <tr>
+                        <th scope="row" class="colEdit"><button type="button" class="btn btn-etho btnChangWalletName" data-wallet="{{address}}" data-name="{{name}}">Edit</button></th>
+                        <td>{{name}}</td>
+                        <td>{{address}}</td>
+                        <td>{{balance}}</td>
+                    </tr>
+                {{/addressData}}
+            </tbody>
+        </table>
+    {{else}}
+      <div id="noWalletsPresent">You don't have any wallets, please import them, or create a new one</div>
+    {{/if}}
+</div>
+<div id="transactionList">
+</div>
+
+<!-- The modal for new wallet -->
+<div id="dlgCreateWalletPassword" class="modalDialog" data-iziModal-title="Wallet Password" data-iziModal-subtitle="Make sure to write it down or remember it!!!" data-iziModal-icon="icon-home">
+    <div class="modalBodyPassword">
+        <div class="form-group">
+            <label for="usr">Type Password:</label>
+            <input type="password" class="form-control" id="walletPasswordFirst">
+        </div>
+        <div class="form-group">
+            <label for="pwd">Confirm Password:</label>
+            <input type="password" class="form-control" id="walletPasswordSecond">
+        </div>
+        <button type="button" class="btn btn-etho btn-dialog-confirm" id="btnCreateWalletConfirm">Confirm</button>
+    </div>
+    </div>
+</div>
+
+<!-- The modal to change wallet name -->
+<div id="dlgChangeWalletName" class="modalDialog" data-iziModal-title="Wallet Name" data-iziModal-subtitle="Enter the name for this address" data-iziModal-icon="icon-home">
+    <div class="modalBodyPassword">
+        <div class="form-group">
+            <label for="usr">Type Name:</label>
+            <input type="text" class="form-control" id="inputWalletName">
+        </div>
+        <button type="button" class="btn btn-etho btn-dialog-confirm" id="btnChangeWalletNameConfirm">Confirm</button>
+    </div>
+</div>