1558 lines
61 KiB
HTML
1558 lines
61 KiB
HTML
<html>
|
|
|
|
<head>
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.2/css/all.css">
|
|
<link href="https://fonts.googleapis.com/css?family=Titillium+Web" rel="stylesheet">
|
|
</head>
|
|
|
|
<!-- THIS IS A BEAUTIFUL SOLUTION -->
|
|
<style>
|
|
article,
|
|
aside,
|
|
details,
|
|
figcaption,
|
|
figure,
|
|
footer,
|
|
header,
|
|
hgroup,
|
|
main,
|
|
nav,
|
|
section,
|
|
summary {
|
|
display: block;
|
|
}
|
|
|
|
audio,
|
|
canvas,
|
|
video {
|
|
display: inline-block;
|
|
}
|
|
|
|
audio:not([controls]) {
|
|
display: none;
|
|
height: 0;
|
|
}
|
|
|
|
[hidden] {
|
|
display: none;
|
|
}
|
|
|
|
html {
|
|
font-family: 'Titillium Web';
|
|
-ms-text-size-adjust: 100%;
|
|
-webkit-text-size-adjust: 100%;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
}
|
|
|
|
a:focus {
|
|
outline: thin dotted;
|
|
}
|
|
|
|
a:active,
|
|
a:hover {
|
|
outline: 0;
|
|
}
|
|
|
|
h1 {
|
|
font-size: 2em;
|
|
margin: 0.67em 0;
|
|
}
|
|
|
|
abbr[title] {
|
|
border-bottom: 1px dotted;
|
|
}
|
|
|
|
b,
|
|
strong {
|
|
font-weight: bold;
|
|
}
|
|
|
|
dfn {
|
|
font-style: italic;
|
|
}
|
|
|
|
hr {
|
|
-moz-box-sizing: content-box;
|
|
box-sizing: content-box;
|
|
height: 0;
|
|
}
|
|
|
|
mark {
|
|
background: #ff0;
|
|
color: #000;
|
|
}
|
|
|
|
code,
|
|
kbd,
|
|
pre,
|
|
samp {
|
|
font-family: monospace, serif;
|
|
font-size: 1em;
|
|
}
|
|
|
|
pre {
|
|
white-space: pre-wrap;
|
|
}
|
|
|
|
q {
|
|
quotes: "\201C""\201D""\2018""\2019";
|
|
}
|
|
|
|
small {
|
|
font-size: 80%;
|
|
}
|
|
|
|
sub,
|
|
sup {
|
|
font-size: 75%;
|
|
line-height: 0;
|
|
position: relative;
|
|
vertical-align: baseline;
|
|
}
|
|
|
|
sup {
|
|
top: -0.5em;
|
|
}
|
|
|
|
sub {
|
|
bottom: -0.25em;
|
|
}
|
|
|
|
img {
|
|
border: 0;
|
|
}
|
|
|
|
svg:not(:root) {
|
|
overflow: hidden;
|
|
}
|
|
|
|
figure {
|
|
margin: 0;
|
|
}
|
|
|
|
fieldset {
|
|
border: 1px solid #c0c0c0;
|
|
margin: 0 2px;
|
|
padding: 0.35em 0.625em 0.75em;
|
|
}
|
|
|
|
legend {
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
button,
|
|
input,
|
|
select,
|
|
textarea {
|
|
font-family: inherit;
|
|
font-size: 100%;
|
|
margin: 0;
|
|
}
|
|
|
|
button,
|
|
input {
|
|
line-height: normal;
|
|
}
|
|
|
|
button,
|
|
select {
|
|
text-transform: none;
|
|
}
|
|
|
|
button,
|
|
html input[type="button"],
|
|
input[type="reset"],
|
|
input[type="submit"] {
|
|
-webkit-appearance: button;
|
|
cursor: pointer;
|
|
}
|
|
|
|
button[disabled],
|
|
html input[disabled] {
|
|
cursor: default;
|
|
}
|
|
|
|
input[type="checkbox"],
|
|
input[type="radio"] {
|
|
box-sizing: border-box;
|
|
padding: 0;
|
|
}
|
|
|
|
input[type="search"] {
|
|
-webkit-appearance: textfield;
|
|
-moz-box-sizing: content-box;
|
|
-webkit-box-sizing: content-box;
|
|
box-sizing: content-box;
|
|
}
|
|
|
|
input[type="search"]::-webkit-search-cancel-button,
|
|
input[type="search"]::-webkit-search-decoration {
|
|
-webkit-appearance: none;
|
|
}
|
|
|
|
button::-moz-focus-inner,
|
|
input::-moz-focus-inner {
|
|
border: 0;
|
|
padding: 0;
|
|
}
|
|
|
|
textarea {
|
|
overflow: auto;
|
|
vertical-align: top;
|
|
}
|
|
|
|
table {
|
|
border-collapse: collapse;
|
|
border-spacing: 0;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
/*font-family: Nunito,helvetica neue,Arial,sans-serif,apple color emoji,segoe ui emoji,segoe ui symbol;*/
|
|
font-size: 1em;
|
|
font-weight: 400;
|
|
line-height: 1.5;
|
|
/* color: #212529;*/
|
|
text-align: left;
|
|
background-color: #fff;
|
|
}
|
|
|
|
*,
|
|
*::before,
|
|
*::after {
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.maincontainer {
|
|
display: flex;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
flex-direction: column;
|
|
min-height: 100vh;
|
|
}
|
|
|
|
.container {
|
|
width: 100%;
|
|
padding-right: 15px;
|
|
padding-left: 15px;
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
|
|
/* media query shiz */
|
|
max-width: 1140px;
|
|
}
|
|
|
|
.navbar {
|
|
background-color: #fff;
|
|
position: relative;
|
|
z-index: 100;
|
|
padding: 8 16 8 16;
|
|
|
|
display: flex;
|
|
align-items: center;
|
|
padding: .5rem 1rem;
|
|
box-shadow: 0 0 30px 0 rgba(21, 53, 80, .12);
|
|
|
|
/* media query shiz 992*/
|
|
flex-flow: row nowrap;
|
|
-webkit-box-pack: start;
|
|
-ms-flex-pack: start;
|
|
justify-content: flex-start;
|
|
}
|
|
|
|
.navbar_container {
|
|
display: flex;
|
|
flex-wrap: nowrap;
|
|
-webkit-box-align: center;
|
|
align-items: center;
|
|
-webkit-box-pack: justify;
|
|
justify-content: space-between;
|
|
width: 100%;
|
|
padding-right: 15px;
|
|
padding-left: 15px;
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
|
|
/* media query shiz 1200*/
|
|
flex-wrap: nowrap;
|
|
max-width: 1140px;
|
|
}
|
|
|
|
.navbar_brand {
|
|
color: #fff;
|
|
margin-left: 0;
|
|
display: inline-block;
|
|
padding-top: .3125rem;
|
|
padding-bottom: .3125rem;
|
|
margin-right: 1rem;
|
|
font-size: 1.25rem;
|
|
line-height: inherit;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.navbar_container a {
|
|
text-decoration: none;
|
|
background-color: transparent;
|
|
-webkit-text-decoration-skip: objects;
|
|
}
|
|
|
|
.navbar_logo {
|
|
max-height: 28px;
|
|
width: auto;
|
|
}
|
|
|
|
.navbarmenu_search {
|
|
flex-grow: 1;
|
|
-webkit-box-align: center;
|
|
align-items: center;
|
|
|
|
/* media query shiz */
|
|
display: flex !important;
|
|
flex-basis: auto;
|
|
}
|
|
|
|
.searchform_container {
|
|
|
|
/* media query shiz 1200*/
|
|
height: 57px;
|
|
margin-bottom: -8px;
|
|
margin-top: -8px;
|
|
|
|
/* media query inherited shiz 992*/
|
|
display: flex !important;
|
|
box-sizing: border-box;
|
|
font-size: 12px;
|
|
font-weight: 400;
|
|
line-height: 1.5;
|
|
color: #212529;
|
|
text-align: left;
|
|
}
|
|
|
|
.search_form {
|
|
height: 100%;
|
|
display: flex;
|
|
flex-flow: row wrap;
|
|
-webkit-box-align: center;
|
|
align-items: center;
|
|
|
|
/* media query shiz */
|
|
margin-bottom: 0 !important;
|
|
margin-top: 0 !important;
|
|
}
|
|
|
|
.searchBar {
|
|
text-overflow: ellipsis !important;
|
|
width: 280px;
|
|
background: #f5f6fa;
|
|
border-color: #f5f6fa;
|
|
color: #828ba0;
|
|
font-size: 14px;
|
|
height: 50px;
|
|
padding-left: 38px;
|
|
padding-right: 8px;
|
|
position: relative;
|
|
z-index: 1;
|
|
overflow: visible;
|
|
margin: 0;
|
|
font-family: inherit;
|
|
box-sizing: border-box;
|
|
-webkit-appearance: textfield;
|
|
-webkit-rtl-ordering: logical;
|
|
cursor: text;
|
|
letter-spacing: normal;
|
|
word-spacing: normal;
|
|
text-transform: none;
|
|
text-indent: 0px;
|
|
text-shadow: none;
|
|
text-rendering: auto;
|
|
-webkit-box-direction: normal;
|
|
-webkit-tap-highlight-color: transparent;
|
|
text-align: center;
|
|
vertical-align: center;
|
|
|
|
}
|
|
|
|
.search_button {
|
|
border-radius: 2px;
|
|
border: none;
|
|
display: inline-block;
|
|
line-height: 1.2;
|
|
padding: 10px 16px;
|
|
text-align: center;
|
|
text-decoration: none;
|
|
transition: all .4s ease-in-out;
|
|
white-space: nowrap;
|
|
|
|
color: #20b760;
|
|
background-color: transparent;
|
|
background-image: none;
|
|
|
|
position: absolute;
|
|
width: 1px;
|
|
text-transform: none;
|
|
|
|
/* media query shiz*/
|
|
margin-bottom: 0 !important;
|
|
margin-top: 0 !important;
|
|
}
|
|
|
|
.main {
|
|
flex-grow: 1;
|
|
background-color: #fbfafc;
|
|
padding-top: 3rem !important;
|
|
display: block;
|
|
}
|
|
|
|
.dashboard-banner-container {
|
|
background-image: linear-gradient(to bottom, #5c34a2, #673ab5);
|
|
background-color: #5c34a2;
|
|
box-shadow: 0 5px 40px -5px rgba(0, 0, 0, .25);
|
|
margin-top: -3rem;
|
|
margin-bottom: 3rem;
|
|
overflow: hidden;
|
|
padding: 0;
|
|
position: relative;
|
|
display: block;
|
|
}
|
|
|
|
.dashboard-container {
|
|
width: 100%;
|
|
padding-right: 15px;
|
|
padding-left: 15px;
|
|
margin-right: auto;
|
|
margin-left: auto;
|
|
|
|
/* media query shiz */
|
|
max-width: 1140px;
|
|
}
|
|
|
|
.dashboard-banner {
|
|
display: flex;
|
|
-webkit-box-pack: justify;
|
|
justify-content: space-between;
|
|
position: relative;
|
|
z-index: 9;
|
|
}
|
|
|
|
.dashboard-banner-network-graph {
|
|
-webkit-box-flex: 1;
|
|
flex-grow: 1;
|
|
padding: 15px 0 0;
|
|
}
|
|
|
|
.dashboard-banner-network-plain-container {
|
|
-webkit-box-align: center;
|
|
align-items: center;
|
|
align-self: flex-end;
|
|
background-color: #8258cd;
|
|
border-top-left-radius: 10px;
|
|
display: flex;
|
|
height: 205px;
|
|
-webkit-box-pack: center;
|
|
justify-content: center;
|
|
margin: 0 0 0 30px;
|
|
max-width: 100%;
|
|
padding: 30px 0 30px 60px;
|
|
width: 750px;
|
|
position: relative;
|
|
}
|
|
|
|
.dashboard-banner-network-plain-container::after {
|
|
background-color: #8258cd;
|
|
bottom: 0;
|
|
content: "";
|
|
display: block;
|
|
height: 205px;
|
|
left: 0;
|
|
position: absolute;
|
|
width: 9999px;
|
|
z-index: -1;
|
|
box-shadow: 0 0 35px 0 rgba(0, 0, 0, .2);
|
|
border-top-left-radius: 10px;
|
|
}
|
|
|
|
.dashboard-banner-network-stats {
|
|
column-gap: 25px;
|
|
display: grid;
|
|
grid-template-columns: 1fr 1fr 1fr 1fr;
|
|
}
|
|
|
|
.dashboard-banner-network-stats-item {
|
|
display: flex;
|
|
-webkit-box-orient: vertical;
|
|
-webkit-box-direction: normal;
|
|
-ms-flex-direction: column;
|
|
flex-direction: column;
|
|
-webkit-box-pack: center;
|
|
-ms-flex-pack: center;
|
|
justify-content: center;
|
|
padding-left: calc(1rem + 4px);
|
|
padding-right: 1rem;
|
|
position: relative;
|
|
}
|
|
|
|
.dashboard-banner-network-stats-item::before {
|
|
background-color: #87e1a9;
|
|
border-radius: 2px;
|
|
content: "";
|
|
height: 100%;
|
|
left: 0;
|
|
position: absolute;
|
|
top: 0;
|
|
width: 4px;
|
|
}
|
|
|
|
.dashboard-banner-network-stats-label {
|
|
color: #dcc8ff;
|
|
display: block;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.dashboard-banner-network-stats-value {
|
|
color: #fff;
|
|
display: block;
|
|
font-size: 1.5rem;
|
|
font-weight: 200;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.card-body {
|
|
padding: 30px;
|
|
-webkit-box-flex: 1;
|
|
flex: 1 1 auto;
|
|
}
|
|
|
|
.card-chain-transactions {
|
|
height: auto;
|
|
}
|
|
|
|
.footer {
|
|
background: #3c226a;
|
|
color: #bda6e7;
|
|
font-size: 12px;
|
|
line-height: 1.67;
|
|
margin: 0;
|
|
padding: 40px 0;
|
|
position: relative;
|
|
}
|
|
|
|
.footer-logo-row {
|
|
margin-bottom: 30px;
|
|
}
|
|
|
|
.col-md-12 {
|
|
-webkit-box-flex: 0;
|
|
-ms-flex: 0 0 100%;
|
|
flex: 0 0 100%;
|
|
max-width: 100%;
|
|
}
|
|
|
|
|
|
/*Card Blocks Section */
|
|
|
|
.card {
|
|
background-color: #fff;
|
|
border-radius: 10px;
|
|
border: none;
|
|
box-shadow: 0 0 30px 0 rgba(202, 199, 226, .5);
|
|
margin-bottom: 50px;
|
|
position: relative;
|
|
}
|
|
|
|
|
|
/*Card Blocks Section */
|
|
|
|
.container1 {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-wrap: nowrap;
|
|
justify-content: center;
|
|
padding: 30px 15px 30px;
|
|
}
|
|
|
|
|
|
.box1class {
|
|
width: 240px;
|
|
height: 122px;
|
|
|
|
color: #828ba0;
|
|
|
|
font-size: 12px;
|
|
line-height: 1.4rem;
|
|
|
|
border-radius: 4px;
|
|
border: 1px solid #dee2e6;
|
|
border-left: 4px solid #5c34a2;
|
|
margin-right: 15px;
|
|
margin-left: 15px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-top: 10px;
|
|
|
|
/* Animation */
|
|
animation-name: slidein;
|
|
animation-duration: 300ms;
|
|
animation-timing-function: ease-in-out;
|
|
animation-delay: 0s;
|
|
animation-iteration-count: 1;
|
|
animation-direction: normal;
|
|
animation-fill-mode: forwards;
|
|
|
|
}
|
|
|
|
|
|
@keyframes slidein {
|
|
from {
|
|
transform: scale(0);
|
|
}
|
|
|
|
to {
|
|
transform: scale(1);
|
|
}
|
|
}
|
|
|
|
|
|
.box1class a {
|
|
font-weight: 700;
|
|
font-size: 12px;
|
|
color: #5c34a2;
|
|
text-decoration: none;
|
|
background-color: transparent;
|
|
}
|
|
|
|
|
|
/* Card Transaction section */
|
|
.box2class {
|
|
width: 195px;
|
|
height: 122px;
|
|
border-radius: 4px;
|
|
border: 1px solid #dee2e6;
|
|
border-left: 4px solid #5c34a2;
|
|
margin-right: 15px;
|
|
margin-left: 15px;
|
|
flex-shrink: 0;
|
|
|
|
color: #a5b2cf;
|
|
|
|
font-size: 12px;
|
|
line-height: 1.4rem;
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-top: 10px;
|
|
}
|
|
|
|
.box3class {
|
|
width: auto;
|
|
height: 122px;
|
|
border-radius: 4px;
|
|
border: 1px solid #dee2e6;
|
|
border-left: 4px solid #5c34a2;
|
|
margin-right: 15px;
|
|
margin-left: 15px;
|
|
margin-top: 9px;
|
|
margin-bottom: 9px;
|
|
flex-shrink: 0;
|
|
|
|
color: #a5b2cf;
|
|
|
|
font-size: 12px;
|
|
line-height: 1.4rem;
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
padding-top: 10px;
|
|
}
|
|
|
|
|
|
.color-block-token-transfer {
|
|
background-color: rgba(239, 154, 96, .1);
|
|
border-bottom: 1px solid #ef9a60;
|
|
border-right: 1px solid #ef9a60;
|
|
border-top: 1px solid #ef9a60;
|
|
color: #ef9a60;
|
|
|
|
height: 132px;
|
|
width: 172px;
|
|
|
|
margin-top: -1px;
|
|
margin-left: -4px;
|
|
border-radius: 4px 0px 0px 4px;
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
flex-shrink: 0;
|
|
justify-content: center;
|
|
}
|
|
|
|
.color-block-token-creation {
|
|
background-color: rgba(239, 211, 96, .1);
|
|
border-bottom: 1px solid #FB0112;
|
|
border-right: 1px solid #FB0112;
|
|
border-top: 1px solid #FB0112;
|
|
color: #FB0112;
|
|
|
|
height: 132px;
|
|
width: 172px;
|
|
|
|
margin-top: -1px;
|
|
margin-left: -4px;
|
|
border-radius: 4px 0px 0px 4px;
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
flex-shrink: 0;
|
|
justify-content: center;
|
|
}
|
|
|
|
.transactions {
|
|
width: auto;
|
|
border-radius: 4px;
|
|
border: 1px solid #dee2e6;
|
|
|
|
margin-right: 15px;
|
|
margin-left: 15px;
|
|
margin-top: 9px;
|
|
margin-bottom: 9px;
|
|
flex-shrink: 0;
|
|
|
|
color: #a5b2cf;
|
|
|
|
font-size: 12px;
|
|
line-height: 1.4rem;
|
|
}
|
|
|
|
.token-transfer {
|
|
height: 132px;
|
|
border-left: 4px solid #ef9a60;
|
|
}
|
|
|
|
.token-creation {
|
|
height: 132px;
|
|
border-left: 4px solid #FB0112;
|
|
}
|
|
|
|
.transaction {
|
|
height: 100px;
|
|
border-left: 4px solid #4786ff;
|
|
}
|
|
|
|
|
|
.color-block-transaction {
|
|
background-color: rgba(71, 134, 255, .1);
|
|
border-bottom: 1px solid #4786ff;
|
|
border-right: 1px solid #4786ff;
|
|
border-top: 1px solid #4786ff;
|
|
color: #4786ff;
|
|
|
|
height: 100px;
|
|
width: 172px;
|
|
|
|
margin-top: -1px;
|
|
margin-left: -4px;
|
|
border-radius: 4px 0px 0px 4px;
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
align-items: center;
|
|
flex-shrink: 0;
|
|
justify-content: center;
|
|
}
|
|
|
|
.transactions-content {
|
|
width: 100%;
|
|
max-width: 66.66666667%;
|
|
padding: 16px 0px 16px 15px;
|
|
|
|
display: flex;
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
flex: 0 0 66.66666667%;
|
|
}
|
|
|
|
.transactions a {
|
|
color: #5c34a2;
|
|
text-decoration: none;
|
|
overflow: hidden;
|
|
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
|
|
font-size: 12px;
|
|
line-height: 1.4rem;
|
|
}
|
|
|
|
.transactions-token-transfer-content {
|
|
width: 100%;
|
|
max-width: 66.66666667%;
|
|
padding: 16px 0px 16px 15px;
|
|
|
|
display: flex;
|
|
align-items: flex-start;
|
|
flex-direction: column;
|
|
flex: 0 0 66.66666667%;
|
|
}
|
|
|
|
|
|
.blockinfo {
|
|
text-align: right;
|
|
padding: 16px 15px 16px 15px;
|
|
width: 100%;
|
|
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center
|
|
}
|
|
|
|
.container2 {
|
|
display: flex;
|
|
flex-direction: column;
|
|
flex-wrap: nowrap;
|
|
justify-content: center;
|
|
padding: 30px 15px 30px;
|
|
}
|
|
|
|
.viewall {
|
|
align-items: center;
|
|
background-color: #fff;
|
|
border-radius: 2px;
|
|
border: 1px solid #5c34a2;
|
|
color: #5c34a2;
|
|
display: flex;
|
|
font-size: 12px;
|
|
height: 36px;
|
|
justify-content: center;
|
|
outline: none;
|
|
padding: 0 15px;
|
|
text-decoration: none;
|
|
justify-content: center;
|
|
outline: none;
|
|
padding: 0 15px;
|
|
transition: all .4s ease-in-out;
|
|
white-space: nowrap;
|
|
width: fit-content;
|
|
font-weight: 400;
|
|
|
|
margin-right: 14px;
|
|
line-height: 1.2rem;
|
|
margin-bottom: 2rem;
|
|
margin-block-start: 0.83em;
|
|
margin-block-end: 0.83em;
|
|
}
|
|
|
|
/*Footer Section*/
|
|
|
|
.footerBar {
|
|
flex: 1 1 20%;
|
|
}
|
|
|
|
.footerBar a {
|
|
color: inherit;
|
|
text-decoration: none;
|
|
margin-right: 15px;
|
|
}
|
|
|
|
.footerBar h3 {
|
|
margin: 0px 0px 15px 0px;
|
|
padding: 0px;
|
|
}
|
|
|
|
.footerBar ul {
|
|
margin: 0px 0px 25px 12px;
|
|
padding: 0px;
|
|
list-style: none;
|
|
}
|
|
|
|
.footerBar li::before {
|
|
content: "\2022";
|
|
/* Add content: \2022 is the CSS Code/unicode for a bullet */
|
|
color: #87e1a9;
|
|
/* Change the color */
|
|
font-weight: bold;
|
|
/* If you want it to be bold */
|
|
display: inline-block;
|
|
/* Needed to add space between the bullet and the text */
|
|
width: 1em;
|
|
/* Also needed for space (tweak if needed) */
|
|
margin-left: -1em;
|
|
/* Also needed for space (tweak if needed) */
|
|
margin-right: 10px;
|
|
}
|
|
|
|
.transfer-indicator {
|
|
background-color: rgba(71, 134, 255, .1);
|
|
border-bottom: 1px solid #4786ff;
|
|
border-right: 1px solid #4786ff;
|
|
border-top: 1px solid #4786ff;
|
|
color: #4786ff;
|
|
-webkit-box-align: center;
|
|
align-items: center;
|
|
bottom: -17px;
|
|
-webkit-box-pack: center;
|
|
justify-content: center;
|
|
margin-left: -1px;
|
|
margin-top: -34px;
|
|
padding: 0;
|
|
position: relative;
|
|
|
|
/* media query shiz */
|
|
-webkit-box-orient: vertical !important;
|
|
-webkit-box-direction: normal !important;
|
|
flex-direction: column !important;
|
|
display: flex !important;
|
|
-webkit-box-flex: 0;
|
|
flex: 0 0 16.66666667%;
|
|
max-width: 16.66666667%;
|
|
}
|
|
|
|
.mr-4 {
|
|
margin-right: 1.5rem !important;
|
|
}
|
|
|
|
.row {
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-ms-flex-wrap: wrap;
|
|
flex-wrap: wrap;
|
|
margin-right: -15px;
|
|
margin-left: -15px;
|
|
}
|
|
|
|
dl {
|
|
margin-bottom: 12px;
|
|
margin-top: 0;
|
|
margin-bottom: 1rem;
|
|
-webkit-box-sizing: border-box;
|
|
box-sizing: border-box;
|
|
display: block;
|
|
margin-block-start: 1em;
|
|
margin-block-end: 1em;
|
|
margin-inline-start: 0px;
|
|
margin-inline-end: 0px;
|
|
}
|
|
|
|
.card-tabs {
|
|
-webkit-box-align: center;
|
|
-ms-flex-align: center;
|
|
align-items: center;
|
|
border-bottom: 1px solid #e2e5ec;
|
|
display: -webkit-box;
|
|
display: -ms-flexbox;
|
|
display: flex;
|
|
-webkit-box-pack: start;
|
|
-ms-flex-pack: start;
|
|
justify-content: flex-start;
|
|
overflow: hidden;
|
|
padding: 0 25px;
|
|
}
|
|
|
|
.card-tabs:hover{
|
|
background-color: rgba(91,56,159,0.2);
|
|
color: rgba(91,56,159,1);
|
|
transition-duration: 1s;
|
|
}
|
|
|
|
.card-tab-active{
|
|
background-color: rgba(91,56,159,1);
|
|
color: #fff;
|
|
}
|
|
</style>
|
|
|
|
<body>
|
|
|
|
<nav class="navbar">
|
|
<div class="navbar_container">
|
|
<a href="vscout2.html">
|
|
<img class="navbar-logo" style="vertical-align:middle; border-style:none;"
|
|
src="FLO_horizontal_text1.svg" alt="POA Core">
|
|
</a>
|
|
|
|
<div class="navbarmenu_search">
|
|
<ul> </ul>
|
|
<div class="searchform_container">
|
|
<form action="" class="search_form" method="get">
|
|
<!-- <div class="input-group" title="Search by address, token symbol name, transaction hash, or block number">
|
|
<div class="awesomplete"><input aria-describedby="search-icon" aria-label="Search" class="form-control me auto" data-test="search_input" id="q" name="q" placeholder="Search by address, token symbol name, transaction hash, or block number" type="text" autocomplete="off" aria-autocomplete="list"><ul hidden=""></ul><span class="visually-hidden" role="status" aria-live="assertive" aria-relevant="additions"></span></div><script type="text/javascript">AwesompleteUtil.start('#q', {url: '/poa/core/token_autocomplete?q=', limit: 0}, {minChars: 2, data: function(rec, input) { return { label: (rec['contract_address_hash'] || '').replace('<p>', '<p >')+'<p>'+(rec['symbol'] || ''), value: rec['contract_address_hash']+'|'+(rec['symbol'] || '').replace('|', ' ') }; }, replace: function(data) { var text = data.value.substring(0, data.value.lastIndexOf('|')); this.input.value = text; }, filter: AwesompleteUtil.filterContains, item: AwesompleteUtil.itemMarkAll});</script> <div class="input-group-append">
|
|
<button class="input-group-text" id="search-icon">
|
|
<svg viewBox="0 0 16 17" xmlns="http://www.w3.org/2000/svg" width="16" height="17">
|
|
<path fill="#7DD79F" fill-rule="evenodd" d="M15.713 15.727a.982.982 0 0 1-1.388 0l-2.289-2.29C10.773 14.403 9.213 15 7.5 15A7.5 7.5 0 1 1 15 7.5c0 1.719-.602 3.284-1.575 4.55l2.288 2.288a.983.983 0 0 1 0 1.389zM7.5 2a5.5 5.5 0 1 0 0 11 5.5 5.5 0 1 0 0-11z"></path>
|
|
</svg>
|
|
</button>
|
|
</div>
|
|
</div>-->
|
|
<button class="search_button" type="submit">Search</button>
|
|
</form>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</nav>
|
|
|
|
|
|
<!-- Main is the whole section between header and footer-->
|
|
<div id='main'
|
|
style="-webkit-box-flex: 1; flex-grow: 1; background-color: #fbfafc; padding-top: 3rem!important; display: block; -webkit-box-direction: normal;">
|
|
<section
|
|
style="max-width: 1140px; width: 100%; padding-right: 15px; padding-left: 15px; margin-right: auto; margin-left: auto; display:block;">
|
|
<!-- Block details, validators and block rewards -->
|
|
<section style="display: block;">
|
|
<div id="row" style="display: flex; flex-wrap: wrap; margin-right: -15px; margin-left: -15px;">
|
|
<!-- Block details -->
|
|
<div
|
|
style="padding-right: 0!important; -webkit-box-flex: 0; flex: 0 0 66.66666667%; max-width: 66.66666667%; position: relative; width: 100%; min-height: 1px; padding-left: 15px; font-weight: 400; line-height: 1.5; color: #212529; text-align: left; font-size: 12px;">
|
|
<div
|
|
style="background-color: #fff; border-radius: 10px; border: none; box-shadow: 0 0 30px 0 rgba(202,199,226,.5); margin-bottom: 50px; margin-right: 50px; position: relative; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; min-width: 0; word-wrap: break-word; background-clip: border-box; font-size: 12px; font-weight: 400; line-height: 1.5; color: #212529; text-align: left;">
|
|
<div style="padding: 30px; -webkit-box-flex: 1; flex: 1 1 auto;">
|
|
<h1
|
|
style="font-size: 18px; font-weight: 400; line-height: 1.2rem; margin-bottom: 2rem; margin-top: 0; margin-block-start: 1em; margin-block-end: 1em; display: block; margin-inline-start: 0px; margin-inline-end: 0px;">
|
|
Block Details </h1>
|
|
<h3
|
|
style="font-size: 14px; font-weight: 600; line-height: 36px; margin-top: 0; margin-bottom: .5rem; display: block; margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; -webkit-box-direction: normal;">
|
|
Block Height: 1234</h3>
|
|
<div id="quick_block_details"
|
|
style="color:#828ba0 !important; -webkit-box-pack: start !important; justify-content: flex-start !important; -webkit-box-orient: horizontal !important;
|
|
-webkit-box-direction: normal !important; flex-direction: row !important; display: flex !important; ">
|
|
<span class="mr-4"> 3 Transactions </span>
|
|
<span class="mr-4"> 1,180 bytes </span>
|
|
<span class="mr-4" data-from-now="2019-07-03 06:55:40.000000Z">25 minutes ago
|
|
(July-03-2019 12:25:40 PM +5.5 UTC)</span>
|
|
</div>
|
|
<hr
|
|
style="display: block; unicode-bidi: isolate; margin-block-start: 0.5em; margin-block-end: 0.5em; margin-inline-start: auto; margin-inline-end: auto; box-sizing: content-box; height: 0; overflow: visible; border-bottom: none; border-left: none; border-right: none; border-top: 1px solid #f5f6fa; margin: 30px 0;">
|
|
<dl class="row">
|
|
<dt
|
|
style="position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; color: #828ba0 !important;">
|
|
Hash</dt>
|
|
<dd
|
|
style="display: block; margin-inline-start: 40px; margin:0; position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px;-webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;">
|
|
<a
|
|
style="background-color:transparent; color: inherit; text-decoration: none;">0xdeba74f413a9b07b63658bf6edb14e32c3f33a9ac9cd6e3864f88f3fc289f3d3</a>
|
|
</dd>
|
|
</dl>
|
|
<dl class="row">
|
|
<dt
|
|
style="position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; color: #828ba0 !important;">
|
|
Parent Hash</dt>
|
|
<dd
|
|
style="display: block; margin-inline-start: 40px; margin:0; position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px;-webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;">
|
|
<a
|
|
style="cursor: pointer; background-color: transparent; color: #5c34a2; text-decoration: none;">0xdeba74f413a9b07b63658bf6edb14e32c3f33a9ac9cd6e3864f88f3fc289f3d3</a>
|
|
</dd>
|
|
</dl>
|
|
<dl class="row">
|
|
<dt
|
|
style="position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; color: #828ba0 !important;">
|
|
Difficulty</dt>
|
|
<dd
|
|
style="display: block; margin-inline-start: 40px; margin:0; position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px;-webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;">
|
|
<a
|
|
style="background-color:transparent; color: inherit; text-decoration: none;">0xdeba74f413a9b07b63658bf6edb14e32c3f33a9ac9cd6e3864f88f3fc289f3d3</a>
|
|
</dd>
|
|
</dl>
|
|
<dl class="row">
|
|
<dt
|
|
style="position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; color: #828ba0 !important;">
|
|
Total Difficulty</dt>
|
|
<dd
|
|
style="display: block; margin-inline-start: 40px; margin:0; position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px;-webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;">
|
|
<a
|
|
style="background-color:transparent; color: inherit; text-decoration: none;">0xdeba74f413a9b07b63658bf6edb14e32c3f33a9ac9cd6e3864f88f3fc289f3d3</a>
|
|
</dd>
|
|
</dl>
|
|
<dl class="row">
|
|
<dt
|
|
style="position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; color: #828ba0 !important;">
|
|
Nonce</dt>
|
|
<dd
|
|
style="display: block; margin-inline-start: 40px; margin:0; position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px;-webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;">
|
|
<a
|
|
style="background-color:transparent; color: inherit; text-decoration: none;">0xdeba74f413a9b07b63658bf6edb14e32c3f33a9ac9cd6e3864f88f3fc289f3d3</a>
|
|
</dd>
|
|
</dl>
|
|
<dl class="row">
|
|
<dt
|
|
style="position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; color: #828ba0 !important;">
|
|
Gas Used</dt>
|
|
<dd
|
|
style="display: block; margin-inline-start: 40px; margin:0; position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px;-webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;">
|
|
<a
|
|
style="background-color:transparent; color: inherit; text-decoration: none;">0xdeba74f413a9b07b63658bf6edb14e32c3f33a9ac9cd6e3864f88f3fc289f3d3</a>
|
|
</dd>
|
|
</dl>
|
|
<dl class="row">
|
|
<dt
|
|
style="position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px; -webkit-box-flex: 0; -ms-flex: 0 0 25%; flex: 0 0 25%; max-width: 25%; color: #828ba0 !important;">
|
|
Gas Limit</dt>
|
|
<dd
|
|
style="display: block; margin-inline-start: 40px; margin:0; position: relative; width: 100%; min-height: 1px; padding-right: 15px; padding-left: 15px;-webkit-box-flex: 0; -ms-flex: 0 0 75%; flex: 0 0 75%; max-width: 75%;">
|
|
<a
|
|
style="background-color:transparent; color: inherit; text-decoration: none;">0xdeba74f413a9b07b63658bf6edb14e32c3f33a9ac9cd6e3864f88f3fc289f3d3</a>
|
|
</dd>
|
|
</dl>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Validator & Block Rewards Column -->
|
|
<div
|
|
style="position: relative; width: 100%; min-height: 1px; padding-right: 15px; flex: 0 0 33.33333333%; max-width: 33.33333333%; -webkit-box-flex: 0; display: flex !important; -webkit-box-orient: vertical !important; -webkit-box-direction: normal !important; -ms-flex-direction: column !important; flex-direction: column !important; padding-left: 0 !important;">
|
|
<!-- Validator -->
|
|
<div
|
|
style="flex-grow: 1 !important; background-clip: border-box; flex-direction: column; min-width: 0; word-wrap: break-word; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; position: relative; box-shadow: 0 0 30px 0 rgba(202, 199, 226, 0.5); margin-bottom: 50px; border-radius: 10px; border: none; background-color: #5c34a2; color: #fff;">
|
|
<div
|
|
style="color: #fff; flex: 1 1 auto; -webkit-box-flex: 1; padding: 30px; justify-content: space-between; flex-direction: column; -webkit-box-pack: justify; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; ">
|
|
<h2
|
|
style="color: #fff; -webkit-box-direction: normal; margin-block-start: 0.83em; margin-block-end: 0.83em; margin-inline-start: 0px; margin-inline-end: 0px; display: block; margin-top: 0; font-size: 18px; font-weight: normal; line-height: 1.2rem; margin-bottom: .5rem;">
|
|
Validator</h2>
|
|
<div style="text-align:right!important;">
|
|
<h3
|
|
style="margin-block-start: 1em; margin-block-end: 1em; margin-inline-start: 0px; margin-inline-end: 0px; display: block; text-overflow: ellipsis; white-space: nowrap; overflow:hidden; font-size: 12px; font-weight: bold; line-height: 1.2; margin: 0px 0px 12px; margin-bottom: 0;">
|
|
<a style="background-color: transparent; text-decoration: none; color: #fff;"
|
|
data-test="address_hash_link"
|
|
href="/poa/core/address/0x6e349be21acb0db3b2092fd4e3b738202842697e">
|
|
<span class=""
|
|
data-address-hash="0x6E349BE21Acb0db3B2092fd4E3B738202842697E">
|
|
<span data-toggle="tooltip" data-placement="top" title=""
|
|
data-original-title="0x6E349BE21Acb0db3B2092fd4E3B738202842697E">Marat
|
|
Pekker (0x6e349b...)</span>
|
|
</span>
|
|
</a>
|
|
</h3>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Block Rewards -->
|
|
<div
|
|
style="margin-left: 0!important; flex-grow: 1!important; -webkit-box-flex: 1!important; background-clip: border-box; flex-direction: column; min-width: 0; word-wrap: break-word; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; position: relative; box-shadow: 0 0 30px 0 rgba(202,199,226,.5); margin-bottom: 50px; background-color: #fff; border-radius: 10px; border: none; ">
|
|
<div style="flex: 1 1 auto; -webkit-box-flex: 1; padding: 30px;">
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</section>
|
|
|
|
<section style="display: block;">
|
|
<!-- Transaction Card -->
|
|
<div style="text-align:center;min-width:630px;max-width:1140px;margin:auto">
|
|
<div class="card">
|
|
<!-- Transaction tabs -->
|
|
<div
|
|
style="height:70px;margin:auto; border-bottom: 1px solid #e2e5ec; background-color: #fff; border-radius:10px 10px 0px 0px; display:flex; flex-direction:row;">
|
|
<div
|
|
style="display: flex; font-size: 14px; font-weight: 400; height: 70px; text-align: center;">
|
|
<a class="card-tabs card-tab-active">Transactions</a>
|
|
<a class="card-tabs">Tokens</a>
|
|
<a class="card-tabs">Internal Transactions</a>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="transactions-card" class="container2">
|
|
<div style="display:flex;justify-content: space-between;">
|
|
<h2
|
|
style="text-align:left; font-size:18px; font-weight:400; margin-left:14px; line-height:1.2rem; margin-bottom:2rem; display:block; margin-block-start:0.83em; margin-block-end:0.83em;">
|
|
Transactions</h2>
|
|
<a class="viewall" href="#">View All Blocks</a>
|
|
</div>
|
|
|
|
<div class='transactions token-creation'>
|
|
<div style="display:flex;">
|
|
<div class='color-block-token-creation'>
|
|
<span
|
|
style="color:#FB0112; font-size: 12px; font-weight: 700; line-height: 1.2; margin: 0 0 2px; text-align: center;">
|
|
Token Creation</span>
|
|
<span
|
|
style="color:inherit; font-size: 12px; font-weight: 400; line-height: 1.2; text-align:center; padding: 0 5px;">
|
|
RMT</span>
|
|
</div>
|
|
<div class="transactions-content">
|
|
<a>3c0c391d1ec5db8c6636996b6479c25a4a939fb7e9f14d899d41431c5d0a6aad</a>
|
|
<div style="display: inline-block">
|
|
<a>Incorporation Address</a>
|
|
<i class="fas fa-long-arrow-alt-right"></i>
|
|
<a>FGYbnpkK8cnNmXoDVYSt3KgWm3ECJNoRja</a>
|
|
</div>
|
|
<a>Token name: RMT</a>
|
|
<p style="margin:0; padding:0;color:#5c34a2">Supply: 21 million</p>
|
|
<p style="margin:0; padding:0;color:#333">FLO Data : create 21 million rmt#</p>
|
|
</div>
|
|
<div class="blockinfo">
|
|
<a
|
|
style="color: #5c34a2; text-decoration:none;background-color: transparent; font-size: 12px; line-height: 1.4rem;">Block
|
|
#3445463</a>
|
|
<div style="font-weight:400; color:#828ba0;">1 min ago</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class='transactions token-transfer'>
|
|
<div style="display:flex;">
|
|
<div class='color-block-token-transfer'>
|
|
<span
|
|
style="color:#ef9a60; font-size: 12px; font-weight: 700; line-height: 1.2; margin: 0 0 2px; text-align: center;">
|
|
Token Transfer</span>
|
|
<span
|
|
style="color:inherit; font-size: 12px; font-weight: 400; line-height: 1.2; text-align:center; padding: 0 5px;">
|
|
RMT</span>
|
|
</div>
|
|
<div class="transactions-content">
|
|
<a>3c0c391d1ec5db8c6636996b6479c25a4a939fb7e9f14d899d41431c5d0a6aad</a>
|
|
<div style="display: inline-block">
|
|
<a>FTzJDDP1q2WgwfGcqgYjdUM17yFagYrax7</a>
|
|
<i class="fas fa-long-arrow-alt-right"></i>
|
|
<a>FGYbnpkK8cnNmXoDVYSt3KgWm3ECJNoRja</a>
|
|
</div>
|
|
<p style="margin:0; padding:0;color:#333">0.002 RMT</p>
|
|
<p style="margin:0; padding:0;color:#333">FLO Data : transfer 0.002 rmt#</p>
|
|
</div>
|
|
<div class="blockinfo">
|
|
<a
|
|
style="color: #5c34a2; text-decoration:none;background-color: transparent; font-size: 12px; line-height: 1.4rem;">Block
|
|
#3445463</a>
|
|
<div style="font-weight:400; color:#828ba0;">1 min ago</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class='transactions transaction'>
|
|
<div style="display:flex;">
|
|
<div class='color-block-transaction'>
|
|
<span
|
|
style="color:#4786ff; font-size: 12px; font-weight: 700; line-height: 1.2; margin: 0 0 2px; text-align: center;">
|
|
Transactions</span>
|
|
<span
|
|
style="color:inherit; font-size: 12px; font-weight: 400; line-height: 1.2; text-align:center; padding: 0 5px;">
|
|
Success</span>
|
|
</div>
|
|
<div class="transactions-content">
|
|
<a>3c0c391d1ec5db8c6636996b6479c25a4a939fb7e9f14d899d41431c5d0a6aad</a>
|
|
<div style="display: inline-block">
|
|
<a>FTzJDDP1q2WgwfGcqgYjdUM17yFagYrax7</a>
|
|
<i class="fas fa-long-arrow-alt-right"></i>
|
|
<a>FGYbnpkK8cnNmXoDVYSt3KgWm3ECJNoRja</a>
|
|
</div>
|
|
<p style="margin:0; padding:0;color:#333">FLO Data : transfer 0.002 rmt#</p>
|
|
</div>
|
|
<div class="blockinfo">
|
|
<a
|
|
style="color: #5c34a2; text-decoration:none;background-color: transparent; font-size: 12px; line-height: 1.4rem;">Block
|
|
#3445463</a>
|
|
<div style="font-weight:400; color:#828ba0;">1 min ago</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</section>
|
|
</section>
|
|
</div>
|
|
|
|
|
|
<div style="width:100%;background:rgb(60,34,106)">
|
|
|
|
<div class="footer" style="width:80%;margin:auto">
|
|
|
|
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="59pt"
|
|
height="27pt" viewBox="0 0 59 27" version="1.1">
|
|
|
|
<g id="surface1">
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:white;"
|
|
d="M 46.871094 22.328125 L 39.714844 22.328125 L 39.714844 12.007812 L 41.496094 12.007812 L 41.496094 20.691406 L 46.871094 20.691406 Z M 46.871094 22.328125 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:white"
|
|
d="M 53.628906 22.503906 C 52.839844 22.503906 52.121094 22.363281 51.46875 22.085938 C 50.816406 21.804688 50.257812 21.421875 49.789062 20.941406 C 49.324219 20.460938 48.957031 19.898438 48.695312 19.253906 C 48.433594 18.609375 48.300781 17.925781 48.300781 17.195312 L 48.300781 17.167969 C 48.300781 16.4375 48.433594 15.753906 48.695312 15.109375 C 48.957031 14.464844 49.328125 13.902344 49.804688 13.414062 C 50.28125 12.929688 50.847656 12.542969 51.5 12.257812 C 52.148438 11.972656 52.871094 11.832031 53.660156 11.832031 C 54.445312 11.832031 55.167969 11.96875 55.820312 12.25 C 56.472656 12.53125 57.03125 12.910156 57.496094 13.394531 C 57.964844 13.875 58.332031 14.4375 58.59375 15.082031 C 58.855469 15.726562 58.988281 16.410156 58.988281 17.136719 L 58.988281 17.167969 C 58.988281 17.894531 58.855469 18.578125 58.59375 19.222656 C 58.332031 19.867188 57.960938 20.433594 57.484375 20.917969 C 57.007812 21.40625 56.441406 21.792969 55.789062 22.074219 C 55.136719 22.359375 54.417969 22.503906 53.628906 22.503906 M 53.660156 20.839844 C 54.164062 20.839844 54.625 20.742188 55.046875 20.550781 C 55.46875 20.359375 55.828125 20.097656 56.128906 19.769531 C 56.429688 19.441406 56.667969 19.054688 56.835938 18.613281 C 57.003906 18.167969 57.089844 17.699219 57.089844 17.195312 L 57.089844 17.167969 C 57.089844 16.667969 57.003906 16.191406 56.835938 15.746094 C 56.667969 15.296875 56.429688 14.910156 56.125 14.578125 C 55.816406 14.25 55.453125 13.988281 55.027344 13.789062 C 54.597656 13.59375 54.132812 13.496094 53.628906 13.496094 C 53.125 13.496094 52.664062 13.589844 52.242188 13.785156 C 51.820312 13.976562 51.460938 14.234375 51.15625 14.566406 C 50.859375 14.894531 50.621094 15.28125 50.453125 15.722656 C 50.285156 16.164062 50.199219 16.636719 50.199219 17.136719 L 50.199219 17.167969 C 50.199219 17.667969 50.285156 18.140625 50.453125 18.589844 C 50.621094 19.039062 50.859375 19.425781 51.164062 19.753906 C 51.472656 20.085938 51.835938 20.347656 52.261719 20.542969 C 52.691406 20.738281 53.15625 20.839844 53.660156 20.839844 Z M 53.660156 20.839844 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:white;"
|
|
d="M 30.140625 16.488281 L 30.140625 22.328125 L 31.921875 22.328125 L 31.921875 18.125 L 37.074219 18.125 L 37.074219 16.488281 Z M 30.140625 16.488281 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:white;"
|
|
d="M 30.140625 12.007812 L 30.140625 13.644531 L 37.730469 13.644531 L 37.730469 12.007812 Z M 30.140625 12.007812 " />
|
|
<path style=" stroke:none;fill-rule:nonzero;fill:white;"
|
|
d="M 13.109375 19.214844 C 11.601562 21.222656 11.601562 23.203125 13.109375 25.144531 C 14.617188 23.203125 14.617188 21.222656 13.109375 19.214844 M 13.109375 2.800781 C 9.648438 7.207031 9.648438 11.6875 13.109375 16.25 C 16.570312 11.6875 16.570312 7.207031 13.109375 2.800781 Z M 5.273438 22.441406 C 6.546875 19.515625 9.21875 18.070312 12.203125 18.105469 C 8.417969 14.140625 5.128906 12.539062 2.339844 13.3125 C 2.710938 15.5 4.21875 17.359375 6.859375 18.890625 C 3.820312 17.921875 1.53125 15.578125 0 11.859375 C 4.558594 11.074219 8.152344 12.210938 10.773438 15.261719 C 8.382812 10.101562 9.160156 5.007812 13.109375 -0.0117188 C 17.058594 5.007812 17.835938 10.097656 15.445312 15.261719 C 18.066406 12.210938 21.660156 11.074219 26.21875 11.859375 C 24.6875 15.578125 22.398438 17.921875 19.359375 18.890625 C 22 17.359375 23.507812 15.5 23.878906 13.3125 C 21.089844 12.542969 17.800781 14.140625 14.015625 18.105469 C 17 18.070312 19.671875 19.515625 20.945312 22.441406 C 18.691406 22.953125 16.835938 22.601562 15.382812 21.394531 C 16.972656 22.207031 18.339844 22.328125 19.492188 21.757812 C 18.988281 20.21875 16.757812 19.152344 13.90625 18.5625 C 15.53125 21.410156 15.265625 24.21875 13.109375 26.980469 C 10.953125 24.21875 10.6875 21.410156 12.3125 18.5625 C 9.460938 19.152344 7.230469 20.21875 6.726562 21.757812 C 7.878906 22.328125 9.246094 22.207031 10.835938 21.394531 C 9.382812 22.601562 7.527344 22.953125 5.273438 22.441406 Z M 5.273438 22.441406 " />
|
|
</g>
|
|
</svg>
|
|
|
|
<div style="display:flex;justify-content: flex-start;margin-top:30px">
|
|
<div class="footerBar" style="max-width: 200px;margin-right: 100px">
|
|
<div style="padding-right:30px">Floscout is a tool for inspecting and analyzing FLO based tokens and
|
|
smart contracts. Token and Smart Contract explorer for FLO Network.</div>
|
|
|
|
<div style="color:#bda6e7;font-size: 18px;margin-top:25px">
|
|
<a href="h#" rel="noreferrer" target="_blank" title="Github">
|
|
<i class="fab fa-github fa-lg"></i>
|
|
</a>
|
|
<a href="#" rel="noreferrer" target="_blank" title="Twitter">
|
|
<i class="fab fa-twitter fa-lg"></i>
|
|
</a>
|
|
<a href="#" rel="noreferrer" target="_blank" title="Telegram">
|
|
<i class="fab fa-telegram fa-lg"></i>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
<div class="footerBar">
|
|
<h3>
|
|
Blockscout
|
|
</h3>
|
|
<ul>
|
|
<li>First</li>
|
|
<li>Second</li>
|
|
<li>Third</li>
|
|
<li>Fourth</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="footerBar">
|
|
<h3>
|
|
Tokens
|
|
|
|
</h3>
|
|
<ul>
|
|
<li>First</li>
|
|
<li>Second</li>
|
|
<li>Third</li>
|
|
<li>Fourth</li>
|
|
</ul>
|
|
</div>
|
|
|
|
<div class="footerBar">
|
|
<h3>
|
|
Smart Contracts
|
|
|
|
</h3>
|
|
<ul>
|
|
<li>First</li>
|
|
<li>Second</li>
|
|
<li>Third</li>
|
|
<li>Fourth</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div style="height:70px"></div>
|
|
</div>
|
|
|
|
|
|
<script src="https://flosight.duckdns.org/socket.io/socket.io.js"></script>
|
|
<script>
|
|
eventToListenTo = 'block'
|
|
room = 'inv'
|
|
|
|
var socket = io("https://flosight.duckdns.org/");
|
|
socket.on('connect', function () {
|
|
// Join the room.
|
|
socket.emit('subscribe', room);
|
|
})
|
|
socket.on(eventToListenTo, function (data) {
|
|
console.log("New block received: " + data);
|
|
|
|
fetch(`https://flosight.duckdns.org/api/block/${data}`)
|
|
.then(function (response) {
|
|
return response.json();
|
|
})
|
|
.then(function (myJson) {
|
|
//console.log(JSON.stringify(myJson));
|
|
|
|
var blockdiv = document.createElement("div");
|
|
blockdiv.setAttribute("class", "box1class");
|
|
var blockno = document.createElement("div");
|
|
blockno.setAttribute("style", "flex:0 0 30px;text-align: left");
|
|
blockno.innerHTML = `<a href="#" style="padding:16px 16px 0px 16px; margin-bottom:12px;">${myJson["height"]}</a>`;
|
|
var blocktransaction = document.createElement("div");
|
|
blocktransaction.setAttribute("style", "background: #f6f7f9;flex:1 1 100px;text-align: left; padding:12.8px 16px 12.8px 16px");
|
|
blocktransaction.innerHTML = `<div>${myJson["tx"].length} Transaction</div>`;
|
|
blockdiv.appendChild(blockno);
|
|
blockdiv.appendChild(blocktransaction);
|
|
|
|
blocksCard_main = document.getElementById("blocks-card");
|
|
blocksCard_main.insertBefore(blockdiv, blocksCard_main.childNodes[0]);
|
|
blocksCard_main.removeChild(blocksCard_main.lastChild);
|
|
blocksCard_main.removeChild(blocksCard_main.lastChild);
|
|
});
|
|
})
|
|
</script>
|
|
|
|
<script>
|
|
eventToListenTo = 'tx'
|
|
room = 'inv'
|
|
|
|
var socket = io("https://flosight.duckdns.org/");
|
|
socket.on('connect', function () {
|
|
// Join the room.
|
|
socket.emit('subscribe', room);
|
|
})
|
|
socket.on(eventToListenTo, function (data) {
|
|
console.log("New transaction received: " + data.txid);
|
|
|
|
fetch(`https://flosight.duckdns.org/api/tx/${data.txid}`)
|
|
.then(function (response) {
|
|
return response.json();
|
|
})
|
|
.then(function (myJson) {
|
|
console.log(JSON.stringify(myJson));
|
|
console.log('going to encode now');
|
|
encoded_string = urlEncode(myJson['floData']);
|
|
parseFloData(encoded_string, myJson);
|
|
});
|
|
|
|
|
|
/*var blockdiv = document.createElement("div");
|
|
blockdiv.setAttribute("class", "box1class");
|
|
var blockno = document.createElement("div");
|
|
blockno.setAttribute("style", "flex:0 0 30px;text-align: left");
|
|
blockno.innerHTML = '<a href="#" style="padding:16px 16px 0px 16px; margin-bottom:12px;">345678</a>';
|
|
var blocktransaction = document.createElement("div");
|
|
blocktransaction.setAttribute("style", "background: #f6f7f9;flex:1 1 100px;text-align: left; padding:12.8px 16px 12.8px 16px");
|
|
blocktransaction.innerHTML = "<div>1 Transaction</div>";
|
|
blockdiv.appendChild(blockno);
|
|
blockdiv.appendChild(blocktransaction);
|
|
|
|
blocksCard_main = document.getElementById("blocks-card");
|
|
blocksCard_main.insertBefore(blockdiv, blocksCard_main.childNodes[0]);
|
|
blocksCard_main.removeChild(blocksCard_main.lastChild);*/
|
|
});
|
|
|
|
function urlEncode(text) {
|
|
urlEncodingDictionary = {
|
|
'%': '%25',
|
|
'!': '%21',
|
|
'#': '%23',
|
|
'$': '%24',
|
|
'&': '%26',
|
|
"'": '%27',
|
|
'(': '%28',
|
|
')': '%29',
|
|
'*': '%2A',
|
|
'+': '%2B',
|
|
'/': '%2C',
|
|
':': '%2F',
|
|
';': '%3A',
|
|
'=': '%3B',
|
|
'?': '%3D',
|
|
'@': '%3F',
|
|
'[': '%40',
|
|
']': '%5B',
|
|
'.': '%2E'
|
|
}
|
|
if (text != '') {
|
|
for (var key in urlEncodingDictionary) {
|
|
if (text.indexOf(key) > -1) {
|
|
text = text.replace(key, urlEncodingDictionary[key]);
|
|
}
|
|
}
|
|
}
|
|
return text;
|
|
}
|
|
|
|
|
|
function parseFloData(floData, txdata) {
|
|
fetch(`http://127.0.0.1:5010/api/v1.0/parseFloData?floData=${floData}&blockhash=${txdata["blockhash"]}`)
|
|
.then(function (response) {
|
|
return response.json();
|
|
})
|
|
.then(function (parsedFloData_json) {
|
|
console.log('Parsed Flo Data');
|
|
console.log(JSON.stringify(parsedFloData_json));
|
|
buildTransaction(parsedFloData_json, txdata);
|
|
});
|
|
}
|
|
|
|
|
|
// build transaction card
|
|
function buildTransaction(parsed_floData, txdata) {
|
|
transactionsCard_main = document.getElementById("transactions-card");
|
|
|
|
if (parsed_floData['type'] == 'noise') {
|
|
|
|
}
|
|
else if (parsed_floData['type'] == 'transfer' && parsed_floData['transferType'] == 'token') {
|
|
// create a token transfer block and append it to the transactions card
|
|
|
|
transactionType = document.createElement('div');
|
|
transactionType.setAttribute('class', 'transactions token-transfer');
|
|
|
|
// color block
|
|
color_block = document.createElement('div');
|
|
color_block.setAttribute('class', color - block - token - transfer);
|
|
|
|
span1 = document.createElement('div');
|
|
span1.setAttribute("style", "color:#ef9a60; font-size: 12px; font-weight: 700; line-height: 1.2; margin: 0 0 2px; text-align: center;");
|
|
span1.innerText = "Token Transfer";
|
|
|
|
span2 = document.createElement('div');
|
|
span2.setAttribute("style", "color:inherit; font-size: 12px; font-weight: 400; line-height: 1.2; text-align:center; padding: 0 5px;");
|
|
span2.innerText = parsed_flodata['tokenIdentification'].toUpperCase();
|
|
|
|
color_block.appendChild(span1);
|
|
color_block.appendChild(span2);
|
|
|
|
// transaction content
|
|
transactionContent = document.createElement('div');
|
|
transactionContent.setAttribute("class", "transactions-content");
|
|
|
|
transactionHash = document.createElement('a');
|
|
transactionHash.innerText = data.txid;
|
|
|
|
transaction_ipop = document.createElement('div');
|
|
transaction_ipop.setAttribute('style', 'display: inline-block');
|
|
ipAddress = document.createElement('a');
|
|
ipAddress.innerText = txdata['vin'][0].addr;
|
|
arrowSymbol = document.createElement('i');
|
|
arrowSymbol.setAttribute('class', 'fas fa-long-arrow-alt-right');
|
|
opAddress = document.createElement('a');
|
|
for (var i = 0; i < txdata['vout'].length; i++) {
|
|
if (txdata['vout'][i]['scriptPubKey']['type'] == 'pubkeyhash') {
|
|
if (txdata['vout'][i]['scriptPubKey']['addresses'][0] == ipAddress) {
|
|
continue;
|
|
}
|
|
opAddress.innerText = txdata['vout'][i]['scriptPubKey']['addresses'][0];
|
|
}
|
|
}
|
|
transaction_ipop.appendChild(ipAddress); arrowSymbol
|
|
transaction_ipop.appendChild(arrowSymbol);
|
|
transaction_ipop.appendChild(opAddress);
|
|
|
|
transferAmount = document.createElement('p');
|
|
transferAmount.setAttribute('style', 'margin:0; padding:0;color:#333');
|
|
transferAmount.innerText = `${tokenAmount} ${tokenIdentification}`;
|
|
|
|
floData_text = document.createElement('p');
|
|
floData_text.setAttribute('style', 'margin:0; padding:0;color:#333');
|
|
floData_text.innerText = `FLO Data : ${parsed_floData["floData"]}`;
|
|
|
|
transactionContent.appendChild(transactionHash);
|
|
transactionContent.appendChild(transaction_ipop);
|
|
transactionContent.appendChild(transferAmount);
|
|
transactionContent.appendChild(floData_text);
|
|
|
|
// block info
|
|
blockInfo = document.createElement('div');
|
|
blockInfo.setAttribute('class', 'blockinfo');
|
|
blockNumber = document.createElement('a');
|
|
blockNumber.setAttribute('style', 'color: #5c34a2; text-decoration:none;background-color: transparent; font-size: 12px; line-height: 1.4rem;');
|
|
blockNumber.innerText = `Block #${txdata['blockheight']}`;
|
|
timeElapsed = document.createElement('div');
|
|
timeElapsed.setAttribute('style', 'font-weight:400; color:#828ba0;');
|
|
timeElapsed.innerText = "1 min ago";
|
|
|
|
transactionType.appendChild(color_block);
|
|
transactionType.appendChild(transactionContent);
|
|
transactionType.appendChild(blockInfo);
|
|
|
|
transactionsCard_main.insertBefore(transactionType, transactionsCard_main.childNodes[1]);
|
|
}
|
|
}
|
|
</script>
|
|
|
|
</body>
|
|
|
|
</html> |