diff --git a/public/javascripts/app/templates/post-viewer/nav.handlebars b/public/javascripts/app/templates/post-viewer/nav.handlebars index 2f823bd0fae6d6e7fff0cc2d59dfcdecc4a1eb23..68b3b9fe01dfdf8a178944acc6c0a00232f44e59 100644 --- a/public/javascripts/app/templates/post-viewer/nav.handlebars +++ b/public/javascripts/app/templates/post-viewer/nav.handlebars @@ -1,7 +1,11 @@ <a href="#" class="nav-arrow left" id="forward"> - <img src="/images/arrow-left.png" /> + <div class="nav-arrow-inner"> + <img src="/images/arrow-left.png" /> + </div> </a> <a href="#" class="nav-arrow right" id="back"> - <img src="/images/arrow-right.png" /> + <div class="nav-arrow-inner"> + <img src="/images/arrow-right.png" /> + </div> </a> diff --git a/public/javascripts/app/views/post-viewer/nav.js b/public/javascripts/app/views/post-viewer/nav.js index 32d748a4108018ffa5bd5374ee689cca2a096c3a..a85ae2e4051435a46daa1ab990292046dffeda4a 100644 --- a/public/javascripts/app/views/post-viewer/nav.js +++ b/public/javascripts/app/views/post-viewer/nav.js @@ -23,7 +23,7 @@ app.views.PostViewerNav = app.views.Base.extend({ if(evt) { evt.preventDefault(); } var link; - evt.target.tagName == "IMG" ? link = $(evt.target).closest("a") : link = $(evt.target) + evt.target.tagName != "A" ? link = $(evt.target).closest("a") : link = $(evt.target) app.router.navigate(link.attr("href").substring(1), true) } diff --git a/public/stylesheets/sass/new-templates.scss b/public/stylesheets/sass/new-templates.scss index c732294ddd6e0e6b00c96015cc4bf8f01496cf23..c92102f7ff55492f36ea61883cf76e592584bb3f 100644 --- a/public/stylesheets/sass/new-templates.scss +++ b/public/stylesheets/sass/new-templates.scss @@ -219,7 +219,8 @@ $light-grey: #999; .nav-arrow { @include opacity(0.8); @include transition(background-color, 0.3s); - @include center(); + + display: table; position: fixed; height: 100%; @@ -228,6 +229,12 @@ $light-grey: #999; padding: 0 13px; background-color: rgba(0,0,0,0); + .nav-arrow-inner { + padding: 0; margin: 0; + display: table-cell; + vertical-align: middle; + } + img { @include opacity(0.5);