Skip to content

Instantly share code, notes, and snippets.

@arkonique

arkonique/index.html

Created September 1, 2018 19:33
Show Gist options
  • Save arkonique/f8a00b8626c2a69e4e58c42d04a1016b to your computer and use it in GitHub Desktop.
Save arkonique/f8a00b8626c2a69e4e58c42d04a1016b to your computer and use it in GitHub Desktop.
Download ZIP
Token Sale
Raw
index.html
<body>
<article class="token-sale-dets">
<div class="left">
Name: <strong> Swachhcoin </strong><br>
Symbol: <strong> SCX</strong><br>
Blockchain: <strong> Ethereum ERC20</strong><br>
Decimals: <strong> 18</strong><br>
<h3>Purchase Methods:</h3>
<div class="purchase-methods">
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
<div class="currencies-dets"><img src="http://icons.iconarchive.com/icons/cjdowner/cryptocurrency-flat/1024/KuCoin-Shares-KCS-icon.png"></div>
</div>
<div class="big-data">
<div class="h-cap capp">
<h3>Hardcap:</h3>
<br>
<p>18M USD</p>
</div>
<div class="s-cap capp">
<h3>Softcap:</h3>
<br>
<p>5M USD</p>
</div>
<div class="p-cap capp">
<h3>Total Supply:</h3>
<br>
<p>400M SCX</p>
</div>
<div class="c-cap capp">
<h3>Cost of 1 SCX (21% discount):</h3>
<br>
<p>0.05925</p>
</div>
</div>
<i class="fas fa-file-pdf"></i> <a href="token-pdf.pdf" download>Token Sale Details</a><br>
New Token Emission: <strong> Unavailable</strong><br>
Bonus/Discount: <strong> Available</strong><br>
Bonus/Discount: <strong> Available</strong><br>
Minimum personal Cap: <strong> 0.25 ETH (or equivalent)</strong><br>
Maximum personal Cap: <strong> No limit</strong><br>
Whitelist: <strong> No</strong><br>
</div>
<div class="right">
<h2>PARTICIPATE<br> IN <br><span style="color: white">OUR SALE</span></h2>
<form action="">
<button type="submit">Buy Tokens</button>
</div>
</article>
</body>
</html>
Raw
script.js
h_t_s=$('body .token-sale-dets .left').outerHeight()
$('body .token-sale-dets .right').css('height',`${h_t_s-100}px`)
Raw
scripts
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
Raw
style.stylus
body
margin 0
.token-sale-dets
font-family roboto, sans-serif
display flex
width 100%
background #444
color white
align-items center
strong
color #55ff63
.left
width 70%
line-height 30px
padding 30px
.big-data
display flex
align-items center
line-height 15px
background white url('https://swachhcoin.com/img/pattern.png')
margin 30px 0
color #444
.capp
width 25%
padding 16px
.h-cap
color #0de358
.s-cap
color #18a973
.p-cap
color #18a9a9
.c-cap
color #187fa9
h3,p
margin 0
p
font-size 2rem
padding-top 20px
h3
font-size 0.9rem
i
color #f76969
font-size 3rem
a[href="token-pdf.pdf"]
font-size 2.2rem
color #95989a
padding 0px
text-decoration none
border-bottom 1px dashed
margin 5px
line-height 70px
.purchase-methods
display flex
align-items center
justify-content center
.currencies-dets
width 40px
height 40px
margin 10px
border-radius 50%
transition 0.3s
box-shadow 0 3px 5px #00000078
&:hover
transform scale(1.1)
img
height 100%
.right
width 30%
display flex
flex-flow column
align-items center
justify-content center
margin 20px
background #55ff63 url('https://swachhcoin.com/img/pattern.png')
box-shadow -3px 3px 5px #00000078
h2
width 80%
font-size 3rem
padding 0 30px 100px 30px
margin 0
color #444
margin-top 20px
form
width 80%
input
width 100%
height 50px
background no-repeat
border none
outline none
border-bottom 2px solid #444
margin 10px
padding 20px 10px
box-sizing border-box
font-size 1.5rem
color #444
font-family roboto
transition 0.3s
&:focus
border-bottom 5px solid white
button
width 100%
margin 10px 10px 30px 10px
height 60px
font-size 2rem
background #444
border none
font-family roboto
padding 10px
box-sizing border-box
box-shadow 0 3px 5px #444444
color white
transition 0.3s ease-out
cursor pointer
&:hover
transform scale(1.05)
Raw
styles
<link href="https://fonts.googleapis.com/css?family=Roboto:300" rel="stylesheet" />
<link href="https://use.fontawesome.com/releases/v5.3.1/css/all.css" rel="stylesheet" />
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment