replace button with bouncing arrow on first slide
parent
33b6907163
commit
96bc2ae0e5
|
@ -18,8 +18,11 @@
|
||||||
<p>{{ . | markdownify }}</p>
|
<p>{{ . | markdownify }}</p>
|
||||||
{{ end }}
|
{{ end }}
|
||||||
{{ with .Site.Params.start.buttonText }}
|
{{ with .Site.Params.start.buttonText }}
|
||||||
<a href="#about" class="btn btn-primary btn-xl page-scroll">{{ . }}</a>
|
<!--<a href="#about" class="btn btn-primary btn-xl page-scroll">{{ . }}</a>-->
|
||||||
{{ end }}
|
{{ end }}
|
||||||
|
<div class="arrow-bounce">
|
||||||
|
<a class="fa fa-chevron-down fa-3x hiddenlink page-scroll" href="#about"></a>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</header>
|
</header>
|
||||||
|
|
|
@ -134,3 +134,32 @@ a:not(.btn):not(.hiddenlink):hover::before, a:not(.btn):not(.hiddenlink):focus::
|
||||||
left: 0;
|
left: 0;
|
||||||
right: 0;
|
right: 0;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Bouncing down arrow */
|
||||||
|
|
||||||
|
.arrow-bounce {
|
||||||
|
text-align: center;
|
||||||
|
margin: -30px 0;
|
||||||
|
-moz-animation: bounce 2s infinite;
|
||||||
|
-webkit-animation: bounce 2s infinite;
|
||||||
|
animation: bounce 2s infinite;
|
||||||
|
}
|
||||||
|
.arrow-bounce a {
|
||||||
|
color: #168EC1;
|
||||||
|
padding: 30px;
|
||||||
|
}
|
||||||
|
.arrow-bounce a:hover {
|
||||||
|
color: #0F5E80;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes bounce {
|
||||||
|
0%, 20%, 50%, 80%, 100% {
|
||||||
|
transform: translateY(0);
|
||||||
|
}
|
||||||
|
40% {
|
||||||
|
transform: translateY(-20px);
|
||||||
|
}
|
||||||
|
60% {
|
||||||
|
transform: translateY(-10px);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
Loading…
Reference in New Issue