diff --git a/app/assets/stylesheets/application.css.scss b/app/assets/stylesheets/application.css.scss index ab2e53e..0ac4783 100644 --- a/app/assets/stylesheets/application.css.scss +++ b/app/assets/stylesheets/application.css.scss @@ -10,9 +10,9 @@ * defined in the other CSS/SCSS files in this directory. It is generally better to create a new * file per style scope. * - *= require_tree . *= require codemirror/codemirror *= require_self + *= require_tree . */ @import "bootstrap-sprockets"; @@ -44,6 +44,17 @@ body { margin: 10px 0; } +/* Style for links to previous and next problem */ +.problem-prev { + @extend .pull-left; + margin: 20px -30px 0; +} + +.problem-next { + @extend .pull-right; + margin: 20px -30px 0; +} + /* Custom css for fixing styles within problem content */ .problem-content { diff --git a/app/views/problems/show.html.erb b/app/views/problems/show.html.erb index a49fd66..1b5d863 100644 --- a/app/views/problems/show.html.erb +++ b/app/views/problems/show.html.erb @@ -6,8 +6,18 @@

<%= @problem.title %> <%= t '.problem_subtitle', id: @problem.id %>

+<% if Problem.exists?(@problem.id-1) %> + <%= link_to problem_path(@problem.id-1), title: t('problems.show.problem_subtitle', id: @problem.id-1), class: 'problem-prev' do %> + <%= icon :menu_left %> + <% end %> +<% end %> +<% if Problem.exists?(@problem.id+1) %> + <%= link_to problem_path(@problem.id+1), title: t('problems.show.problem_subtitle', id: @problem.id+1), class: 'problem-next' do %> + <%= icon :menu_right %> + <% end %> +<% end %> <%= link_to new_problem_translation_path(@problem), class: 'btn btn-default btn-sm pull-right' do %> - <%= icon :pencil %> <%= t '.improve_translation' %> + <%= icon :pencil %> <%= t '.improve_translation' %> <% end %> <%= panel do %>