refactor: use static width for table cells.
This commit is contained in:
parent
90ebf44ad4
commit
ca03bf716b
13 changed files with 46 additions and 46 deletions
6
.vscode/launch.json
vendored
6
.vscode/launch.json
vendored
|
|
@ -2,7 +2,7 @@
|
|||
"version": "0.2.0",
|
||||
"configurations": [
|
||||
{
|
||||
"name": "Node: Nuxt3",
|
||||
"name": "UI: Dev",
|
||||
"request": "launch",
|
||||
"runtimeArgs": [
|
||||
"run",
|
||||
|
|
@ -21,7 +21,7 @@
|
|||
"outputCapture": "std"
|
||||
},
|
||||
{
|
||||
"name": "Python: main.py ",
|
||||
"name": "Python: main.py",
|
||||
"type": "debugpy",
|
||||
"request": "launch",
|
||||
"program": "app/main.py",
|
||||
|
|
@ -38,7 +38,7 @@
|
|||
},
|
||||
},
|
||||
{
|
||||
"name": "Node: Generate UI",
|
||||
"name": "UI: Generate",
|
||||
"request": "launch",
|
||||
"runtimeArgs": [
|
||||
"run",
|
||||
|
|
|
|||
|
|
@ -52,10 +52,10 @@
|
|||
class="w-full min-w-0 max-w-full overflow-hidden rounded-lg border border-default bg-default"
|
||||
>
|
||||
<div class="w-full max-w-full overflow-x-auto overscroll-x-contain">
|
||||
<table class="min-w-325 max-w-455 table-fixed w-full text-sm">
|
||||
<table class="min-w-190 table-fixed w-full text-sm">
|
||||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-[5%]">
|
||||
<th class="w-12">
|
||||
<button type="button" class="cursor-pointer" @click="toggleMasterSelection">
|
||||
<UIcon
|
||||
:name="masterSelectAll ? 'i-lucide-square' : 'i-lucide-check'"
|
||||
|
|
@ -64,10 +64,10 @@
|
|||
</button>
|
||||
</th>
|
||||
<th class="text-left">Title</th>
|
||||
<th class="w-[7%]">Status</th>
|
||||
<th class="w-[7%]">Created</th>
|
||||
<th class="w-[7%]">Size/Starts</th>
|
||||
<th class="w-[8%]">Actions</th>
|
||||
<th class="w-32 whitespace-nowrap">Status</th>
|
||||
<th class="w-36 whitespace-nowrap">Created</th>
|
||||
<th class="w-36 whitespace-nowrap">Size/Starts</th>
|
||||
<th class="w-44 whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
|
@ -211,7 +211,7 @@
|
|||
</template>
|
||||
</td>
|
||||
|
||||
<td class="w-[1%] px-3 py-3 align-top whitespace-nowrap">
|
||||
<td class="w-44 px-3 py-3 align-top whitespace-nowrap">
|
||||
<div class="flex items-center justify-end gap-1">
|
||||
<UButton
|
||||
v-if="!item.filename"
|
||||
|
|
|
|||
|
|
@ -48,10 +48,10 @@
|
|||
class="w-full min-w-0 max-w-full overflow-hidden rounded-lg border border-default bg-default"
|
||||
>
|
||||
<div class="w-full max-w-full overflow-x-auto overscroll-x-contain">
|
||||
<table class="min-w-325 w-full text-sm">
|
||||
<table class="min-w-190 table-fixed w-full text-sm">
|
||||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-[5%]">
|
||||
<th class="w-12">
|
||||
<button type="button" class="cursor-pointer" @click="toggleMasterSelection">
|
||||
<UIcon
|
||||
:name="masterSelectAll ? 'i-lucide-square' : 'i-lucide-check'"
|
||||
|
|
@ -61,9 +61,9 @@
|
|||
</th>
|
||||
<th class="w-full text-left">Video Title</th>
|
||||
<th class="w-56">Progress</th>
|
||||
<th class="w-[15%]">Status</th>
|
||||
<th class="w-[15%]">Created</th>
|
||||
<th class="w-[1%]">Actions</th>
|
||||
<th class="w-32 whitespace-nowrap">Status</th>
|
||||
<th class="w-36 whitespace-nowrap">Created</th>
|
||||
<th class="w-44 whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
|
@ -194,7 +194,7 @@
|
|||
</UTooltip>
|
||||
</td>
|
||||
|
||||
<td class="w-[1%] px-3 py-3 align-top whitespace-nowrap">
|
||||
<td class="w-44 px-3 py-3 align-top whitespace-nowrap">
|
||||
<div class="flex items-center justify-end gap-1">
|
||||
<UButton
|
||||
color="warning"
|
||||
|
|
|
|||
|
|
@ -429,7 +429,7 @@
|
|||
class="w-full min-w-0 max-w-full overflow-hidden rounded-lg border border-default bg-default"
|
||||
>
|
||||
<div class="w-full max-w-full overflow-x-auto overscroll-x-contain">
|
||||
<table class="min-w-215 w-full table-fixed text-sm">
|
||||
<table class="min-w-215 table-fixed w-full text-sm">
|
||||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-left [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-40">
|
||||
|
|
|
|||
|
|
@ -122,7 +122,7 @@
|
|||
<table class="min-w-180 w-full table-auto text-sm">
|
||||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-left [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-[1%] whitespace-nowrap">Flags</th>
|
||||
<th class="w-80 whitespace-nowrap">Flags</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
|
@ -132,7 +132,7 @@
|
|||
:key="opt.flags.join('|')"
|
||||
class="align-top hover:bg-muted/20"
|
||||
>
|
||||
<td class="w-[1%] px-3 py-3 align-top whitespace-nowrap">
|
||||
<td class="w-80 px-3 py-3 align-top">
|
||||
<div class="flex items-start gap-2">
|
||||
<div class="flex flex-wrap gap-1.5">
|
||||
<UBadge
|
||||
|
|
@ -186,8 +186,8 @@
|
|||
<table class="min-w-215 w-full table-auto text-sm">
|
||||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-left [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-[1%] whitespace-nowrap">Flags</th>
|
||||
<th class="w-[1%] whitespace-nowrap">Group</th>
|
||||
<th class="w-80 whitespace-nowrap">Flags</th>
|
||||
<th class="w-36 whitespace-nowrap">Group</th>
|
||||
<th>Description</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
|
@ -197,7 +197,7 @@
|
|||
:key="opt.flags.join('|')"
|
||||
class="align-top hover:bg-muted/20"
|
||||
>
|
||||
<td class="w-[1%] px-3 py-3 align-top">
|
||||
<td class="w-80 px-3 py-3 align-top">
|
||||
<div class="flex items-start gap-2">
|
||||
<div class="flex flex-wrap gap-1.5">
|
||||
<UBadge
|
||||
|
|
@ -227,7 +227,7 @@
|
|||
</UTooltip>
|
||||
</div>
|
||||
</td>
|
||||
<td class="w-[1%] px-3 py-3 align-top font-medium text-default whitespace-nowrap">
|
||||
<td class="w-36 px-3 py-3 align-top font-medium text-default whitespace-nowrap">
|
||||
{{ opt.group || 'root' }}
|
||||
</td>
|
||||
<td class="px-3 py-3 align-top text-default">
|
||||
|
|
|
|||
|
|
@ -191,7 +191,7 @@
|
|||
class="ml-1 inline-flex size-3.5"
|
||||
/>
|
||||
</th>
|
||||
<th class="w-[1%] whitespace-nowrap">
|
||||
<th class="w-28 whitespace-nowrap">
|
||||
Size
|
||||
<UIcon
|
||||
v-if="sort_by === 'size'"
|
||||
|
|
@ -199,7 +199,7 @@
|
|||
class="ml-1 inline-flex size-3.5"
|
||||
/>
|
||||
</th>
|
||||
<th class="w-[1%] whitespace-nowrap">
|
||||
<th class="w-40 whitespace-nowrap">
|
||||
Date
|
||||
<UIcon
|
||||
v-if="sort_by === 'date'"
|
||||
|
|
@ -207,7 +207,7 @@
|
|||
class="ml-1 inline-flex size-3.5"
|
||||
/>
|
||||
</th>
|
||||
<th v-if="controlEnabled" class="w-[1%]">Actions</th>
|
||||
<th v-if="controlEnabled" class="w-80 whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
|
@ -271,7 +271,7 @@
|
|||
</UTooltip>
|
||||
</td>
|
||||
|
||||
<td v-if="controlEnabled" class="w-[1%] px-3 py-3 align-middle whitespace-nowrap">
|
||||
<td v-if="controlEnabled" class="w-80 px-3 py-3 align-middle whitespace-nowrap">
|
||||
<div class="flex items-center justify-end gap-2">
|
||||
<UButton
|
||||
color="warning"
|
||||
|
|
|
|||
|
|
@ -93,7 +93,7 @@
|
|||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-full text-left">Condition</th>
|
||||
<th class="w-[1%]">Actions</th>
|
||||
<th class="w-44 whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
|
@ -146,7 +146,7 @@
|
|||
</div>
|
||||
</td>
|
||||
|
||||
<td class="w-[1%] px-3 py-3 align-middle whitespace-nowrap">
|
||||
<td class="w-44 px-3 py-3 align-middle whitespace-nowrap">
|
||||
<div class="flex items-center justify-end gap-2">
|
||||
<UButton
|
||||
color="info"
|
||||
|
|
|
|||
|
|
@ -151,7 +151,7 @@
|
|||
</td>
|
||||
|
||||
<td
|
||||
class="w-[2%] px-3 py-3 text-center align-middle whitespace-nowrap"
|
||||
class="w-12 px-3 py-3 text-center align-middle whitespace-nowrap"
|
||||
>
|
||||
<UButton
|
||||
color="error"
|
||||
|
|
|
|||
|
|
@ -93,7 +93,7 @@
|
|||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-full text-left">Field</th>
|
||||
<th class="w-[1%]">Actions</th>
|
||||
<th class="w-44 whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
|
@ -126,7 +126,7 @@
|
|||
</div>
|
||||
</td>
|
||||
|
||||
<td class="w-[1%] px-3 py-3 align-middle whitespace-nowrap">
|
||||
<td class="w-44 px-3 py-3 align-middle whitespace-nowrap">
|
||||
<div class="flex items-center justify-end gap-2">
|
||||
<UButton
|
||||
color="info"
|
||||
|
|
|
|||
|
|
@ -106,7 +106,7 @@
|
|||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-full text-left">Targets</th>
|
||||
<th class="w-[1%]">Actions</th>
|
||||
<th class="w-44 whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
|
@ -159,7 +159,7 @@
|
|||
</div>
|
||||
</td>
|
||||
|
||||
<td class="w-[1%] px-3 py-3 align-middle whitespace-nowrap">
|
||||
<td class="w-44 px-3 py-3 align-middle whitespace-nowrap">
|
||||
<div class="flex items-center justify-end gap-2">
|
||||
<UButton
|
||||
color="info"
|
||||
|
|
|
|||
|
|
@ -85,7 +85,7 @@
|
|||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-full text-left">Preset</th>
|
||||
<th class="w-[1%]">Actions</th>
|
||||
<th class="w-44 whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
|
@ -114,7 +114,7 @@
|
|||
</div>
|
||||
</td>
|
||||
|
||||
<td class="w-[1%] px-3 py-3 align-middle whitespace-nowrap">
|
||||
<td class="w-44 px-3 py-3 align-middle whitespace-nowrap">
|
||||
<div class="flex items-center justify-end gap-2">
|
||||
<UButton
|
||||
color="info"
|
||||
|
|
|
|||
|
|
@ -102,9 +102,9 @@
|
|||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-full text-left">Definition</th>
|
||||
<th class="w-[18%]">Priority</th>
|
||||
<th class="w-[18%]">Updated</th>
|
||||
<th class="w-[1%]">Actions</th>
|
||||
<th class="w-28 whitespace-nowrap">Priority</th>
|
||||
<th class="w-36 whitespace-nowrap">Updated</th>
|
||||
<th class="w-44 whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
|
@ -158,7 +158,7 @@
|
|||
</UTooltip>
|
||||
</td>
|
||||
|
||||
<td class="w-[1%] px-3 py-3 align-middle whitespace-nowrap">
|
||||
<td class="w-44 px-3 py-3 align-middle whitespace-nowrap">
|
||||
<div class="flex items-center justify-end gap-2">
|
||||
<UButton
|
||||
color="info"
|
||||
|
|
|
|||
|
|
@ -116,10 +116,10 @@
|
|||
class="w-full min-w-0 max-w-full overflow-hidden rounded-lg border border-default bg-default"
|
||||
>
|
||||
<div class="w-full max-w-full overflow-x-auto overscroll-x-contain">
|
||||
<table class="min-w-290 w-full text-sm">
|
||||
<table class="min-w-190 table-fixed w-full text-sm">
|
||||
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned">
|
||||
<tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
|
||||
<th class="w-[5%]">
|
||||
<th class="w-12">
|
||||
<button type="button" class="cursor-pointer" @click="toggleMasterSelection">
|
||||
<UIcon
|
||||
:name="allSelected ? 'i-lucide-square' : 'i-lucide-square-check-big'"
|
||||
|
|
@ -128,8 +128,8 @@
|
|||
</button>
|
||||
</th>
|
||||
<th class="w-full text-left">Task</th>
|
||||
<th class="w-[18%]">Timer</th>
|
||||
<th class="w-[1%]">Actions</th>
|
||||
<th class="w-100 whitespace-nowrap">Timer</th>
|
||||
<th class="w-44 whitespace-nowrap">Actions</th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
||||
|
|
@ -146,7 +146,7 @@
|
|||
</label>
|
||||
</td>
|
||||
|
||||
<td class="px-3 py-3 align-top">
|
||||
<td class="w-0 px-3 py-3 align-top">
|
||||
<div class="flex items-start justify-between gap-3">
|
||||
<div class="min-w-0 flex-1 space-y-2">
|
||||
<div class="flex items-start gap-2">
|
||||
|
|
@ -286,7 +286,7 @@
|
|||
</div>
|
||||
</td>
|
||||
|
||||
<td class="w-[1%] px-3 py-3 align-top whitespace-nowrap">
|
||||
<td class="w-44 px-3 py-3 align-top whitespace-nowrap">
|
||||
<div class="flex items-center justify-end gap-2">
|
||||
<UButton
|
||||
color="warning"
|
||||
|
|
|
|||
Loading…
Reference in a new issue