diff --git a/app/assets/stylesheets/splash.css.scss b/app/assets/stylesheets/splash.css.scss index b9b47ead..ce20201c 100644 --- a/app/assets/stylesheets/splash.css.scss +++ b/app/assets/stylesheets/splash.css.scss @@ -230,3 +230,45 @@ a:after { 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; + } +} + + + diff --git a/app/views/conference/_footer.html.haml b/app/views/conference/_footer.html.haml new file mode 100644 index 00000000..571d56ea --- /dev/null +++ b/app/views/conference/_footer.html.haml @@ -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'); + } + }); + }); diff --git a/app/views/conference/show.html.haml b/app/views/conference/show.html.haml index 43e67fb3..83285ff4 100644 --- a/app/views/conference/show.html.haml +++ b/app/views/conference/show.html.haml @@ -57,3 +57,5 @@ .pad = render 'social_media' + = render 'footer' +