1
0
mirror of https://github.com/bigchaindb/site.git synced 2024-12-24 02:16:10 +01:00

header animate all the things

This commit is contained in:
Matthias Kretschmann 2017-04-12 19:08:58 +02:00
parent e7f4da77e6
commit 590d103712
Signed by: m
GPG Key ID: BD3C1F3EDD7831FC
5 changed files with 41 additions and 5 deletions

View File

@ -167,6 +167,14 @@
}
.header--usecase {
hgroup {
margin-top: ($spacer * 5);
}
.header__title {
padding-top: 0;
}
.header__logo {
width: 140px;
max-height: 100px;
@ -178,6 +186,7 @@
}
.header__label {
text-align: center;
display: block;
color: $brand-main-blue-light;
font-size: $font-size-lg;

View File

@ -2,6 +2,34 @@
@extend .background--photo;
}
// intro animation
.header__title,
.header__description,
.header__logo,
.header__label {
.wf-active &,
.wf-inactive & {
@extend .animation-slide-in-from-bottom;
animation-fill-mode: backwards;
}
}
.header__description,
.header__logo {
.wf-active &,
.wf-inactive & {
animation-delay: .3s;
}
}
.header__btn,
.header__label {
.wf-active &,
.wf-inactive & {
animation-delay: .5s;
}
}
.header__title {
position: relative;
z-index: 1;

View File

@ -71,7 +71,6 @@ $menu-height-md: 66px;
.wf-active &,
.wf-inactive & {
@extend .animation-slide-in-from-bottom;
animation-duration: 1s;
animation-fill-mode: backwards;
}
}

View File

@ -42,7 +42,7 @@
transition: transform .2s ease-out;
@media ($screen-md) {
bottom: $spacer * 1.5;
bottom: $spacer * 1.3;
}
}

View File

@ -12,7 +12,7 @@ cta:
{% include menu-main.html %}
<div class="row">
<h1 class="header__title">
<hgroup>
<span class="header__label">{{ page.industry }}</span>
{% if page.bitmaplogo %}
<img class="header__logo" src="/assets/img/{{ page.bitmaplogo }}" />
@ -22,8 +22,8 @@ cta:
</svg>
{% endif %}
{{ page.title }}
</h1>
<h1 class="header__title">{{ page.title }}</h1>
</hgroup>
</div>
</header>