Merge pull request #5 from fjl/index-page-2

[gh-pages] improve index page design
This commit is contained in:
Péter Szilágyi 2016-11-15 13:02:31 +02:00 committed by GitHub
commit b37f28ef23
3 changed files with 31 additions and 40 deletions

View File

@ -44,22 +44,20 @@
</div>
</nav>
<div class="jumbotron" style="padding-top: 16px; padding-bottom: 0;">
<div class="jumbotron">
<div class="container mascot">
<div class="row">
<div class="col-lg-2">
</div>
<div class="col-lg-8" style="text-align: center">
<h1 style="padding-top: 32px;">Go Ethereum</h1>
<h2>Official Go implementation of the Ethereum protocol</h2>
<br/>
<a href="https://github.com/ethereum/go-ethereum" target="_blank" class="btn btn-success" style="margin: 4px;"><i class="fa fa-github" aria-hidden="true"></i> View on GitHub</a>
<a href="https://gitter.im/ethereum/go-ethereum" target="_blank" class="btn btn-success" style="margin: 4px;"><i class="fa fa-user-circle" aria-hidden="true"></i> Chat on Gitter</a>
</div>
</div>
<h1>Go Ethereum</h1>
<h2>Official Go implementation of the Ethereum protocol</h2>
<br/>
<a href="https://github.com/ethereum/go-ethereum" target="_blank" class="btn btn-success" style="margin: 4px;"><i class="fa fa-github" aria-hidden="true"></i> View on GitHub</a>
<a href="https://gitter.im/ethereum/go-ethereum" target="_blank" class="btn btn-success" style="margin: 4px;"><i class="fa fa-user-circle" aria-hidden="true"></i> Chat on Gitter</a>
</div>
</div>
<div class="container mascot-mobile">
<img src="./static/images/mascot.png" height="200px" />
</div>
<div class="container marketing">
<div class="row featurette">
<div class="col-md-7">
@ -67,7 +65,7 @@
<p class="lead">Ethereum is a decentralized platform that runs smart contracts, applications that run exactly as programmed without possibility of downtime, censorship, fraud or third party interference.</p>
<p class="lead">See <a href="https://ethereum.org" target="_blank">our website</a> or <a href="http://ethdocs.org/en/latest/introduction/what-is-ethereum.html" target="_blank">read the docs</a> for more infos!</p>
</div>
<div class="col-md-5">
<div class="col-md-5 hide-on-small-screen">
<img class="featurette-image center-block" src="./static/images/ethereum.png" height="300px">
</div>
</div>
@ -78,8 +76,8 @@
<p class="lead">Go Ethereum is one of the three original implementations (along with C++ and Python) of the Ethereum protocol. It is written in Go, fully open source and licensed under the GNU LGPL v3.</p>
<p class="lead">See <a href="https://github.com/ethereum/go-ethereum" target="_blank">our repository</a> and <a href="./downloads">downloads section</a> for the code!</p>
</div>
<div class="col-md-5 col-md-pull-7">
<img class="featurette-image center-block">
<div class="col-md-5 col-md-pull-7 hide-on-small-screen">
<img class="featurette-image center-block" src="./static/images/mascot.png" height="300px">
</div>
</div>
<hr/>
@ -89,9 +87,6 @@
<p class="lead">Go Ethereum is available either as a standalone client called Geth that you can install on pretty much any operating system, or as a library that you can embed in your Go, Android or iOS projects.</p>
<p class="lead">See our <a href="./install">installation guide</a> or our <a href="./downloads">developer guide</a> for details!</p>
</div>
<div class="col-md-5">
<img class="featurette-image center-block">
</div>
</div>
<hr/>
<footer>

Binary file not shown.

Before

Width:  |  Height:  |  Size: 478 KiB

After

Width:  |  Height:  |  Size: 201 KiB

View File

@ -1,47 +1,43 @@
.jumbotron .mascot {
background-image: url('../../images/mascot.png');
background-size: auto 300px;
background-repeat: no-repeat;
background-position: 2.5% -30px;
height: 256px;
}
.jumbotron h1, .jumbotron h2 {
text-shadow: -1px 0 #ecf0f1, 0 1px #ecf0f1, 1px 0 #ecf0f1, 0 -1px #ecf0f1;
.jumbotron {
text-align: center;
padding: 20pt 0;
}
.jumbotron h1 {
font-size: 56px;
font-weight: bold;
margin-top: 16px;
margin-bottom: 12px;
margin-top: 0;
}
.jumbotron h2 {
margin-top: 12px;
font-size: 28px;
}
.mascot-mobile {
text-align: center;
}
.hide-on-small-screen {
display: none;
}
.featurette-divider {
margin: 80px 0;
}
.featurette-heading {
font-weight: 300;
line-height: 1;
letter-spacing: -1px;
}
@media (min-width: 768px) {
.mascot-mobile {
display: none;
}
.hide-on-small-screen {
display: block;
}
.featurette-heading {
font-size: 50px;
}
}
@media (min-width: 992px) {
.featurette-heading {
margin-top: 80px;
}
.featurette-image {
margin-top: 30px;
}