Add previous/next page arrows to newer/older pagination
This commit is contained in:
parent
523bb3169a
commit
ebbebf8e57
2 changed files with 36 additions and 8 deletions
|
@ -1,4 +1,12 @@
|
|||
module SvgHelper
|
||||
def previous_page_svg_tag(**options)
|
||||
adjacent_page_svg_tag(dir == "rtl" ? 1 : -1, **options)
|
||||
end
|
||||
|
||||
def next_page_svg_tag(**options)
|
||||
adjacent_page_svg_tag(dir == "rtl" ? -1 : 1, **options)
|
||||
end
|
||||
|
||||
def key_svg_tag(**options)
|
||||
border_width = options["border"] ? (options["border-width"] || 1) : 0
|
||||
rect_attrs = {
|
||||
|
@ -31,6 +39,17 @@ module SvgHelper
|
|||
|
||||
private
|
||||
|
||||
# returns "<" shape if side == -1; ">" if side == 1
|
||||
def adjacent_page_svg_tag(side, **options)
|
||||
height = 15
|
||||
pad = 2
|
||||
segment = (0.5 * height) - pad
|
||||
width = segment + (2 * pad)
|
||||
path_data = "M#{side * (pad - (0.5 * width))},#{pad} l#{side * segment},#{segment} l#{-side * segment},#{segment}"
|
||||
path_tag = tag.path :d => path_data, :fill => "none", :stroke => "currentColor", :"stroke-width" => 1.5
|
||||
tag.svg path_tag, :width => width, :height => height, :viewBox => "-#{0.5 * width} 0 #{width} #{height}", :class => options[:class]
|
||||
end
|
||||
|
||||
def stroke_attrs(attrs, prefix)
|
||||
attrs.select { |key| key.start_with?(prefix) }.transform_keys { |key| key.delete_prefix(prefix).prepend("stroke") }
|
||||
end
|
||||
|
|
|
@ -1,22 +1,31 @@
|
|||
<nav>
|
||||
<% link_class = "page-link d-flex align-items-center gap-2 text-center" %>
|
||||
<ul class="pagination">
|
||||
<% newer_link_content = capture do %>
|
||||
<%= previous_page_svg_tag :class => "flex-shrink-0 d-none d-sm-block" %>
|
||||
<%= t(newer_key) %>
|
||||
<% end %>
|
||||
<% if newer_id -%>
|
||||
<li class="page-item">
|
||||
<%= link_to t(newer_key), @params.merge(:before => nil, :after => newer_id), :class => "page-link" %>
|
||||
<li class="page-item d-flex">
|
||||
<%= link_to newer_link_content, @params.merge(:before => nil, :after => newer_id), :class => link_class %>
|
||||
</li>
|
||||
<% else -%>
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link"><%= t(newer_key) %></span>
|
||||
<li class="page-item d-flex disabled">
|
||||
<%= tag.span newer_link_content, :class => link_class %>
|
||||
</li>
|
||||
<% end -%>
|
||||
|
||||
<% older_link_content = capture do %>
|
||||
<%= t(older_key) %>
|
||||
<%= next_page_svg_tag :class => "flex-shrink-0 d-none d-sm-block" %>
|
||||
<% end %>
|
||||
<% if older_id -%>
|
||||
<li class="page-item">
|
||||
<%= link_to t(older_key), @params.merge(:before => older_id, :after => nil), :class => "page-link" %>
|
||||
<li class="page-item d-flex">
|
||||
<%= link_to older_link_content, @params.merge(:before => older_id, :after => nil), :class => link_class %>
|
||||
</li>
|
||||
<% else -%>
|
||||
<li class="page-item disabled">
|
||||
<span class="page-link"><%= t(older_key) %></span>
|
||||
<li class="page-item d-flex disabled">
|
||||
<%= tag.span older_link_content, :class => link_class %>
|
||||
</li>
|
||||
<% end -%>
|
||||
</ul>
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue