arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-29 19:30:37 +01:00
Code Issues Packages Projects Releases Wiki Activity

docs(table): fix examples width (#2478)

Browse Source
This commit is contained in:
Sandro Circi
2024-10-28 16:55:11 +01:00
committed by GitHub
parent 0a17663d13
commit 75410fba97
5 changed files with 7 additions and 7 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
docs/app/components/content/examples/table/TableColumnFiltersExample.vue
View File

@@ -99,7 +99,7 @@ const columnFilters = ref([{
</script> </script>
<template> <template>
<div class="flex flex-col flex-1"> <div class="flex flex-col flex-1 w-full">
<div class="flex px-4 py-3.5 border-b border-[var(--ui-border-accented)]"> <div class="flex px-4 py-3.5 border-b border-[var(--ui-border-accented)]">
<UInput <UInput
:model-value="(table?.tableApi?.getColumn('email')?.getFilterValue() as string)" :model-value="(table?.tableApi?.getColumn('email')?.getFilterValue() as string)"

2
docs/app/components/content/examples/table/TableColumnVisibilityExample.vue
View File

@@ -99,7 +99,7 @@ const columnVisibility = ref({
</script> </script>
<template> <template>
<div class="flex flex-col flex-1"> <div class="flex flex-col flex-1 w-full">
<div class="flex justify-end px-4 py-3.5 border-b border-[var(--ui-border-accented)]"> <div class="flex justify-end px-4 py-3.5 border-b border-[var(--ui-border-accented)]">
<UDropdownMenu <UDropdownMenu
:items="table?.tableApi?.getAllColumns().filter(column => column.getCanHide()).map(column => ({ :items="table?.tableApi?.getAllColumns().filter(column => column.getCanHide()).map(column => ({

6
docs/app/components/content/examples/table/TableExample.vue
View File

@@ -264,11 +264,11 @@ function randomize() {
</script> </script>
<template> <template>
<div class="flex-1 divide-y divide-[var(--ui-border-accented)]"> <div class="flex-1 divide-y divide-[var(--ui-border-accented)] w-full">
<div class="flex items-center gap-2 px-4 py-3.5"> <div class="flex items-center gap-2 px-4 py-3.5 overflow-x-auto">
<UInput <UInput
:model-value="(table?.tableApi?.getColumn('email')?.getFilterValue() as string)" :model-value="(table?.tableApi?.getColumn('email')?.getFilterValue() as string)"
class="max-w-sm" class="max-w-sm min-w-[12ch]"
placeholder="Filter emails..." placeholder="Filter emails..."
@update:model-value="table?.tableApi?.getColumn('email')?.setFilterValue($event)" @update:model-value="table?.tableApi?.getColumn('email')?.setFilterValue($event)"
/> />

2
docs/app/components/content/examples/table/TableGlobalFilterExample.vue
View File

@@ -96,7 +96,7 @@ const globalFilter = ref('45')
</script> </script>
<template> <template>
<div class="flex flex-col flex-1"> <div class="flex flex-col flex-1 w-full">
<div class="flex px-4 py-3.5 border-b border-[var(--ui-border-accented)]"> <div class="flex px-4 py-3.5 border-b border-[var(--ui-border-accented)]">
<UInput <UInput
v-model="globalFilter" v-model="globalFilter"

2
docs/app/components/content/examples/table/TableRowSelectionExample.vue
View File

@@ -106,7 +106,7 @@ const rowSelection = ref({ 1: true })
</script> </script>
<template> <template>
<div class="flex-1"> <div class="flex-1 w-full">
<UTable <UTable
ref="table" ref="table"
v-model:row-selection="rowSelection" v-model:row-selection="rowSelection"