bigchaindb/site
1
0
Fork 0
mirror of https://github.com/bigchaindb/site.git synced 2024-11-24 18:52:55 +01:00
Code Releases Activity

hero copy tweaks

Browse Source
This commit is contained in:
Matthias Kretschmann 2015-12-21 15:41:44 +01:00
parent 71f46c8b69
commit efe35671d9
3 changed files with 29 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
_src/_assets/styles/bigchain/_variables.scss
View File

@ -47,7 +47,7 @@ $font-size-root-lg: 18px !default;
$font-size-base: 1rem !default;
$font-size-lg: 1.25rem !default;
$font-size-sm: 0.75rem !default;
$font-size-sm: 0.875rem !default;
$font-size-xs: 0.75rem !default;
$font-size-h1: 3rem !default;

38
_src/_assets/styles/page-front.scss
View File

@ -31,11 +31,6 @@
z-index: 0;
}
.hero__content {
position: relative;
z-index: 1;
}
.logo {
fill-opacity: .6;
margin: auto;
@ -49,14 +44,14 @@
.section-title {
color: #fff;
margin-bottom: ($spacer * 3);
margin-bottom: $spacer;
&:after { display: none }
}
.btn-link {
color: #fff;
margin-top: ($spacer * 3);
margin-top: ($spacer * 4);
opacity: .7;
&:hover,
@ -80,10 +75,15 @@
}
}
.btn-link {
}
// intro animation
.logo,
.section-title,
.btn {
.btn,
.hero__comingsoon {
@extend .animation-slide-in-from-bottom;
animation-duration: 1s;
animation-fill-mode: backwards;
@ -94,22 +94,36 @@
}
.section-title,
.btn {
.btn,
.hero__comingsoon {
@extend .animation-slide-in-from-bottom;
animation-play-state: paused;
}
.btn { animation-delay: .2s; }
.btn-link { animation-delay: .4s; }
.hero__comingsoon { animation-delay: .2s; }
.btn { animation-delay: .4s; }
.btn-link { animation-delay: .6s; }
&.is-ready {
.section-title,
.btn {
.btn,
.hero__comingsoon {
animation-play-state: running;
}
}
}
.hero__content {
position: relative;
z-index: 1;
}
.hero__comingsoon {
text-shadow: none;
display: block;
color: rgba($brand-main-blue-dark, .9);
margin-top: ($spacer * 2);
margin-bottom: ($spacer * 2);
}

3
_src/index.html
View File

@ -11,8 +11,9 @@ front_page: true
<title>Logo</title>
<use xlink:href="/assets/img/sprite.svg#logo"></use>
</svg>
<h1 class="section-title">Bigchain is coming.</h1>
<h1 class="section-title">Meet Bigchain, the world’s most scalable blockchain.</h1>
<p>
<span class="hero__comingsoon">Coming soon</span>
<a href="#earlyaccess" class="btn btn-secondary-outline">Get Early Access</a>
</p>
<a href="#benchmarks" class="btn btn-link btn-sm">Learn More <svg class="icon">