Merge pull request #285 from gopesht/footer
Adds button to navigate to topmost component onscroll
This commit is contained in:
commit
c34991db44
3 changed files with 58 additions and 0 deletions
|
|
@ -230,3 +230,45 @@ a:after {
|
||||||
visibility: hidden;
|
visibility: hidden;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.scroll-top-wrapper {
|
||||||
|
position: fixed;
|
||||||
|
opacity: 0;
|
||||||
|
visibility: hidden;
|
||||||
|
overflow: hidden;
|
||||||
|
text-align: center;
|
||||||
|
z-index: 99999999;
|
||||||
|
background-color: #424242;
|
||||||
|
width: 50px;
|
||||||
|
height: 48px;
|
||||||
|
line-height: 48px;
|
||||||
|
right: 30px;
|
||||||
|
bottom: 30px;
|
||||||
|
padding-top: 2px;
|
||||||
|
border-top-left-radius: 10px;
|
||||||
|
border-top-right-radius: 10px;
|
||||||
|
border-bottom-right-radius: 10px;
|
||||||
|
border-bottom-left-radius: 10px;
|
||||||
|
-webkit-transition: all 0.5s ease-in-out;
|
||||||
|
-moz-transition: all 0.5s ease-in-out;
|
||||||
|
-ms-transition: all 0.5s ease-in-out;
|
||||||
|
-o-transition: all 0.5s ease-in-out;
|
||||||
|
transition: all 0.5s ease-in-out;
|
||||||
|
|
||||||
|
i.fa {
|
||||||
|
line-height: inherit;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.show {
|
||||||
|
visibility:visible;
|
||||||
|
cursor:pointer;
|
||||||
|
opacity: 1.0;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
|
||||||
14
app/views/conference/_footer.html.haml
Normal file
14
app/views/conference/_footer.html.haml
Normal file
|
|
@ -0,0 +1,14 @@
|
||||||
|
%div.scroll-top-wrapper
|
||||||
|
= link_to "#splash-banner", class: "smoothscroll" do
|
||||||
|
%i.fa.fa-2x.fa-arrow-circle-up
|
||||||
|
|
||||||
|
:javascript
|
||||||
|
$(function(){
|
||||||
|
$(document).on( 'scroll', function(){
|
||||||
|
if ($(window).scrollTop() > 100) {
|
||||||
|
$('.scroll-top-wrapper').addClass('show');
|
||||||
|
} else {
|
||||||
|
$('.scroll-top-wrapper').removeClass('show');
|
||||||
|
}
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
@ -57,3 +57,5 @@
|
||||||
.pad
|
.pad
|
||||||
= render 'social_media'
|
= render 'social_media'
|
||||||
|
|
||||||
|
= render 'footer'
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue