mirror of
https://github.com/bunkerity/bunkerweb
synced 2026-05-24 09:28:37 +00:00
update core templare and fix setup js
*add better svg *fix some color missing *reposition templates to fit new determined data send *fix script error with empty array *remove missing jinja var in limit page that result in error
This commit is contained in:
Jordan Blasenhauer
parent
148b3a9294
commit
9fc7c8de94
11 changed files with 117 additions and 153 deletions
|
|
@ -9,63 +9,20 @@
|
|||
|
||||
<div class="col-span-12 grid grid-cols-12 gap-4">
|
||||
<!-- info-->
|
||||
<div class="col-span-12 grid grid-cols-12 gap-4">
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
|
||||
|
||||
<div class="mx-1 flex justify-start items-center my-4">
|
||||
<p
|
||||
data-info
|
||||
class="transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
></p>
|
||||
</div>
|
||||
<div class="mx-1 flex justify-start items-center my-4">
|
||||
<p
|
||||
data-info
|
||||
class="transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
></p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end info -->
|
||||
|
||||
<div
|
||||
class="h-fit dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 md:col-span-6 2xl:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<!-- text -->
|
||||
<div>
|
||||
<p
|
||||
class="mb-2 font-sans text-sm font-semibold leading-normal uppercase dark:text-white dark:opacity-60"
|
||||
>
|
||||
BAD BEHAVIOR
|
||||
</p>
|
||||
<h5 data-count class="mb-1 font-bold dark:text-white/90"></h5>
|
||||
|
||||
<p class="mb-0 dark:text-white dark:opacity-60">
|
||||
<span class="font-bold leading-normal text-sm text-red-500 mx-0.5"
|
||||
>total ip bans</span
|
||||
>
|
||||
</p>
|
||||
</div>
|
||||
<!-- end text -->
|
||||
<!-- icon -->
|
||||
<div
|
||||
role="img"
|
||||
aria-label="version"
|
||||
class="dark:brightness-90 inline-block w-12 h-12 text-center rounded-circle bg-red-500"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
class="stroke-none scale-75 leading-none text-lg relative fill-white"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
d="m6.72 5.66 11.62 11.62A8.25 8.25 0 0 0 6.72 5.66Zm10.56 12.68L5.66 6.72a8.25 8.25 0 0 0 11.62 11.62ZM5.105 5.106c3.807-3.808 9.98-3.808 13.788 0 3.808 3.807 3.808 9.98 0 13.788-3.807 3.808-9.98 3.808-13.788 0-3.808-3.807-3.808-9.98 0-13.788Z"
|
||||
clip-rule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
<!-- end icon -->
|
||||
</div>
|
||||
|
||||
<div
|
||||
data-fetch-success-show
|
||||
class="hidden 2xl:col-span-4 3xl:col-span-3 w-full md:max-w-[350px] overflow-hidden grid grid-cols-12 max-h-100 sm:max-h-125 col-span-12 p-4 relative break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
|
|
@ -121,11 +78,6 @@
|
|||
value: "{{ plugin['description'] or ''}}",
|
||||
type: "text",
|
||||
},
|
||||
count: {
|
||||
el: document.querySelector("[data-count]"),
|
||||
value: "unknown",
|
||||
type: "text",
|
||||
},
|
||||
items: {
|
||||
el: document.querySelector("[data-item]"),
|
||||
value: [],
|
||||
|
|
@ -134,6 +86,5 @@
|
|||
},
|
||||
});
|
||||
</script>
|
||||
|
||||
{% endblock %}
|
||||
</div>
|
||||
{% endblock %}
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
<h5 class="mb-0 font-bold dark:text-white/90 mr-4">STATUS</h5>
|
||||
<svg
|
||||
data-status-svg
|
||||
class="w-8 h-8"
|
||||
class="w-6 h-6"
|
||||
viewBox="0 0 100 100"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -59,7 +59,7 @@
|
|||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
|
||||
d="M18.364 18.364A9 9 0 0 0 5.636 5.636m12.728 12.728A9 9 0 0 1 5.636 5.636m12.728 12.728L5.636 5.636"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -9,18 +9,16 @@
|
|||
|
||||
<div class="col-span-12 grid grid-cols-12 gap-4">
|
||||
<!-- info-->
|
||||
<div class="col-span-12 grid grid-cols-12 gap-4">
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
|
||||
|
||||
<div class="mx-1 flex justify-start items-center my-4">
|
||||
<p
|
||||
data-info
|
||||
class="transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
></p>
|
||||
</div>
|
||||
<div class="mx-1 flex justify-start items-center my-4">
|
||||
<p
|
||||
data-info
|
||||
class="transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
></p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end info -->
|
||||
|
|
@ -60,7 +58,7 @@
|
|||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
|
||||
d="M18.364 18.364A9 9 0 0 0 5.636 5.636m12.728 12.728A9 9 0 0 1 5.636 5.636m12.728 12.728L5.636 5.636"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -22,42 +22,42 @@
|
|||
></p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- driver-->
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">DB</h5>
|
||||
|
||||
<div class="mx-1 flex justify-start items-center mt-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 dark:opacity-80"
|
||||
>
|
||||
DRIVER
|
||||
<span
|
||||
data-driver
|
||||
class="ml-1 font-semibold transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="mx-1 flex justify-start items-center mt-1 mb-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 dark:opacity-80"
|
||||
>
|
||||
VERSION
|
||||
<span
|
||||
data-version
|
||||
class="ml-1 font-semibold transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end driver -->
|
||||
</div>
|
||||
<!-- end info -->
|
||||
|
||||
<!-- driver-->
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">DB</h5>
|
||||
|
||||
<div class="mx-1 flex justify-start items-center mt-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 dark:opacity-80"
|
||||
>
|
||||
DRIVER
|
||||
<span
|
||||
data-driver
|
||||
class="ml-1 font-semibold transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
<div class="mx-1 flex justify-start items-center mt-1 mb-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 dark:opacity-80"
|
||||
>
|
||||
VERSION
|
||||
<span
|
||||
data-version
|
||||
class="ml-1 font-semibold transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
>
|
||||
</span>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end driver -->
|
||||
|
||||
<div
|
||||
class="h-fit dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 md:col-span-6 2xl:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -58,7 +58,7 @@
|
|||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
|
||||
d="M18.364 18.364A9 9 0 0 0 5.636 5.636m12.728 12.728A9 9 0 0 1 5.636 5.636m12.728 12.728L5.636 5.636"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -8,22 +8,20 @@
|
|||
/>
|
||||
|
||||
<div class="col-span-12 grid grid-cols-12 gap-4">
|
||||
<div class="col-span-12 grid grid-cols-12 gap-4">
|
||||
<!-- info-->
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
|
||||
<!-- info-->
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
|
||||
|
||||
<div class="mx-1 flex justify-start items-center my-4">
|
||||
<p
|
||||
data-info
|
||||
class="transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
></p>
|
||||
</div>
|
||||
<div class="mx-1 flex justify-start items-center my-4">
|
||||
<p
|
||||
data-info
|
||||
class="transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
></p>
|
||||
</div>
|
||||
<!-- end info -->
|
||||
</div>
|
||||
<!-- end info -->
|
||||
<div
|
||||
class="h-fit dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 md:col-span-6 2xl:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
|
|
@ -59,7 +57,7 @@
|
|||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="m9.75 9.75 4.5 4.5m0-4.5-4.5 4.5M21 12a9 9 0 1 1-18 0 9 9 0 0 1 18 0Z"
|
||||
d="M18.364 18.364A9 9 0 0 0 5.636 5.636m12.728 12.728A9 9 0 0 1 5.636 5.636m12.728 12.728L5.636 5.636"
|
||||
/>
|
||||
</svg>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -57,15 +57,11 @@
|
|||
<p
|
||||
data-name="url"
|
||||
class="ml-1 dark:text-gray-400 dark:opacity-80 text-sm col-span-8 m-0 my-1"
|
||||
>
|
||||
{{item['url']}}
|
||||
</p>
|
||||
></p>
|
||||
<p
|
||||
data-name="count"
|
||||
class="ml-1 dark:text-gray-400 dark:opacity-80 text-sm col-span-4 m-0 my-1"
|
||||
>
|
||||
{{item['count']}}
|
||||
</p>
|
||||
></p>
|
||||
</li>
|
||||
</ul>
|
||||
<!-- end list-->
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
<h5 class="mb-0 font-bold dark:text-white/90 mr-4">STATUS</h5>
|
||||
<svg
|
||||
data-status-svg
|
||||
class="w-8 h-8"
|
||||
class="w-6 h-6"
|
||||
viewBox="0 0 100 100"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
|
|
|
|||
|
|
@ -8,22 +8,20 @@
|
|||
/>
|
||||
|
||||
<div class="col-span-12 grid grid-cols-12 gap-4">
|
||||
<div class="col-span-12 grid grid-cols-12 gap-4">
|
||||
<!-- info-->
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
|
||||
<!-- info-->
|
||||
<div
|
||||
class="h-fit transition hover:scale-102 col-span-12 md:col-span-6 2xl:col-span-4 3xl:col-span-3 p-4 relative min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
<h5 class="mb-2 font-bold dark:text-white/90">INFO</h5>
|
||||
|
||||
<div class="mx-1 flex justify-start items-center my-4">
|
||||
<p
|
||||
data-info
|
||||
class="transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
></p>
|
||||
</div>
|
||||
<div class="mx-1 flex justify-start items-center my-4">
|
||||
<p
|
||||
data-info
|
||||
class="transition duration-300 ease-in-out mb-0 font-sans text-sm leading-normal dark:text-gray-500 dark:opacity-80"
|
||||
></p>
|
||||
</div>
|
||||
<!-- end info -->
|
||||
</div>
|
||||
<!-- end info -->
|
||||
<div
|
||||
class="h-fit dark:brightness-110 max-h-none sm:max-h-28 hover:scale-102 transition col-span-12 md:col-span-6 2xl:col-span-4 flex p-4 justify-between w-full shadow-md break-words bg-white dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
>
|
||||
|
|
@ -37,7 +35,7 @@
|
|||
<h5 data-count class="mb-1 font-bold dark:text-white/90"></h5>
|
||||
|
||||
<p class="mb-0 dark:text-white dark:opacity-60">
|
||||
<span class="font-bold leading-normal text-sm text-red-500 mx-0.5"
|
||||
<span class="font-bold leading-normal text-sm text-green-500 mx-0.5"
|
||||
>request passed</span
|
||||
>
|
||||
</p>
|
||||
|
|
@ -49,11 +47,26 @@
|
|||
role="img"
|
||||
class="dark:brightness-90 inline-block w-12 h-12 text-center rounded-circle bg-green-700"
|
||||
>
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
fill="none"
|
||||
viewBox="0 0 24 24"
|
||||
stroke-width="1.5"
|
||||
stroke="currentColor"
|
||||
class="w-6 h-6"
|
||||
>
|
||||
<path
|
||||
stroke-linecap="round"
|
||||
stroke-linejoin="round"
|
||||
d="m4.5 12.75 6 6 9-13.5"
|
||||
/>
|
||||
</svg>
|
||||
|
||||
<svg
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 24 24"
|
||||
fill="currentColor"
|
||||
class="scale-75 leading-none text-lg relative fill-green-700 stroke-white"
|
||||
class="scale-75 leading-none text-lg relative fill-white"
|
||||
>
|
||||
<path
|
||||
fill-rule="evenodd"
|
||||
|
|
|
|||
|
|
@ -31,7 +31,7 @@ class SetupPlugin {
|
|||
*/
|
||||
// Hidden elements that will be shown on success, like ping buttons or list rendering
|
||||
this.showOnSuccessEls = document.querySelectorAll(
|
||||
"[data-fetch-success-show]",
|
||||
"[data-fetch-success-show]"
|
||||
);
|
||||
|
||||
this.init();
|
||||
|
|
@ -77,7 +77,7 @@ class SetupPlugin {
|
|||
],
|
||||
"bg-sky-500 p-4 mb-1 md:mb-3 md:mr-3 z-[1001] flex flex-col fixed bottom-0 right-0 w-full md:w-1/2 max-w-[300px] min-h-20 rounded-lg dark:brightness-110 hover:scale-102 transition shadow-md break-words dark:bg-slate-850 dark:shadow-dark-xl bg-clip-border",
|
||||
"",
|
||||
"",
|
||||
""
|
||||
);
|
||||
|
||||
this.alertCloseEl = this.createEl(
|
||||
|
|
@ -85,7 +85,7 @@ class SetupPlugin {
|
|||
[["data-fetch-close", ""]],
|
||||
"absolute right-7 top-1.5",
|
||||
"",
|
||||
this.alertEl,
|
||||
this.alertEl
|
||||
);
|
||||
|
||||
this.alertCloseIconEl = this.createEl(
|
||||
|
|
@ -96,7 +96,7 @@ class SetupPlugin {
|
|||
],
|
||||
"cursor-pointer fill-white dark:fill-gray-300 dark:opacity-80 absolute h-5 w-5",
|
||||
"",
|
||||
this.alertCloseEl,
|
||||
this.alertCloseEl
|
||||
);
|
||||
|
||||
// Close icon paths
|
||||
|
|
@ -116,7 +116,7 @@ class SetupPlugin {
|
|||
[["data-fetch-status", ""]],
|
||||
"text-lg mb-0 text-white dark:text-gray-300",
|
||||
"Fetching",
|
||||
this.alertEl,
|
||||
this.alertEl
|
||||
);
|
||||
|
||||
this.alertMsgEl = this.createEl(
|
||||
|
|
@ -124,7 +124,7 @@ class SetupPlugin {
|
|||
[["data-fetch-msg", ""]],
|
||||
"text-white dark:text-gray-300 mb-0 text-sm",
|
||||
"Please wait...",
|
||||
this.alertEl,
|
||||
this.alertEl
|
||||
);
|
||||
|
||||
document.body.appendChild(this.alertEl);
|
||||
|
|
@ -154,10 +154,18 @@ class SetupPlugin {
|
|||
// Key of fetch data need to match key of this.data
|
||||
getFetchDataByKey(fetchDataObj) {
|
||||
for (const [key, value] of Object.entries(this.data)) {
|
||||
value["value"] =
|
||||
fetchDataObj[key] == 0
|
||||
? "0"
|
||||
: fetchDataObj[key] || value["value"] || "";
|
||||
// Case list
|
||||
if (Array.isArray(fetchDataObj[key])) {
|
||||
value["value"] = fetchDataObj[key] || value["value"] || "";
|
||||
continue;
|
||||
}
|
||||
// Case number
|
||||
if (!isNaN(fetchDataObj[key])) {
|
||||
value["value"] = fetchDataObj[key] == 0 ? "0" : fetchDataObj[key];
|
||||
continue;
|
||||
}
|
||||
// Others
|
||||
value["value"] = fetchDataObj[key] || value["value"] || "";
|
||||
}
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Reference in a new issue