refactor: move inline class names to css shorthand classes
This commit is contained in:
parent
6ff4bacddf
commit
3acd08d922
@ -45,6 +45,30 @@
|
|||||||
@apply border-none bg-gray-50 dark:bg-neutral-800;
|
@apply border-none bg-gray-50 dark:bg-neutral-800;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.cj-table-header {
|
||||||
|
@apply px-6 py-3 text-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cj-table-header-content {
|
||||||
|
@apply flex justify-between items-center gap-x-2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cj-table-header-content > span {
|
||||||
|
@apply text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-neutral-200 text-nowrap;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cj-table-header-content > svg {
|
||||||
|
@apply size-3.5 ms-1 -me-0.5 text-gray-400 dark:text-neutral-500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cj-table-header-content > svg > path:nth-child(1) {
|
||||||
|
@apply hs-datatable-ordering-desc:text-blue-600 dark:hs-datatable-ordering-desc:text-blue-500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cj-table-header-content > svg > path:nth-child(2) {
|
||||||
|
@apply hs-datatable-ordering-asc:text-blue-600 dark:hs-datatable-ordering-asc:text-blue-500;
|
||||||
|
}
|
||||||
|
|
||||||
.cj-table-footer {
|
.cj-table-footer {
|
||||||
@apply px-6 py-4 gap-3 flex justify-between items-center;
|
@apply px-6 py-4 gap-3 flex justify-between items-center;
|
||||||
}
|
}
|
||||||
|
|||||||
@ -38,86 +38,64 @@
|
|||||||
<table class="cj-table">
|
<table class="cj-table">
|
||||||
<thead class="cj-thead">
|
<thead class="cj-thead">
|
||||||
<tr>
|
<tr>
|
||||||
<th scope="col" class="ps-6 py-3 text-start --exclude-from-ordering">
|
<th scope="col" class="cj-table-header --exclude-from-ordering">
|
||||||
<label for="selectAllBox" class="">
|
<label for="selectAllBox" class="flex">
|
||||||
<input type="checkbox" id="selectAllBox" class="cj-table-checkbox">
|
<input type="checkbox" id="selectAllBox" class="cj-table-checkbox">
|
||||||
<span class="sr-only">Checkbox</span>
|
<span class="sr-only">Checkbox</span>
|
||||||
</label>
|
</label>
|
||||||
</th>
|
</th>
|
||||||
<th scope="col" data-dt-column="name" class="px-6 py-3 text-start">
|
<th scope="col" data-dt-column="name" class="cj-table-header">
|
||||||
<div class="flex justify-between item-center gap-x-2 cursor-pointer">
|
<div class="cj-table-header-content cursor-pointer">
|
||||||
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-neutral-200">
|
<span>Name</span>
|
||||||
Name
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
</span>
|
<path d="m7 15 5 5 5-5"></path><path d="m7 9 5-5 5 5"></path>
|
||||||
<svg class="size-3.5 ms-1 -me-0.5 text-gray-400 dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<path class="hs-datatable-ordering-desc:text-blue-600 dark:hs-datatable-ordering-desc:text-blue-500" d="m7 15 5 5 5-5"></path>
|
|
||||||
<path class="hs-datatable-ordering-asc:text-blue-600 dark:hs-datatable-ordering-asc:text-blue-500" d="m7 9 5-5 5 5"></path>
|
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
</th>
|
</th>
|
||||||
<th scope="col" data-dt-column="url" class="px-6 py-3 text-start">
|
<th scope="col" data-dt-column="url" class="cj-table-header">
|
||||||
<div class="flex justify-between items-center gap-x-2 cursor-pointer">
|
<div class="cj-table-header-content cursor-pointer">
|
||||||
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-neutral-200">
|
<span>URL</span>
|
||||||
URL
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
</span>
|
<path d="m7 15 5 5 5-5"></path><path d="m7 9 5-5 5 5"></path>
|
||||||
<svg class="size-3.5 ms-1 -me-0.5 text-gray-400 dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<path class="hs-datatable-ordering-desc:text-blue-600 dark:hs-datatable-ordering-desc:text-blue-500" d="m7 15 5 5 5-5"></path>
|
|
||||||
<path class="hs-datatable-ordering-asc:text-blue-600 dark:hs-datatable-ordering-asc:text-blue-500" d="m7 9 5-5 5 5"></path>
|
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
</th>
|
</th>
|
||||||
<th scope="col" data-dt-column="channels" class="px-6 py-3 text-start --exclude-from-ordering">
|
<th scope="col" data-dt-column="channels" class="cj-table-header --exclude-from-ordering">
|
||||||
<div class="flex justify-between items-center gap-x-2">
|
<div class="cj-table-header-content">
|
||||||
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-neutral-200">
|
<span>Channels</span>
|
||||||
Channels
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
</th>
|
</th>
|
||||||
<th scope="col" data-dt-column="filters" class="px-6 py-3 text-start --exclude-from-ordering">
|
<th scope="col" data-dt-column="filters" class="cj-table-header --exclude-from-ordering">
|
||||||
<div class="flex justify-between items-center gap-x-2">
|
<div class="cj-table-header-content">
|
||||||
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-neutral-200">
|
<span>Filters</span>
|
||||||
Filters
|
|
||||||
</span>
|
|
||||||
</div>
|
</div>
|
||||||
</th>
|
</th>
|
||||||
<th scope="col" data-dt-column="style" class="px-6 py-3 text-start">
|
<th scope="col" data-dt-column="style" class="cj-table-header">
|
||||||
<div class="flex justify-between items-center gap-x-2 cursor-pointer">
|
<div class="cj-table-header-content cursor-pointer">
|
||||||
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-neutral-200">
|
<span>Style</span>
|
||||||
Style
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
</span>
|
<path d="m7 15 5 5 5-5"></path><path d="m7 9 5-5 5 5"></path>
|
||||||
<svg class="size-3.5 ms-1 -me-0.5 text-gray-400 dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<path class="hs-datatable-ordering-desc:text-blue-600 dark:hs-datatable-ordering-desc:text-blue-500" d="m7 15 5 5 5-5"></path>
|
|
||||||
<path class="hs-datatable-ordering-asc:text-blue-600 dark:hs-datatable-ordering-asc:text-blue-500" d="m7 9 5-5 5 5"></path>
|
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
</th>
|
</th>
|
||||||
<th scope="col" data-dt-column="created_at" class="px-6 py-3 text-start">
|
<th scope="col" data-dt-column="created_at" class="cj-table-header">
|
||||||
<div class="flex justify-between items-center gap-x-2 cursor-pointer">
|
<div class="cj-table-header-content cursor-pointer">
|
||||||
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-neutral-200 text-nowrap">
|
<span>Created at</span>
|
||||||
Created at
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
</span>
|
<path d="m7 15 5 5 5-5"></path><path d="m7 9 5-5 5 5"></path>
|
||||||
<svg class="size-3.5 ms-1 -me-0.5 text-gray-400 dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<path class="hs-datatable-ordering-desc:text-blue-600 dark:hs-datatable-ordering-desc:text-blue-500" d="m7 15 5 5 5-5"></path>
|
|
||||||
<path class="hs-datatable-ordering-asc:text-blue-600 dark:hs-datatable-ordering-asc:text-blue-500" d="m7 9 5-5 5 5"></path>
|
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
</th>
|
</th>
|
||||||
<th scope="col" data-dt-column="active" class="px-6 py-3 text-start">
|
<th scope="col" data-dt-column="active" class="cj-table-header">
|
||||||
<div class="flex justify-between items-center gap-x-2 cursor-pointer">
|
<div class="cj-table-header-content cursor-pointer">
|
||||||
<span class="text-xs font-semibold uppercase tracking-wide text-gray-800 dark:text-neutral-200">
|
<span>Status</span>
|
||||||
Status
|
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
||||||
</span>
|
<path d="m7 15 5 5 5-5"></path><path d="m7 9 5-5 5 5"></path>
|
||||||
<svg class="size-3.5 ms-1 -me-0.5 text-gray-400 dark:text-neutral-500" xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round">
|
|
||||||
<path class="hs-datatable-ordering-desc:text-blue-600 dark:hs-datatable-ordering-desc:text-blue-500" d="m7 15 5 5 5-5"></path>
|
|
||||||
<path class="hs-datatable-ordering-asc:text-blue-600 dark:hs-datatable-ordering-asc:text-blue-500" d="m7 9 5-5 5 5"></path>
|
|
||||||
</svg>
|
</svg>
|
||||||
</div>
|
</div>
|
||||||
</th>
|
</th>
|
||||||
</tr>
|
</tr>
|
||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
|
||||||
|
|
||||||
</tbody>
|
|
||||||
</table>
|
</table>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
@ -186,4 +164,13 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var guildId = "<%- guild.id %>";
|
||||||
|
var channels = JSON.parse(`<%- JSON.stringify(
|
||||||
|
guild.channels.cache
|
||||||
|
.filter(channel => channel.type == 0)
|
||||||
|
.sort((a, b) => a.rawPosition - b.rawPosition)
|
||||||
|
.map(channel => channel.toJSON())
|
||||||
|
) %>`);
|
||||||
|
</script>
|
||||||
<% block("scripts").append('<script src="/static/bundles/guild/feeds.js"></script>'); %>
|
<% block("scripts").append('<script src="/static/bundles/guild/feeds.js"></script>'); %>
|
||||||
Loading…
x
Reference in New Issue
Block a user