Niklas/shadcn-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs: fix DataTableDemo.vue scroll-x on mobile devices

Browse Source
This commit is contained in:
sadeghbarati 2023-09-10 13:03:09 +03:30
parent 08fede88a9
commit 758278a676
1 changed files with 4 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

9
apps/www/src/lib/registry/default/example/DataTableDemo.vue
View File

@ -103,7 +103,7 @@ const columns: ColumnDef<Payment>[] = [
return h(Button, {
variant: 'ghost',
onClick: () => column.toggleSorting(column.getIsSorted() === 'asc'),
}, ['Email', h(ArrowUpDown, { class: 'ml-2 h-4 w-4' })])
}, () => ['Email', h(ArrowUpDown, { class: 'ml-2 h-4 w-4' })])
},
cell: ({ row }) => h('div', { class: 'lowercase' }, row.getValue('email')),
},
@ -128,9 +128,9 @@ const columns: ColumnDef<Payment>[] = [
cell: ({ row }) => {
const payment = row.original
return h(DropdownAction, {
return h('div', { class: 'relative' }, h(DropdownAction, {
payment,
})
}))
},
},
]
@ -162,7 +162,7 @@ const table = useVueTable({
<template>
<div class="w-full">
<div class="flex items-center py-4">
<div class="flex gap-2 items-center py-4">
<Input
class="max-w-sm"
placeholder="Filter emails..."
@ -244,7 +244,6 @@ const table = useVueTable({
:disabled="!table.getCanNextPage()"
@click="table.nextPage()"
>
>
Next
</Button>
</div>