Improve description
This commit is contained in:
Boris Kubiak
parent
df79bf60be
commit
e8b632d552
3 changed files with 26 additions and 12 deletions
|
|
@ -1 +1 @@
|
|||
body{padding:0;font-family:Lato,sans-serif;background:#000;margin:8em 0}h1,h2,h3,h4,h5,h6,label,p{margin:0}[v-cloak]{display:none}.header{margin-bottom:8em;color:#fff;font-family:Montserrat,sans-serif}.header h1{font-size:3em;font-weight:700;border:4px solid #fff;width:33%;margin:0 auto;padding:10px}.header p{font-size:1.5em;letter-spacing:2px;font-weight:400;margin-top:1em}.description{margin:15px 0 20px;color:#888}.panel{padding:1.5em 3em;background-color:#191919;margin-top:2em;color:#fff;font-weight:400}.panel.error{background-color:#ec4a41}.panel.error a,.panel.error a:hover,.panel.error a:visited{color:#fff;text-decoration:underline}.form input[type=text]{width:100%;color:#fff;background:#2d2c2c;outline:0;font-size:1.3em;padding:.5em;border:none;margin-bottom:10px;-webkit-appearance:none}.form input[type=button]{border:none;outline:0;color:#fff;padding:.6em;font-size:1.3em;font-weight:500;margin:1.3em 0 0 0;cursor:pointer;-webkit-appearance:none;background:#198a88;width:100%}.form input[type=button]:hover{background:#d78716}.form input[type=button]:disabled{background:#2d2c2c;cursor:auto}.form .error-text{display:none;font-size:.85em;color:#ec4a41}.form .error input[type=text]{border:1px solid #ec4a41}.form .error .error-text{display:block}.form .check{margin:.5em 0}.checkbox{margin-bottom:4px;padding-left:30px;line-height:27px;cursor:pointer;position:relative;font-size:1.2em;color:#fff;font-weight:400}.checkbox:last-child{margin-bottom:0}.checkbox i{position:absolute;bottom:4px;left:17.5em;display:block;width:19px;height:19px;outline:0;border:1px solid #97a2a8}.checkbox i.left{position:absolute;bottom:4px;left:0;display:block;width:19px;height:19px;outline:0;border:1px solid #97a2a8}.checkbox input{position:absolute;left:-9999px}.checkbox input+i:after{content:'';background:url(../images/tick-mark.png) no-repeat 1px 2px;top:4px;left:2px;width:15px;height:15px;font:normal 12px/16px FontAwesome;text-align:center;position:absolute;opacity:0}.checkbox input:checked+i:after{opacity:1}.threads{font-size:1.2em}.threads h4{display:inline}.threads input[type=button].square-btn{display:inline-block;width:24px;height:24px;margin:0 5px 0 0;padding:0;line-height:1em}.result>div:not(:last-child),.statistics>div:not(:last-child){margin-bottom:15px}.statistics{padding-bottom:3.2em}.statistics>div:not(.percentage){clear:both}.probability{width:85%;margin:5px 0;height:18px;background:#2d2c2c;float:left}.probability-bar{height:100%;display:block;background-color:#d78716}.percentage{float:right;width:15%;text-align:center;position:relative;top:-10px;left:15px}.percentage div{font-size:.75em}.percentage h5{color:#fff;font-weight:500}.output{font-family:monospace;font-size:1.2em;color:#888;margin-left:15px;word-break:break-all}@media screen and (max-width:1280px){.header h1{font-size:2.8em;width:35%}}@media screen and (max-width:1024px){.header h1{font-size:2.5em;border:3px solid #fff;width:34%}.header p{font-size:1.4em;margin-top:.8em}body{margin:7em 0 5em 0}.header{margin-bottom:4em}}@media screen and (max-width:768px){.header h1{width:43%}}@media screen and (max-width:640px){.header h1{width:46%;font-size:2.2em;padding:8px}.header p{font-size:1.3em;margin-top:.7em}body{margin:5em 0 4em 0}.header{margin-bottom:4em}}@media screen and (max-width:480px){.header h1{width:65%;font-size:2em;padding:7px;border:2px solid #fff}.header p{font-size:1.2em}}@media screen and (max-width:320px){.header h1{width:73%;font-size:1.6em;padding:6px}.header p{font-size:1em}}
|
||||
body{padding:0;font-family:Lato,sans-serif;background:#000;margin:8em 0}h1,h2,h3,h4,h5,h6,label,p{margin:0}[v-cloak]{display:none}.header{margin-bottom:8em;color:#fff;font-family:Montserrat,sans-serif}.header h1{font-size:3em;font-weight:700;border:4px solid #fff;width:33%;margin:0 auto;padding:10px}.header p{font-size:1.5em;letter-spacing:2px;font-weight:400;margin-top:1em}.panel{padding:1.5em 3em;background-color:#191919;margin-top:2em;color:#fff;font-weight:400}.panel.error{background-color:#ec4a41}.panel.error a,.panel.error a:hover,.panel.error a:visited{color:#fff;text-decoration:underline}.description p{margin:15px 0 20px;color:#888}.form input[type=text]{width:100%;color:#fff;background:#2d2c2c;outline:0;font-size:1.3em;padding:.5em;border:none;margin-bottom:10px;-webkit-appearance:none}.form input[type=button]{border:none;outline:0;color:#fff;padding:.6em;font-size:1.3em;font-weight:500;margin:1.3em 0 0 0;cursor:pointer;-webkit-appearance:none;background:#198a88;width:100%}.form input[type=button]:hover{background:#d78716}.form input[type=button]:disabled{background:#2d2c2c;cursor:auto}.form .error-text{display:none;font-size:.85em;color:#ec4a41}.form .error input[type=text]{border:1px solid #ec4a41}.form .error .error-text{display:block}.form .check{margin:.5em 0}.checkbox{margin-bottom:4px;padding-left:30px;line-height:27px;cursor:pointer;position:relative;font-size:1.2em;color:#fff;font-weight:400}.checkbox:last-child{margin-bottom:0}.checkbox i{position:absolute;bottom:4px;left:17.5em;display:block;width:19px;height:19px;outline:0;border:1px solid #97a2a8}.checkbox i.left{position:absolute;bottom:4px;left:0;display:block;width:19px;height:19px;outline:0;border:1px solid #97a2a8}.checkbox input{position:absolute;left:-9999px}.checkbox input+i:after{content:'';background:url(../images/tick-mark.png) no-repeat 1px 2px;top:4px;left:2px;width:15px;height:15px;font:normal 12px/16px FontAwesome;text-align:center;position:absolute;opacity:0}.checkbox input:checked+i:after{opacity:1}.threads{font-size:1.2em}.threads h4{display:inline}.threads input[type=button].square-btn{display:inline-block;width:24px;height:24px;margin:0 5px 0 0;padding:0;line-height:1em}.result>div:not(:last-child),.statistics>div:not(:last-child){margin-bottom:15px}.statistics{padding-bottom:3.2em}.statistics>div:not(.percentage){clear:both}.probability{width:85%;margin:5px 0;height:18px;background:#2d2c2c;float:left}.probability-bar{height:100%;width:0;display:block;background-color:#d78716}.percentage{float:right;width:15%;text-align:center;position:relative;top:-10px;left:15px}.percentage div{font-size:.75em}.percentage h5{color:#fff;font-weight:500}.output{font-family:monospace;font-size:1.2em;color:#888;margin-left:15px;word-break:break-all}@media screen and (max-width:1280px){.header h1{font-size:2.8em;width:35%}}@media screen and (max-width:1024px){.header h1{font-size:2.5em;border:3px solid #fff;width:34%}.header p{font-size:1.4em;margin-top:.8em}body{margin:7em 0 5em 0}.header{margin-bottom:4em}}@media screen and (max-width:768px){.header h1{width:43%}}@media screen and (max-width:640px){.header h1{width:46%;font-size:2.2em;padding:8px}.header p{font-size:1.3em;margin-top:.7em}body{margin:5em 0 4em 0}.header{margin-bottom:4em}}@media screen and (max-width:480px){.header h1{width:65%;font-size:2em;padding:7px;border:2px solid #fff}.header p{font-size:1.2em}}@media screen and (max-width:320px){.header h1{width:73%;font-size:1.6em;padding:6px}.header p{font-size:1em}}
|
||||
|
|
@ -40,10 +40,6 @@ h1, h2, h3, h4, h5, h6, p, label
|
|||
font-weight: 400
|
||||
margin-top: 1em
|
||||
|
||||
.description
|
||||
margin: 15px 0 20px
|
||||
color: $grey-text
|
||||
|
||||
.panel
|
||||
padding: 1.5em 3em
|
||||
background-color: $panel-background
|
||||
|
|
@ -55,6 +51,11 @@ h1, h2, h3, h4, h5, h6, p, label
|
|||
a, a:visited, a:hover
|
||||
color: $white-text
|
||||
text-decoration: underline
|
||||
|
||||
.description p
|
||||
margin: 15px 0 20px
|
||||
color: $grey-text
|
||||
|
||||
.form
|
||||
input
|
||||
&[type="text"]
|
||||
|
|
@ -172,6 +173,7 @@ h1, h2, h3, h4, h5, h6, p, label
|
|||
|
||||
.probability-bar
|
||||
height: 100%
|
||||
width: 0
|
||||
display: block
|
||||
background-color: #d78716
|
||||
|
||||
|
|
|
|||
26
index.html
26
index.html
|
|
@ -25,20 +25,32 @@
|
|||
</div>
|
||||
<div class="row">
|
||||
<div class="col-md-12">
|
||||
<div class="panel">
|
||||
<div class="panel description">
|
||||
<p>
|
||||
Vanity-ETH is a browser-based tool to generate vanity Ethereum addresses.
|
||||
</p>
|
||||
<h4>Usage</h4>
|
||||
<p class="description">
|
||||
Vanity-ETH is a browser-based tool to generate vanity Ethereum addresses.<br>
|
||||
<p>
|
||||
Enter the prefix of your choice below, then click 'generate' to start.<br>
|
||||
Ethereum addresses are hexadecimal, which means your prefix can only contain numbers and letters
|
||||
from A to F.
|
||||
from A to F.<br>
|
||||
You can increase the number of threads allocated to address generation to be faster, or decrease it
|
||||
if you computer struggles.<br>
|
||||
</p>
|
||||
<h4>How it works</h4>
|
||||
<p class="description">
|
||||
You browser will generate a ton of random addresses until one of them starts with your prefix.<br>
|
||||
<p>
|
||||
You browser is going to generate a ton of random addresses until one of them starts with your prefix.<br>
|
||||
Everything is computed by your browser, so you should notice a better speed on a powerful
|
||||
computer.<br>
|
||||
Nothing ever leaves your machine, or even your browser tab.
|
||||
</p>
|
||||
<h4>Security</h4>
|
||||
<p>
|
||||
As explained above, everything is computed in your browser. Nothing ever leaves your machine, or
|
||||
even your browser tab.<br>
|
||||
Once the page is loaded, you can turn off your internet connection and everything will work
|
||||
perfectly fine.<br>
|
||||
Vanity-ETH uses a cryptographically secure pseudorandom number generator (CSPRNG) to generate
|
||||
Ethereum addresses.
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue