raggedstaff/openfoodnetwork
1
0
Fork 0
mirror of https://github.com/openfoodfoundation/openfoodnetwork synced 2026-01-29 21:17:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

Tweak stimulus pagination (used on orders) to be up to date

Browse Source
This commit is contained in:
Jean-Baptiste Bellet
2023-09-05 17:24:55 +02:00
parent f2941f9275
commit 5df211137e
2 changed files with 32 additions and 9 deletions
Download Patch File Download Diff File Expand all files Collapse all files

22
app/views/admin/shared/_stimulus_pagination.html.haml
View File

@@ -2,21 +2,29 @@
.pagination{ "data-controller": "search" }
- if pagy.prev
%button{ data: { action: 'click->search#changePage', page: pagy.prev } }!= pagy_t('pagy.nav.prev')
%button.page.prev{ data: { action: 'click->search#changePage', page: pagy.prev } }
- if feature?(:admin_style_v3, spree_current_user)
%i.icon-chevron-left{ data: { action: 'click->search#changePage', page: pagy.prev } }
- else
!= pagy_t('pagy.nav.prev')
- else
%button.disabled{disabled: "disabled"}!= pagy_t('pagy.nav.prev')
%button.page.disabled{disabled: "disabled"}!= pagy_t('pagy.nav.prev')
- pagy.series.each do |item| # series example: [1, :gap, 7, 8, "9", 10, 11, :gap, 36]
- if item.is_a?(Integer) # page link
%button{ data: { action: 'click->search#changePage', page: item } }= item
%button.page{ data: { action: 'click->search#changePage', page: item } }= item
- elsif item.is_a?(String) # current page
%button.active= item
%button.page.current.active= item
- elsif item == :gap # page gap
%span.pagination-ellipsis!= pagy_t('pagy.nav.gap')
%span.page.gap.pagination-ellipsis!= pagy_t('pagy.nav.gap')
- if pagy.next
%button{ data: { action: 'click->search#changePage', page: pagy.next } }!= pagy_t('pagy.nav.next')
%button.page.next{ data: { action: 'click->search#changePage', page: pagy.next } }
- if feature?(:admin_style_v3, spree_current_user)
%i.icon-chevron-right{ data: { action: 'click->search#changePage', page: pagy.next } }
- else
!= pagy_t('pagy.nav.next')
- else
%button.disabled.pagination-next{disabled: "disabled"}!= pagy_t('pagy.nav.next')
%button.page.disabled.pagination-next{disabled: "disabled"}!= pagy_t('pagy.nav.next')

19
app/webpacker/css/admin_v3/components/pagination.scss
View File

@@ -9,15 +9,20 @@
justify-content: center;
gap: 8px;
button.page,
.page {
width: 40px;
line-height: 40px;
width: $btn-relaxed-height;
line-height: $btn-relaxed-height;
height: $btn-relaxed-height;
padding: 0;
margin: 0;
text-align: center;
display: inline-block;
text-align: center;
background-color: $color-1;
@include defaultBoxShadow;
border-radius: 4px;
border: none;
color: $color-8;
font-weight: 600;
@@ -31,6 +36,10 @@
color: $white;
}
&.disabled {
display: none;
}
&.prev {
margin-right: 28px; // 28+8 (the gap) = 36px : the space between the arrows and the numbers
& > i {
@@ -45,9 +54,11 @@
}
}
&:hover:not(.gap):not(.disabled),
&[href]:hover {
background-color: $color-5;
color: $white;
border: none;
}
&.gap {
@@ -55,6 +66,10 @@
box-shadow: none;
width: auto;
}
&:active {
border: none;
}
}
button {