mirror of
https://github.com/bigchaindb/site.git
synced 2025-02-14 21:10:28 +01:00
unify server & drivers backgrounds
This commit is contained in:
parent
0b47c644d8
commit
b3be57a555
GPG Key ID:
606EEEF3C479A91F
@ -38,7 +38,7 @@
|
||||
height: 3rem;
|
||||
border-radius: 50%;
|
||||
font-size: $font-size-lg;
|
||||
vertical-align: 0.4rem;
|
||||
vertical-align: .4rem;
|
||||
background: $headings-color;
|
||||
color: $gray;
|
||||
font-weight: 400;
|
||||
@ -69,6 +69,10 @@
|
||||
//
|
||||
.section--server {
|
||||
padding-bottom: 0;
|
||||
|
||||
.btn {
|
||||
margin-top: $spacer / 2;
|
||||
}
|
||||
}
|
||||
|
||||
.starbase {
|
||||
@ -101,7 +105,7 @@
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
margin-bottom: -1.45%;
|
||||
opacity: 0.7;
|
||||
opacity: .7;
|
||||
}
|
||||
|
||||
// surface layer
|
||||
@ -112,24 +116,16 @@
|
||||
left: -5%;
|
||||
right: -5%;
|
||||
bottom: 0;
|
||||
background: #5d6f82;
|
||||
background: lighten($gray, 8%);
|
||||
height: 24%;
|
||||
width: calc(100vw + 10%);
|
||||
}
|
||||
}
|
||||
|
||||
.starbase--drivers {
|
||||
margin-bottom: $spacer * 2;
|
||||
|
||||
// horizon layer
|
||||
&:before {
|
||||
background: darken($gray, 3%);
|
||||
}
|
||||
|
||||
.starbase__image {
|
||||
// surface layer
|
||||
&:before {
|
||||
background: lighten($gray, 2%);
|
||||
height: 37%;
|
||||
}
|
||||
|
||||
@ -140,15 +136,16 @@
|
||||
}
|
||||
}
|
||||
|
||||
.serverchoice {
|
||||
background: #536476;
|
||||
.choice {
|
||||
background: lighten($gray, 3%);
|
||||
padding-top: $spacer * 4;
|
||||
padding-bottom: $spacer * 4;
|
||||
}
|
||||
|
||||
.serverchoice__title {
|
||||
.choice__title {
|
||||
font-size: $font-size-h3;
|
||||
margin-top: 0;
|
||||
margin-bottom: $spacer * $line-height;
|
||||
|
||||
// the bottom line
|
||||
&:after {
|
||||
@ -156,7 +153,7 @@
|
||||
height: 2px;
|
||||
width: 3rem;
|
||||
display: block;
|
||||
margin: ($spacer * 2) 0 0;
|
||||
margin: ($spacer * $line-height) 0 0;
|
||||
background: $gray-light;
|
||||
}
|
||||
}
|
||||
@ -169,6 +166,14 @@
|
||||
}
|
||||
}
|
||||
|
||||
.section--drivers {
|
||||
padding-bottom: 0;
|
||||
|
||||
.choice__title {
|
||||
margin-bottom: $spacer * 2;
|
||||
}
|
||||
}
|
||||
|
||||
.driver {
|
||||
padding: $spacer;
|
||||
background: rgba($brand-main-blue-light, .15);
|
||||
@ -231,7 +236,7 @@
|
||||
}
|
||||
|
||||
.driver__version {
|
||||
opacity: 0.75;
|
||||
opacity: .75;
|
||||
}
|
||||
|
||||
.driver--community {
|
||||
|
||||
114
_src/start.html
114
_src/start.html
@ -97,7 +97,7 @@ redirect_from:
|
||||
</header>
|
||||
</div>
|
||||
|
||||
<aside class="starbase">
|
||||
<aside class="starbase starbase--server">
|
||||
<div class="row row--wide">
|
||||
<figure class="starbase__image">
|
||||
<img class="img--responsive" src="/assets/img/starbase.svg" alt="Starbase" width="1071" height="328">
|
||||
@ -105,18 +105,18 @@ redirect_from:
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<section class="serverchoice">
|
||||
<section class="choice">
|
||||
<div class="row row--wide">
|
||||
<div class="grid grid--full grid-small--half grid--gutters">
|
||||
<div class="grid__col">
|
||||
<span class="pretitle">Managed</span>
|
||||
<h2 class="serverchoice__title">IPDB: the public BigchainDB network</h2>
|
||||
<h2 class="choice__title">IPDB: the public BigchainDB network</h2>
|
||||
<p>No need for any installation. Sign up and connect instantly, we handle running a BigchainDB production node for you.</p>
|
||||
<a class="btn btn-primary" href="">Get IPDB</a>
|
||||
</div>
|
||||
<div class="grid__col">
|
||||
<span class="pretitle">Self-hosted</span>
|
||||
<h2 class="serverchoice__title">BigchainDB Server</h2>
|
||||
<h2 class="choice__title">BigchainDB Server</h2>
|
||||
<p>If you want to run your own BigchainDB instance you can either install on Linux or with Docker on any system.</p>
|
||||
<a class="btn btn-secondary" href="">Install BigchainDB Server</a>
|
||||
</div>
|
||||
@ -126,7 +126,7 @@ redirect_from:
|
||||
|
||||
</section>
|
||||
|
||||
<section class="section section--drivers" id="drivers">
|
||||
<section class="section section--drivers background--darker" id="drivers">
|
||||
<div class="row row--wide">
|
||||
<header class="section-header text-left">
|
||||
<h1 class="section-title section-title--numbered"><span>2</span> Drivers & Tools</h1>
|
||||
@ -142,81 +142,81 @@ redirect_from:
|
||||
</div>
|
||||
</aside>
|
||||
|
||||
<div class="row row--wide">
|
||||
<section class="choice">
|
||||
<div class="row row--wide">
|
||||
|
||||
<div class="grid grid--full grid-small--half grid--gutters">
|
||||
<div class="grid__col">
|
||||
<div class="grid grid--full grid-small--half grid--gutters">
|
||||
<div class="grid__col">
|
||||
|
||||
<h3>Official drivers</h3>
|
||||
<h3 class="choice__title">Official drivers</h3>
|
||||
|
||||
<div class="grid grid--full grid-small--half grid--gutters">
|
||||
<div class="grid grid--full grid-small--half grid--gutters">
|
||||
|
||||
{% for driver in site.data.drivers.official %}
|
||||
<div class="grid__col">
|
||||
<a class="driver" href="https://github.com/bigchaindb/{{ driver.repo }}">
|
||||
<h2 class="driver__title">{{ driver.title }}</h2>
|
||||
<svg class="driver__logo">
|
||||
<use xlink:href="/assets/img/sprite.svg#{{ driver.icon }}"></use>
|
||||
</svg>
|
||||
{% for driver in site.data.drivers.official %}
|
||||
<div class="grid__col">
|
||||
<a class="driver" href="https://github.com/bigchaindb/{{ driver.repo }}">
|
||||
<h2 class="driver__title">{{ driver.title }}</h2>
|
||||
<svg class="driver__logo">
|
||||
<use xlink:href="/assets/img/sprite.svg#{{ driver.icon }}"></use>
|
||||
</svg>
|
||||
|
||||
<p class="driver__meta">
|
||||
<span class="driver__repo">{{ driver.repo }}</span>
|
||||
<span class="driver__version">{{ driver.version }}</span>
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<p class="driver__meta">
|
||||
<span class="driver__repo">{{ driver.repo }}</span>
|
||||
<span class="driver__version">{{ driver.version }}</span>
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
</div>
|
||||
<div class="grid__col">
|
||||
|
||||
</div>
|
||||
<div class="grid__col">
|
||||
<h3 class="choice__title">Official tools</h3>
|
||||
<div class="grid grid--full grid-small--half grid--gutters">
|
||||
|
||||
<h3>Official tools</h3>
|
||||
<div class="grid grid--full grid-small--half grid--gutters">
|
||||
{% for driver in site.data.drivers.tools %}
|
||||
<div class="grid__col">
|
||||
<a class="driver" href="https://github.com/bigchaindb/{{ driver.repo }}">
|
||||
<h2 class="driver__title">{{ driver.title }}</h2>
|
||||
|
||||
{% for driver in site.data.drivers.tools %}
|
||||
<div class="grid__col">
|
||||
<a class="driver" href="https://github.com/bigchaindb/{{ driver.repo }}">
|
||||
<h2 class="driver__title">{{ driver.title }}</h2>
|
||||
<p class="driver__meta">
|
||||
<span class="driver__repo">{{ driver.repo }}</span>
|
||||
<span class="driver__version">{{ driver.version }}</span>
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
<p class="driver__meta">
|
||||
<span class="driver__repo">{{ driver.repo }}</span>
|
||||
<span class="driver__version">{{ driver.version }}</span>
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row row--wide">
|
||||
<h3 class="choice__title">Community drivers</h3>
|
||||
<div class="grid grid--half grid-medium--fit grid--gutters">
|
||||
|
||||
</div>
|
||||
{% for driver in site.data.drivers.community %}
|
||||
<div class="grid__col">
|
||||
<a class="driver driver--community" href="{{ driver.link }}">
|
||||
<svg class="driver__logo">
|
||||
<use xlink:href="/assets/img/sprite.svg#{{ driver.icon }}"></use>
|
||||
</svg>
|
||||
<h2 class="driver__title">{{ driver.title }}</h2>
|
||||
|
||||
<div class="row row--wide">
|
||||
<h3>Community drivers</h3>
|
||||
<div class="grid grid--half grid-medium--fit grid--gutters">
|
||||
<p class="driver__meta">
|
||||
<span class="driver__repo">{{ driver.repo }}</span>
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
{% for driver in site.data.drivers.community %}
|
||||
<div class="grid__col">
|
||||
<a class="driver driver--community" href="{{ driver.link }}">
|
||||
<svg class="driver__logo">
|
||||
<use xlink:href="/assets/img/sprite.svg#{{ driver.icon }}"></use>
|
||||
</svg>
|
||||
<h2 class="driver__title">{{ driver.title }}</h2>
|
||||
|
||||
<p class="driver__meta">
|
||||
<span class="driver__repo">{{ driver.repo }}</span>
|
||||
</p>
|
||||
</a>
|
||||
</div>
|
||||
{% endfor %}
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
<section class="section section--docs background--light" id="docs">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user