nzambello/work-timer
1
0
Fork 0
Code Issues Pull requests Actions Packages Projects Releases Wiki Activity

fix: pagination fieldset styles

Browse source
This commit is contained in:
Nicola Zambello 2023-02-18 23:26:23 +01:00
parent 3a94721c97
commit 4083641a6a
Signed by: nzambello
GPG key ID: 56E4A92C2C1E50BA
1 changed files with 35 additions and 30 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
app/routes/time-entries.tsx
View file

@ -132,45 +132,50 @@ export default function TimeEntriesPage() {
variant="light" variant="light"
radius={theme.radius.md} radius={theme.radius.md}
leftIcon={<Play />} leftIcon={<Play />}
sx={{ marginTop: theme.spacing.sm, marginBottom: theme.spacing.sm }}
> >
Start Start
</Button> </Button>
<div <NativeSelect
style={{ sx={{
display: 'flex', marginLeft: 'auto',
alignItems: 'flex-end', marginRight: '0.5rem',
justifyContent: 'space-between', marginTop: theme.spacing.sm,
margin: '0.5rem 0' marginBottom: theme.spacing.sm
}} }}
> data={[
<NativeSelect { label: '25 / page', value: '25' },
data={[ { label: '50 / page', value: '50' },
{ label: '25 / page', value: '25' }, { label: '100 / page', value: '100' }
{ label: '50 / page', value: '50' }, ]}
{ label: '100 / page', value: '100' } value={pageSize}
]} onChange={(event) => {
value={pageSize} setSearchParams({
onChange={(event) => { page: page.toString(),
size: event.currentTarget.value
});
}}
/>
{data.total / pageSize > 1 && (
<Pagination
sx={{
marginLeft: '0.5rem',
marginTop: theme.spacing.sm,
marginBottom: theme.spacing.sm
}}
aria-label="Navigate through time entries pages"
siblings={1}
boundaries={1}
page={page}
total={Math.ceil(data.total / pageSize)}
onChange={(page) => {
setSearchParams({ setSearchParams({
page: page.toString(), page: page.toString(),
size: event.currentTarget.value size: pageSize.toString()
}); });
}} }}
/> />
{data.total / pageSize > 1 && ( )}
<Pagination
style={{ marginLeft: 10 }}
page={page}
total={Math.ceil(data.total / pageSize)}
onChange={(page) => {
setSearchParams({
page: page.toString(),
size: pageSize.toString()
});
}}
/>
)}
</div>
</Paper> </Paper>
<Group <Group
mt="lg" mt="lg"