1
0
mirror of https://github.com/bigchaindb/site.git synced 2024-11-22 09:46:57 +01:00

all the mobile tweaks

* closes #137
This commit is contained in:
Matthias Kretschmann 2017-06-29 15:16:10 +02:00
parent 733b36a45f
commit b88dcf7c80
Signed by: m
GPG Key ID: 606EEEF3C479A91F
3 changed files with 105 additions and 75 deletions

View File

@ -7,10 +7,13 @@
.section--firsttransaction {
.section-title {
font-size: $font-size-h3;
margin-top: -($spacer * 2);
margin-bottom: $spacer * 3;
text-align: left;
@media ($screen-sm) {
margin-top: -($spacer * 2);
}
&:after {
display: none;
}
@ -25,7 +28,10 @@
// mnml frm
background: none;
padding: 0;
@media ($screen-sm) {
min-height: 340px;
}
.form-group:first-child {
margin-top: 0;
@ -42,7 +48,7 @@
width: 100%;
pre {
min-height: 340px;
min-height: 200px;
display: flex;
align-items: center;
justify-content: center;
@ -51,14 +57,21 @@
border: 1px solid $gray-dark;
background: none;
overflow-x: hidden;
@media ($screen-sm) {
min-height: 340px;
}
}
}
.response {
pre {
min-height: 340px;
border: 1px solid $gray-dark;
line-height: 1.3;
@media ($screen-sm) {
min-height: 340px;
}
}
code {
@ -72,6 +85,12 @@
.code-example {
@include transition;
margin-top: $spacer * 2;
@media ($screen-sm) {
max-width: 50%;
margin-top: 0;
}
.nav-link,
pre {
@ -205,7 +224,11 @@
// Drivers starbase
// All magic numbers, gonna wing it visually
.starbase--drivers {
min-height: 7rem;
@media ($screen-md) {
min-height: 12rem;
}
.starbase__image {
// surface layer

View File

@ -3,8 +3,13 @@
}
.header__content {
padding: ($spacer * 4) 0;
padding: ($spacer * 3) 0;
text-align: center;
@media ($screen-sm) {
padding-top: ($spacer * 4);
padding-bottom: ($spacer * 4);
}
}
// intro animation

View File

@ -37,6 +37,37 @@ redirect_from:
</form>
</div>
<div class="grid__col">
<div class="waiting">
<pre>
<code class="waiting">Beep, boop, waiting for your input...</code>
</pre>
</div>
<div class="response highlight hide">
<pre>
<code class="output language-json">{
"asset": {
"data": {
"msg": "Blockchain all the things!"
}
},
"id": "04c00267af82c161b4bf2ad4a47d1ddbfeb47eef1a14b8d51",
...</code>
</pre>
</div>
<div class="message message--success alert alert--success hide">
<p>{{ content.firsttransaction.message.response }}</p>
<p><a class="transaction-link" href="https://test.ipdb.io/api/v1/transactions/">Check out your transaction on IPDB</a></p>
</div>
<p class="message message--fail alert alert--warning hide">Shenanigans! Something's off. Would you mind trying again?</p>
</div>
</div>
</div>
<div class="row row--wide">
<aside class="code-example">
<ul class="nav nav-tabs">
<li class="nav-item">
@ -105,35 +136,6 @@ conn.postTransaction(txSigned)
</div>
</aside>
</div>
<div class="grid__col">
<div class="waiting">
<pre>
<code class="waiting">Beep, boop, waiting for your input...</code>
</pre>
</div>
<div class="response highlight hide">
<pre>
<code class="output language-json">{
"asset": {
"data": {
"msg": "Blockchain all the things!"
}
},
"id": "04c00267af82c161b4bf2ad4a47d1ddbfeb47eef1a14b8d51",
...</code>
</pre>
</div>
<div class="message message--success alert alert--success hide">
<p>{{ content.firsttransaction.message.response }}</p>
<p><a class="transaction-link" href="https://test.ipdb.io/api/v1/transactions/">Check out your transaction on IPDB</a></p>
</div>
<p class="message message--fail alert alert--warning hide">Shenanigans! Something's off. Would you mind trying again?</p>
</div>
</div>
</div>
</section>