raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-02-28 01:53:25 +00:00
Code Issues Packages Projects Releases Wiki Activity

Move homepage "register here" CTA to bottom of screen.

Browse Source 
The CTA breaks the layout when the new cart sidebar is open. I can't see a nice way to keep it at the top without making a mess.
This commit is contained in:
Matt-Yorkley
2020-05-23 14:08:35 +02:00
parent 2bcadd52e8
commit bd97939062
3 changed files with 10 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
app/assets/javascripts/darkswarm/directives/page_alert.js.coffee
View File

@@ -14,8 +14,8 @@ Darkswarm.directive "ofnPageAlert", ($timeout) ->
# Wait a moment after page load before showing the alert. Otherwise we often miss the
# start of the animation.
$timeout ->
container_elems.addClass("move-down")
container_elems.addClass("move-up")
, 1000
scope.close = ->
container_elems.removeClass("move-down")
container_elems.removeClass("move-up")

1
app/assets/javascripts/darkswarm/directives/smooth_scroll_to.js.coffee
View File

@@ -10,6 +10,5 @@ Darkswarm.directive "ofnSmoothScrollTo", ($location, $document)->
# Scrolling is confused by our position:fixed top bar and page alert bar
# - add an offset to scroll to the correct location, plus 5px buffer
offset = $("nav.top-bar").height()
offset += $(".page-alert.move-down").height()
offset += 5
$document.scrollTo target, offset, 1000

17
app/assets/stylesheets/darkswarm/page_alert.css.scss
View File

@@ -55,19 +55,18 @@ $page-alert-height: 55px;
.off-canvas-fixed nav.tab-bar,
.off-canvas-fixed .page-alert {
@include transition(all 1000ms ease-in-out);
&.move-down {
margin-top: $page-alert-height;
}
}
.off-canvas-wrap .page-alert {
top: -1 * $page-alert-height;
bottom: -1 * $page-alert-height;
top: unset;
z-index: 100;
}
.off-canvas-wrap.move-right .inner-wrap.move-down {
.left-off-canvas-menu {
top: -1 * $page-alert-height;
&.move-up {
bottom: 0;
}
.alert-box {
border-bottom: 0;
}
}