add the boxes for a little style & make it work in firefox

This commit is contained in:
Josh Fraser 2018-08-23 00:42:34 -07:00
parent 35f46110c0
commit d7b357be69
2 changed files with 27 additions and 6 deletions

View File

@ -60,7 +60,7 @@ p {
background-position: right; background-position: right;
} }
#block { #header-block {
position: absolute; position: absolute;
top: 502px; top: 502px;
right:26px; right:26px;
@ -122,7 +122,6 @@ p {
#footer { #footer {
background-image: linear-gradient(to bottom, #454545, #000000); background-image: linear-gradient(to bottom, #454545, #000000);
padding-top: 40px; padding-top: 40px;
padding-bottom:60px;
} }
#footer h1 { #footer h1 {
font-size: 20px; font-size: 20px;
@ -140,10 +139,19 @@ p {
padding:10px; padding:10px;
} }
#footer-block {
position: relative;
top:-180px;
right:26px;
}
/* media queries */ /* media queries */
/* Large devices (desktops, less than 1200px) */ /* Large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) { @media (max-width: 1199.98px) {
#footer {
padding-bottom:0px;
}
} }
/* Medium devices (tablets, less than 992px) */ /* Medium devices (tablets, less than 992px) */
@ -151,6 +159,9 @@ p {
h1 { h1 {
font-size: 54px; font-size: 54px;
} }
#footer {
padding-bottom:40px;
}
} }
/* Small devices (landscape phones, less than 768px) */ /* Small devices (landscape phones, less than 768px) */
@ -158,6 +169,9 @@ p {
h1 { h1 {
font-size: 44px; font-size: 44px;
} }
#footer {
padding-bottom:40px;
}
} }
/* Extra small devices (portrait phones, less than 576px) */ /* Extra small devices (portrait phones, less than 576px) */
@ -165,4 +179,7 @@ p {
h1 { h1 {
font-size: 34px; font-size: 34px;
} }
#footer {
padding-bottom:40px;
}
} }

View File

@ -24,11 +24,10 @@
</div> </div>
</div> </div>
<div id="block">
<img src="img/block.png" srcset="img/block@2x.png 2x, img/block@3x.png 3x">
</div>
</section> </section>
<img src="img/block.png" srcset="img/block@2x.png 2x, img/block@3x.png 3x" id="header-block">
<section id='about' class='grey'> <section id='about' class='grey'>
<div class="container"> <div class="container">
<div class="row"> <div class="row">
@ -332,9 +331,14 @@
<div class="col-sm-4"> <div class="col-sm-4">
<img src="img/icon-telegram.png" srcset="img/icon-telegram@2x.png 2x, img/icon-telegram@3x.png 3x"><a href="https://t.me/joinchat/Gz70lg_D-b_mUgaCJxHzFg">Telegram</a> <img src="img/icon-telegram.png" srcset="img/icon-telegram@2x.png 2x, img/icon-telegram@3x.png 3x"><a href="https://t.me/joinchat/Gz70lg_D-b_mUgaCJxHzFg">Telegram</a>
</div> </div>
<div class="col-sm-8"> <div class="col-sm-5">
<img src="img/icon-github.png" srcset="img/icon-github@2x.png 2x, img/icon-github@3x.png 3x"><a href="https://github.com/erc725alliance">Join the Alliance</a> <img src="img/icon-github.png" srcset="img/icon-github@2x.png 2x, img/icon-github@3x.png 3x"><a href="https://github.com/erc725alliance">Join the Alliance</a>
</div> </div>
<div class="col-sm-2 d-none d-xl-block">
<div class="footer-block-wrapper">
<img src="img/block.png" srcset="img/block@2x.png 2x, img/block@3x.png 3x" id="footer-block">
</div>
</div>
</div> </div>
</div> </div>
</div> </div>