danvics/ytptube
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions 1

refactor: use static width for table cells.

Browse source
This commit is contained in:
arabcoders 2026-03-31 18:34:59 +03:00
parent 90ebf44ad4
commit ca03bf716b
13 changed files with 46 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

6
.vscode/launch.json vendored
View file

@ -2,7 +2,7 @@
"version": "0.2.0", "version": "0.2.0",
"configurations": [ "configurations": [
{ {
"name": "Node: Nuxt3", "name": "UI: Dev",
"request": "launch", "request": "launch",
"runtimeArgs": [ "runtimeArgs": [
"run", "run",
@ -21,7 +21,7 @@
"outputCapture": "std" "outputCapture": "std"
}, },
{ {
"name": "Python: main.py ", "name": "Python: main.py",
"type": "debugpy", "type": "debugpy",
"request": "launch", "request": "launch",
"program": "app/main.py", "program": "app/main.py",
@ -38,7 +38,7 @@
}, },
}, },
{ {
"name": "Node: Generate UI", "name": "UI: Generate",
"request": "launch", "request": "launch",
"runtimeArgs": [ "runtimeArgs": [
"run", "run",

14
ui/app/components/History.vue
View file

@ -52,10 +52,10 @@
class="w-full min-w-0 max-w-full overflow-hidden rounded-lg border border-default bg-default" 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"> <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"> <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"> <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"> <button type="button" class="cursor-pointer" @click="toggleMasterSelection">
<UIcon <UIcon
:name="masterSelectAll ? 'i-lucide-square' : 'i-lucide-check'" :name="masterSelectAll ? 'i-lucide-square' : 'i-lucide-check'"
@ -64,10 +64,10 @@
</button> </button>
</th> </th>
<th class="text-left">Title</th> <th class="text-left">Title</th>
<th class="w-[7%]">Status</th> <th class="w-32 whitespace-nowrap">Status</th>
<th class="w-[7%]">Created</th> <th class="w-36 whitespace-nowrap">Created</th>
<th class="w-[7%]">Size/Starts</th> <th class="w-36 whitespace-nowrap">Size/Starts</th>
<th class="w-[8%]">Actions</th> <th class="w-44 whitespace-nowrap">Actions</th>
</tr> </tr>
</thead> </thead>
@ -211,7 +211,7 @@
</template> </template>
</td> </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"> <div class="flex items-center justify-end gap-1">
<UButton <UButton
v-if="!item.filename" v-if="!item.filename"

12
ui/app/components/Queue.vue
View file

@ -48,10 +48,10 @@
class="w-full min-w-0 max-w-full overflow-hidden rounded-lg border border-default bg-default" 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"> <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"> <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"> <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"> <button type="button" class="cursor-pointer" @click="toggleMasterSelection">
<UIcon <UIcon
:name="masterSelectAll ? 'i-lucide-square' : 'i-lucide-check'" :name="masterSelectAll ? 'i-lucide-square' : 'i-lucide-check'"
@ -61,9 +61,9 @@
</th> </th>
<th class="w-full text-left">Video Title</th> <th class="w-full text-left">Video Title</th>
<th class="w-56">Progress</th> <th class="w-56">Progress</th>
<th class="w-[15%]">Status</th> <th class="w-32 whitespace-nowrap">Status</th>
<th class="w-[15%]">Created</th> <th class="w-36 whitespace-nowrap">Created</th>
<th class="w-[1%]">Actions</th> <th class="w-44 whitespace-nowrap">Actions</th>
</tr> </tr>
</thead> </thead>
@ -194,7 +194,7 @@
</UTooltip> </UTooltip>
</td> </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"> <div class="flex items-center justify-end gap-1">
<UButton <UButton
color="warning" color="warning"

2
ui/app/components/TaskDefinitionEditor.vue
View file

@ -429,7 +429,7 @@
class="w-full min-w-0 max-w-full overflow-hidden rounded-lg border border-default bg-default" 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"> <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"> <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"> <tr class="text-left [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
<th class="w-40"> <th class="w-40">

12
ui/app/components/YTDLPOptions.vue
View file

@ -122,7 +122,7 @@
<table class="min-w-180 w-full table-auto text-sm"> <table class="min-w-180 w-full table-auto text-sm">
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned"> <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"> <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> <th>Description</th>
</tr> </tr>
</thead> </thead>
@ -132,7 +132,7 @@
:key="opt.flags.join('|')" :key="opt.flags.join('|')"
class="align-top hover:bg-muted/20" 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 items-start gap-2">
<div class="flex flex-wrap gap-1.5"> <div class="flex flex-wrap gap-1.5">
<UBadge <UBadge
@ -186,8 +186,8 @@
<table class="min-w-215 w-full table-auto text-sm"> <table class="min-w-215 w-full table-auto text-sm">
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned"> <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"> <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 class="w-[1%] whitespace-nowrap">Group</th> <th class="w-36 whitespace-nowrap">Group</th>
<th>Description</th> <th>Description</th>
</tr> </tr>
</thead> </thead>
@ -197,7 +197,7 @@
:key="opt.flags.join('|')" :key="opt.flags.join('|')"
class="align-top hover:bg-muted/20" 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 items-start gap-2">
<div class="flex flex-wrap gap-1.5"> <div class="flex flex-wrap gap-1.5">
<UBadge <UBadge
@ -227,7 +227,7 @@
</UTooltip> </UTooltip>
</div> </div>
</td> </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' }} {{ opt.group || 'root' }}
</td> </td>
<td class="px-3 py-3 align-top text-default"> <td class="px-3 py-3 align-top text-default">

8
ui/app/pages/browser/[...slug].vue
View file

@ -191,7 +191,7 @@
class="ml-1 inline-flex size-3.5" class="ml-1 inline-flex size-3.5"
/> />
</th> </th>
<th class="w-[1%] whitespace-nowrap"> <th class="w-28 whitespace-nowrap">
Size Size
<UIcon <UIcon
v-if="sort_by === 'size'" v-if="sort_by === 'size'"
@ -199,7 +199,7 @@
class="ml-1 inline-flex size-3.5" class="ml-1 inline-flex size-3.5"
/> />
</th> </th>
<th class="w-[1%] whitespace-nowrap"> <th class="w-40 whitespace-nowrap">
Date Date
<UIcon <UIcon
v-if="sort_by === 'date'" v-if="sort_by === 'date'"
@ -207,7 +207,7 @@
class="ml-1 inline-flex size-3.5" class="ml-1 inline-flex size-3.5"
/> />
</th> </th>
<th v-if="controlEnabled" class="w-[1%]">Actions</th> <th v-if="controlEnabled" class="w-80 whitespace-nowrap">Actions</th>
</tr> </tr>
</thead> </thead>
@ -271,7 +271,7 @@
</UTooltip> </UTooltip>
</td> </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"> <div class="flex items-center justify-end gap-2">
<UButton <UButton
color="warning" color="warning"

4
ui/app/pages/conditions.vue
View file

@ -93,7 +93,7 @@
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned"> <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"> <tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
<th class="w-full text-left">Condition</th> <th class="w-full text-left">Condition</th>
<th class="w-[1%]">Actions</th> <th class="w-44 whitespace-nowrap">Actions</th>
</tr> </tr>
</thead> </thead>
@ -146,7 +146,7 @@
</div> </div>
</td> </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"> <div class="flex items-center justify-end gap-2">
<UButton <UButton
color="info" color="info"

2
ui/app/pages/console.vue
View file

@ -151,7 +151,7 @@
</td> </td>
<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 <UButton
color="error" color="error"

4
ui/app/pages/dl_fields.vue
View file

@ -93,7 +93,7 @@
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned"> <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"> <tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
<th class="w-full text-left">Field</th> <th class="w-full text-left">Field</th>
<th class="w-[1%]">Actions</th> <th class="w-44 whitespace-nowrap">Actions</th>
</tr> </tr>
</thead> </thead>
@ -126,7 +126,7 @@
</div> </div>
</td> </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"> <div class="flex items-center justify-end gap-2">
<UButton <UButton
color="info" color="info"

4
ui/app/pages/notifications.vue
View file

@ -106,7 +106,7 @@
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned"> <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"> <tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
<th class="w-full text-left">Targets</th> <th class="w-full text-left">Targets</th>
<th class="w-[1%]">Actions</th> <th class="w-44 whitespace-nowrap">Actions</th>
</tr> </tr>
</thead> </thead>
@ -159,7 +159,7 @@
</div> </div>
</td> </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"> <div class="flex items-center justify-end gap-2">
<UButton <UButton
color="info" color="info"

4
ui/app/pages/presets.vue
View file

@ -85,7 +85,7 @@
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned"> <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"> <tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
<th class="w-full text-left">Preset</th> <th class="w-full text-left">Preset</th>
<th class="w-[1%]">Actions</th> <th class="w-44 whitespace-nowrap">Actions</th>
</tr> </tr>
</thead> </thead>
@ -114,7 +114,7 @@
</div> </div>
</td> </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"> <div class="flex items-center justify-end gap-2">
<UButton <UButton
color="info" color="info"

8
ui/app/pages/task_definitions.vue
View file

@ -102,9 +102,9 @@
<thead class="bg-muted/40 text-xs uppercase tracking-wide text-toned"> <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"> <tr class="text-center [&>th]:px-3 [&>th]:py-3 [&>th]:font-semibold">
<th class="w-full text-left">Definition</th> <th class="w-full text-left">Definition</th>
<th class="w-[18%]">Priority</th> <th class="w-28 whitespace-nowrap">Priority</th>
<th class="w-[18%]">Updated</th> <th class="w-36 whitespace-nowrap">Updated</th>
<th class="w-[1%]">Actions</th> <th class="w-44 whitespace-nowrap">Actions</th>
</tr> </tr>
</thead> </thead>
@ -158,7 +158,7 @@
</UTooltip> </UTooltip>
</td> </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"> <div class="flex items-center justify-end gap-2">
<UButton <UButton
color="info" color="info"

12
ui/app/pages/tasks.vue
View file

@ -116,10 +116,10 @@
class="w-full min-w-0 max-w-full overflow-hidden rounded-lg border border-default bg-default" 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"> <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"> <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"> <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"> <button type="button" class="cursor-pointer" @click="toggleMasterSelection">
<UIcon <UIcon
:name="allSelected ? 'i-lucide-square' : 'i-lucide-square-check-big'" :name="allSelected ? 'i-lucide-square' : 'i-lucide-square-check-big'"
@ -128,8 +128,8 @@
</button> </button>
</th> </th>
<th class="w-full text-left">Task</th> <th class="w-full text-left">Task</th>
<th class="w-[18%]">Timer</th> <th class="w-100 whitespace-nowrap">Timer</th>
<th class="w-[1%]">Actions</th> <th class="w-44 whitespace-nowrap">Actions</th>
</tr> </tr>
</thead> </thead>
@ -146,7 +146,7 @@
</label> </label>
</td> </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="flex items-start justify-between gap-3">
<div class="min-w-0 flex-1 space-y-2"> <div class="min-w-0 flex-1 space-y-2">
<div class="flex items-start gap-2"> <div class="flex items-start gap-2">
@ -286,7 +286,7 @@
</div> </div>
</td> </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"> <div class="flex items-center justify-end gap-2">
<UButton <UButton
color="warning" color="warning"