fix: listview layout
This commit is contained in:
parent
95639b07f6
commit
78be1a809a
@ -3,7 +3,7 @@
|
|||||||
<div class="flex flex-col overflow-y-hidden w-max min-w-full">
|
<div class="flex flex-col overflow-y-hidden w-max min-w-full">
|
||||||
<div
|
<div
|
||||||
id="list-header"
|
id="list-header"
|
||||||
class="flex space-x-4 items-center px-5 py-2 border-b"
|
class="flex space-x-4 items-center mx-5 mb-2 p-2 rounded bg-gray-100"
|
||||||
>
|
>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
class="duration-300 cursor-pointer"
|
class="duration-300 cursor-pointer"
|
||||||
@ -13,7 +13,7 @@
|
|||||||
<div
|
<div
|
||||||
v-for="column in columns"
|
v-for="column in columns"
|
||||||
:key="column"
|
:key="column"
|
||||||
class="text-sm text-gray-600"
|
class="text-base text-gray-600"
|
||||||
:class="[column.size, column.align]"
|
:class="[column.size, column.align]"
|
||||||
>
|
>
|
||||||
{{ column.label }}
|
{{ column.label }}
|
||||||
@ -24,7 +24,10 @@
|
|||||||
v-for="row in rows"
|
v-for="row in rows"
|
||||||
:key="row[rowKey]"
|
:key="row[rowKey]"
|
||||||
:to="$router.currentRoute.value.path + '/' + row[rowKey]"
|
:to="$router.currentRoute.value.path + '/' + row[rowKey]"
|
||||||
class="flex space-x-4 items-center mx-2 px-3 py-2 border-b cursor-pointer transition-all duration-300 ease-in-out"
|
class="flex flex-col mx-5 cursor-pointer transition-all duration-300 ease-in-out"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="flex space-x-4 items-center px-2 py-2.5 rounded"
|
||||||
:class="
|
:class="
|
||||||
selections.has(row[rowKey])
|
selections.has(row[rowKey])
|
||||||
? 'bg-gray-100 hover:bg-gray-200'
|
? 'bg-gray-100 hover:bg-gray-200'
|
||||||
@ -92,6 +95,8 @@
|
|||||||
</div>
|
</div>
|
||||||
</ListRowItem>
|
</ListRowItem>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="mx-2 h-px border-t border-gray-200"></div>
|
||||||
</router-link>
|
</router-link>
|
||||||
</div>
|
</div>
|
||||||
<transition
|
<transition
|
||||||
|
|||||||
@ -4,7 +4,7 @@
|
|||||||
<Breadcrumbs :items="[{ label: list.title }]" />
|
<Breadcrumbs :items="[{ label: list.title }]" />
|
||||||
</template>
|
</template>
|
||||||
</LayoutHeader>
|
</LayoutHeader>
|
||||||
<div class="flex justify-between items-center px-5 pb-2.5 border-b">
|
<div class="flex justify-between items-center px-5 pt-3 pb-4">
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
<Button label="Sort">
|
<Button label="Sort">
|
||||||
<template #prefix><SortIcon class="h-4" /></template>
|
<template #prefix><SortIcon class="h-4" /></template>
|
||||||
|
|||||||
@ -9,7 +9,7 @@
|
|||||||
</Button>
|
</Button>
|
||||||
</template>
|
</template>
|
||||||
</LayoutHeader>
|
</LayoutHeader>
|
||||||
<div class="flex justify-between items-center px-5 pb-2.5 border-b">
|
<div class="flex justify-between items-center px-5 pt-3 pb-4">
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
<Dropdown :options="viewsDropdownOptions">
|
<Dropdown :options="viewsDropdownOptions">
|
||||||
<template #default="{ open }">
|
<template #default="{ open }">
|
||||||
|
|||||||
@ -9,7 +9,7 @@
|
|||||||
</Button>
|
</Button>
|
||||||
</template>
|
</template>
|
||||||
</LayoutHeader>
|
</LayoutHeader>
|
||||||
<div class="flex justify-between items-center px-5 pb-2.5">
|
<div class="flex justify-between items-center px-5 pt-3 pb-4">
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
<Dropdown :options="viewsDropdownOptions">
|
<Dropdown :options="viewsDropdownOptions">
|
||||||
<template #default="{ open }">
|
<template #default="{ open }">
|
||||||
|
|||||||
@ -9,7 +9,7 @@
|
|||||||
</Button>
|
</Button>
|
||||||
</template>
|
</template>
|
||||||
</LayoutHeader>
|
</LayoutHeader>
|
||||||
<div class="flex justify-between items-center px-5 pb-2.5">
|
<div class="flex justify-between items-center px-5 pt-3 pb-4">
|
||||||
<div class="flex items-center gap-2">
|
<div class="flex items-center gap-2">
|
||||||
<Dropdown :options="viewsDropdownOptions">
|
<Dropdown :options="viewsDropdownOptions">
|
||||||
<template #default="{ open }">
|
<template #default="{ open }">
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user