mirror of
https://github.com/bunkerity/bunkerized-nginx
synced 2023-12-13 21:30:18 +01:00
enhance responsive + add loader
This commit is contained in:
parent
3bafe137d2
commit
cc748a0480
11 changed files with 160 additions and 69 deletions
|
@ -811,6 +811,14 @@ h6 {
|
|||
z-index: 50;
|
||||
}
|
||||
|
||||
.z-\[1500\] {
|
||||
z-index: 1500;
|
||||
}
|
||||
|
||||
.z-\[10000\] {
|
||||
z-index: 10000;
|
||||
}
|
||||
|
||||
.order-2 {
|
||||
order: 2;
|
||||
}
|
||||
|
@ -1310,6 +1318,10 @@ h6 {
|
|||
width: 20rem;
|
||||
}
|
||||
|
||||
.w-40 {
|
||||
width: 10rem;
|
||||
}
|
||||
|
||||
.min-w-0 {
|
||||
min-width: 0px;
|
||||
}
|
||||
|
@ -1523,6 +1535,10 @@ h6 {
|
|||
grid-template-columns: repeat(2, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.grid-cols-3 {
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
}
|
||||
|
||||
.flex-col {
|
||||
flex-direction: column;
|
||||
}
|
||||
|
@ -2393,6 +2409,10 @@ h6 {
|
|||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.opacity-0 {
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
.shadow-md {
|
||||
--tw-shadow: 0 4px 6px rgba(50,50,93,.1),0 1px 3px rgba(0,0,0,.08);
|
||||
--tw-shadow-colored: 0 4px 6px var(--tw-shadow-color), 0 1px 3px var(--tw-shadow-color);
|
||||
|
@ -2902,11 +2922,6 @@ h6 {
|
|||
border-color: rgb(58 65 111 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:border-slate-850 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(17 28 68 / var(--tw-border-opacity));
|
||||
}
|
||||
|
||||
.dark .dark\:border-gray-700 {
|
||||
--tw-border-opacity: 1;
|
||||
border-color: rgb(73 80 87 / var(--tw-border-opacity));
|
||||
|
@ -3127,6 +3142,10 @@ h6 {
|
|||
grid-column: span 1 / span 1;
|
||||
}
|
||||
|
||||
.sm\:col-span-2 {
|
||||
grid-column: span 2 / span 2;
|
||||
}
|
||||
|
||||
.sm\:col-start-5 {
|
||||
grid-column-start: 5;
|
||||
}
|
||||
|
@ -3165,6 +3184,18 @@ h6 {
|
|||
height: 1.75rem;
|
||||
}
|
||||
|
||||
.sm\:h-16 {
|
||||
height: 4rem;
|
||||
}
|
||||
|
||||
.sm\:h-20 {
|
||||
height: 5rem;
|
||||
}
|
||||
|
||||
.sm\:h-14 {
|
||||
height: 3.5rem;
|
||||
}
|
||||
|
||||
.sm\:max-h-28 {
|
||||
max-height: 7rem;
|
||||
}
|
||||
|
@ -3185,6 +3216,14 @@ h6 {
|
|||
width: 1.75rem;
|
||||
}
|
||||
|
||||
.sm\:w-60 {
|
||||
width: 15rem;
|
||||
}
|
||||
|
||||
.sm\:w-50 {
|
||||
width: 12.5rem;
|
||||
}
|
||||
|
||||
.sm\:flex-row {
|
||||
flex-direction: row;
|
||||
}
|
||||
|
@ -3283,6 +3322,14 @@ h6 {
|
|||
display: none;
|
||||
}
|
||||
|
||||
.md\:h-25 {
|
||||
height: 6.25rem;
|
||||
}
|
||||
|
||||
.md\:h-16 {
|
||||
height: 4rem;
|
||||
}
|
||||
|
||||
.md\:max-h-160 {
|
||||
max-height: 40rem;
|
||||
}
|
||||
|
@ -3295,6 +3342,14 @@ h6 {
|
|||
width: 50%;
|
||||
}
|
||||
|
||||
.md\:w-80 {
|
||||
width: 20rem;
|
||||
}
|
||||
|
||||
.md\:w-60 {
|
||||
width: 15rem;
|
||||
}
|
||||
|
||||
.md\:justify-end {
|
||||
justify-content: flex-end;
|
||||
}
|
||||
|
@ -3391,6 +3446,14 @@ h6 {
|
|||
height: 7.5rem;
|
||||
}
|
||||
|
||||
.lg\:h-20 {
|
||||
height: 5rem;
|
||||
}
|
||||
|
||||
.lg\:h-24 {
|
||||
height: 6rem;
|
||||
}
|
||||
|
||||
.lg\:w-9 {
|
||||
width: 2.25rem;
|
||||
}
|
||||
|
@ -3403,6 +3466,10 @@ h6 {
|
|||
width: 50%;
|
||||
}
|
||||
|
||||
.lg\:w-80 {
|
||||
width: 20rem;
|
||||
}
|
||||
|
||||
.lg\:flex-none {
|
||||
flex: none;
|
||||
}
|
||||
|
@ -3454,6 +3521,10 @@ h6 {
|
|||
top: 0.75rem;
|
||||
}
|
||||
|
||||
.xl\:col-span-4 {
|
||||
grid-column: span 4 / span 4;
|
||||
}
|
||||
|
||||
.xl\:mx-4 {
|
||||
margin-left: 1rem;
|
||||
margin-right: 1rem;
|
||||
|
@ -3514,6 +3585,10 @@ h6 {
|
|||
grid-column: span 4 / span 4;
|
||||
}
|
||||
|
||||
.\32xl\:col-span-6 {
|
||||
grid-column: span 6 / span 6;
|
||||
}
|
||||
|
||||
.\32xl\:my-2 {
|
||||
margin-top: 0.5rem;
|
||||
margin-bottom: 0.5rem;
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import { Checkbox } from "./utils.js";
|
||||
import { Checkbox, Loader } from "./utils.js";
|
||||
|
||||
class Menu {
|
||||
constructor() {
|
||||
|
@ -97,6 +97,7 @@ class FlashMsg {
|
|||
}
|
||||
}
|
||||
|
||||
const setLoader = new Loader();
|
||||
const setMenu = new Menu();
|
||||
const setNews = new News();
|
||||
const setDarkM = new darkMode();
|
||||
|
|
|
@ -403,5 +403,5 @@ class Upload {
|
|||
}
|
||||
|
||||
const setDropdown = new Dropdown("plugins");
|
||||
const setFilter = new Plugins("plugins");
|
||||
const setFilter = new Filter("plugins");
|
||||
const setUpload = new Upload();
|
||||
|
|
|
@ -911,6 +911,44 @@ class FormatValue {
|
|||
});
|
||||
}
|
||||
}
|
||||
|
||||
class Loader {
|
||||
constructor() {
|
||||
this.menuContainer = document.querySelector("[menu-container]");
|
||||
this.logoContainer = document.querySelector("[loader]");
|
||||
this.logoEl = document.querySelector("[loader-img]");
|
||||
this.isLoading = true;
|
||||
this.init();
|
||||
}
|
||||
|
||||
init() {
|
||||
this.loading();
|
||||
window.addEventListener("load", (e) => {
|
||||
setTimeout(() => {
|
||||
this.logoContainer.classList.add("opacity-0");
|
||||
}, 350);
|
||||
|
||||
setTimeout(() => {
|
||||
this.isLoading = false;
|
||||
this.logoContainer.classList.add("hidden");
|
||||
}, 650);
|
||||
|
||||
setTimeout(() => {
|
||||
this.logoContainer.remove();
|
||||
}, 800);
|
||||
});
|
||||
}
|
||||
|
||||
loading() {
|
||||
if ((this.isLoading = true)) {
|
||||
setTimeout(() => {
|
||||
this.logoEl.classList.toggle("scale-105");
|
||||
this.loading();
|
||||
}, 300);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export {
|
||||
Checkbox,
|
||||
Popover,
|
||||
|
@ -921,4 +959,5 @@ export {
|
|||
FolderEditor,
|
||||
FolderDropdown,
|
||||
FormatValue,
|
||||
Loader,
|
||||
};
|
||||
|
|
|
@ -9,10 +9,17 @@
|
|||
<noscript class="relative w-full p-4 text-white bg-yellow-500 rounded-lg"
|
||||
>Your browser does not support JavaScript!</noscript
|
||||
>
|
||||
|
||||
<!--fixed background-->
|
||||
<div class="absolute w-full dark:hidden bg-primary"></div>
|
||||
<!-- end fixed background-->
|
||||
<div
|
||||
loader
|
||||
class="fixed z-[10000] transition duration-300 h-screen w-screen bg-primary flex justify-center align-middle items-center"
|
||||
>
|
||||
<img
|
||||
loader-img
|
||||
src="images/logo-menu-2.png"
|
||||
class="duration-300 w-40 h-12 sm:w-50 sm:h-14 md:w-60 md:h-16 lg:w-80 lg:h-24 inline transition-all"
|
||||
alt="main logo"
|
||||
/>
|
||||
</div>
|
||||
|
||||
{% include "menu.html" %} {% include "news.html" %}
|
||||
|
||||
|
|
|
@ -47,7 +47,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip() %}
|
|||
<!-- filter -->
|
||||
<div
|
||||
{{current_endpoint}}-filter
|
||||
class="col-span-12 md:col-span-8 3xl:col-span-6 p-4 relative flex flex-col min-w-0 break-words bg-white shadow-xl dark:bg-slate-850 dark:shadow-dark-xl rounded-2xl bg-clip-border"
|
||||
class="col-span-12 md:col-span-8 2xl:col-span-6 p-4 relative flex flex-col 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">FILTER</h5>
|
||||
<div class="grid grid-cols-12 gap-x-4 gap-y-2">
|
||||
|
|
|
@ -9,19 +9,15 @@
|
|||
href="data:image/svg+xml, %%3Csvg version='1.0' xmlns='http://www.w3.org/2000/svg' width='96.000000pt' height='96.000000pt' viewBox='0 0 96.000000 96.000000' preserveAspectRatio='xMidYMid meet'%%3E%%3Cg transform='translate(0.000000,96.000000) scale(0.100000,-0.100000)'%%0Afill='%%23085577' stroke='none'%%3E%%3Cpath d='M535 863 c-22 -2 -139 -17 -260 -34 -228 -31 -267 -43 -272 -85 -2%%0A-10 23 -181 55 -379 l57 -360 400 0 400 0 20 40 c16 31 20 59 19 125 -1 100%%0A-24 165 -73 199 -41 29 -46 57 -22 111 30 67 29 188 -3 256 -13 28 -37 60 -53%%0A72 -55 39 -169 62 -268 55z m-15 -348 c30 -16 60 -61 60 -90 0 -10 -8 -33 -17%%0A-52 -16 -34 -16 -41 0 -116 9 -44 15 -82 12 -85 -6 -7 -92 -21 -131 -21 l-31%%0A-1 -6 85 c-4 75 -8 89 -31 112 -20 20 -26 36 -26 70 0 38 5 50 34 79 39 39 86%%0A45 136 19z'/%%3E%%3C/g%%3E%%3C/svg%%3E"
|
||||
type="image/svg+xml"
|
||||
/>
|
||||
<link
|
||||
rel="stylesheet"
|
||||
type="text/css"
|
||||
href="http://127.0.0.1:5501/static/css/dashboard.css"
|
||||
/>
|
||||
<link rel="stylesheet" type="text/css" href="./css/dashboard.css" />
|
||||
</head>
|
||||
<body>
|
||||
<div
|
||||
class="h-screen w-screen bg-primary flex justify-center align-middle items-center"
|
||||
class="fixed h-screen w-screen bg-primary flex justify-center align-middle items-center"
|
||||
>
|
||||
<img
|
||||
src="images/logo-menu-2.png"
|
||||
class="duration-300 w-60 h-16 sm:w-80 sm:h-24 lg:w-90 lg:h-30 inline transition-all"
|
||||
class="duration-300 w-40 h-12 sm:w-50 sm:h-14 md:w-60 md:h-16 lg:w-80 lg:h-24 inline transition-all"
|
||||
alt="main logo"
|
||||
/>
|
||||
</div>
|
||||
|
@ -36,7 +32,7 @@
|
|||
|
||||
async function check_reloading() {
|
||||
const controller = new AbortController();
|
||||
const timeoutId = setTimeout(() => controller.abort(), 3000);
|
||||
const timeoutId = setTimeout(() => controller.abort(), 500);
|
||||
const response = await fetch(
|
||||
`${location.href.replace("/loading", "/check_reloading")}`,
|
||||
{ signal: controller.signal }
|
||||
|
|
|
@ -10,7 +10,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip().replace('_', '-') %}
|
|||
<div class="grid grid-cols-12 gap-x-4 gap-y-2">
|
||||
<!-- select instance -->
|
||||
<div
|
||||
class="flex flex-col relative col-span-12 sm:col-span-6 lg:col-span-4 3xl:col-span-3"
|
||||
class="flex flex-col relative col-span-12 sm:col-span-6 2xl:col-span-4 3xl:col-span-3"
|
||||
>
|
||||
<h5
|
||||
class="my-1 transition duration-300 ease-in-out dark:opacity-90 text-sm sm:text-md font-bold m-0 dark:text-gray-300"
|
||||
|
@ -63,7 +63,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip().replace('_', '-') %}
|
|||
<!-- end select instance -->
|
||||
<!-- from date input -->
|
||||
<div
|
||||
class="flex flex-col relative col-span-12 sm:col-span-6 lg:col-span-4 3xl:col-span-3"
|
||||
class="flex flex-col relative col-span-12 sm:col-span-6 2xl:col-span-4 3xl:col-span-3"
|
||||
>
|
||||
<h5
|
||||
class="my-1 transition duration-300 ease-in-out dark:opacity-90 text-sm sm:text-md font-bold m-0 dark:text-gray-300"
|
||||
|
@ -74,7 +74,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip().replace('_', '-') %}
|
|||
type="text"
|
||||
id="from-date"
|
||||
name="from-date"
|
||||
class="disabled:bg-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 dark:disabled:text-gray-300 disabled:text-gray-700 col-span-12 sm:col-span-6 lg:col-span-4 3xl:col-span-3 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 disabled:opacity-75 focus:valid:border-green-500 focus:invalid:border-red-500 outline-none focus:border-primary text-sm leading-5.6 ease block w-full appearance-none rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-3 py-1 font-normal text-gray-700 transition-all placeholder:text-gray-500"
|
||||
class="disabled:bg-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 dark:disabled:text-gray-300 disabled:text-gray-700 col-span-12 sm:col-span-6 2xl:col-span-4 3xl:col-span-3 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 disabled:opacity-75 focus:valid:border-green-500 focus:invalid:border-red-500 outline-none focus:border-primary text-sm leading-5.6 ease block w-full appearance-none rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-3 py-1 font-normal text-gray-700 transition-all placeholder:text-gray-500"
|
||||
placeholder="dd/mm/yyyy or yyyy/mm/dd"
|
||||
pattern="(.*?)"
|
||||
required
|
||||
|
@ -83,7 +83,7 @@ url_for(request.endpoint)[1:].split("/")[-1].strip().replace('_', '-') %}
|
|||
<!-- end from date input -->
|
||||
<!-- to date input -->
|
||||
<div
|
||||
class="flex flex-col relative col-span-12 sm:col-span-6 lg:col-span-4 3xl:col-span-3"
|
||||
class="flex flex-col relative col-span-12 sm:col-span-6 2xl:col-span-4 3xl:col-span-3"
|
||||
>
|
||||
<h5
|
||||
class="my-1 transition duration-300 ease-in-out dark:opacity-90 text-sm sm:text-md font-bold m-0 dark:text-gray-300"
|
||||
|
@ -94,46 +94,17 @@ url_for(request.endpoint)[1:].split("/")[-1].strip().replace('_', '-') %}
|
|||
type="text"
|
||||
id="to-date"
|
||||
name="to-date"
|
||||
class="disabled:bg-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 dark:disabled:text-gray-300 disabled:text-gray-700 col-span-12 sm:col-span-6 lg:col-span-4 3xl:col-span-3 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 disabled:opacity-75 focus:valid:border-green-500 focus:invalid:border-red-500 outline-none focus:border-primary text-sm leading-5.6 ease block w-full appearance-none rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-3 py-1 font-normal text-gray-700 transition-all placeholder:text-gray-500"
|
||||
class="disabled:bg-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 dark:disabled:text-gray-300 disabled:text-gray-700 col-span-12 sm:col-span-6 2xl:col-span-4 3xl:col-span-3 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 disabled:opacity-75 focus:valid:border-green-500 focus:invalid:border-red-500 outline-none focus:border-primary text-sm leading-5.6 ease block w-full appearance-none rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-3 py-1 font-normal text-gray-700 transition-all placeholder:text-gray-500"
|
||||
placeholder="dd/mm/yyyy or yyyy/mm/dd"
|
||||
pattern="(.*?)"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<!-- end to date input -->
|
||||
<!-- refresh input -->
|
||||
<div
|
||||
class="flex flex-col relative col-span-12 sm:col-span-6 lg:col-span-4 3xl:col-span-3"
|
||||
>
|
||||
<h5
|
||||
class="my-1 transition duration-300 ease-in-out dark:opacity-90 text-sm sm:text-md font-bold m-0 dark:text-gray-300"
|
||||
>
|
||||
Update auto
|
||||
</h5>
|
||||
<div checkbox-handler="live-update" class="relative mb-7 md:mb-0">
|
||||
<input
|
||||
id="live-update"
|
||||
class="relative cursor-pointer dark:border-slate-600 dark:bg-slate-700 z-10 checked:z-0 w-5 h-5 ease text-base rounded-1.4 checked:bg-primary checked:border-primary dark:checked:bg-primary dark:checked:border-primary duration-250 float-left mt-1 appearance-none border border-gray-300 bg-white bg-contain bg-center bg-no-repeat align-top transition-all disabled:bg-gray-400 disabled:border-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 disabled:text-gray-700 dark:disabled:text-gray-300"
|
||||
type="checkbox"
|
||||
pattern=""
|
||||
value="no"
|
||||
/>
|
||||
<svg
|
||||
checkbox-handler="live-update"
|
||||
class="cursor-pointer absolute fill-white dark:fill-gray-300 left-0 top-0 translate-x-1 translate-y-2 h-3 w-3"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
viewBox="0 0 512 512"
|
||||
>
|
||||
<path
|
||||
d="M470.6 105.4c12.5 12.5 12.5 32.8 0 45.3l-256 256c-12.5 12.5-32.8 12.5-45.3 0l-128-128c-12.5-12.5-12.5-32.8 0-45.3s32.8-12.5 45.3 0L192 338.7 425.4 105.4c12.5-12.5 32.8-12.5 45.3 0z"
|
||||
></path>
|
||||
</svg>
|
||||
</div>
|
||||
</div>
|
||||
<!-- end refresh input -->
|
||||
|
||||
<!-- refresh delay input -->
|
||||
<div
|
||||
class="flex flex-col relative col-span-12 sm:col-span-6 lg:col-span-4 3xl:col-span-3"
|
||||
class="flex flex-col relative col-span-12 sm:col-span-6 2xl:col-span-4 3xl:col-span-3"
|
||||
>
|
||||
<h5
|
||||
class="my-1 transition duration-300 ease-in-out dark:opacity-90 text-sm sm:text-md font-bold m-0 dark:text-gray-300"
|
||||
|
@ -144,13 +115,14 @@ url_for(request.endpoint)[1:].split("/")[-1].strip().replace('_', '-') %}
|
|||
type="number"
|
||||
id="update-delay"
|
||||
name="update-delay"
|
||||
class="disabled:bg-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 dark:disabled:text-gray-300 disabled:text-gray-700 col-span-12 sm:col-span-6 lg:col-span-4 3xl:col-span-3 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 disabled:opacity-75 focus:valid:border-green-500 focus:invalid:border-red-500 outline-none focus:border-primary text-sm leading-5.6 ease block w-full appearance-none rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-3 py-1 font-normal text-gray-700 transition-all placeholder:text-gray-500"
|
||||
class="disabled:bg-gray-400 dark:disabled:bg-gray-800 dark:disabled:border-gray-800 dark:disabled:text-gray-300 disabled:text-gray-700 col-span-12 sm:col-span-6 2xl:col-span-4 3xl:col-span-3 dark:border-slate-600 dark:bg-slate-700 dark:text-gray-300 disabled:opacity-75 focus:valid:border-green-500 focus:invalid:border-red-500 outline-none focus:border-primary text-sm leading-5.6 ease block w-full appearance-none rounded-lg border border-solid border-gray-300 bg-white bg-clip-padding px-3 py-1 font-normal text-gray-700 transition-all placeholder:text-gray-500"
|
||||
placeholder="2"
|
||||
pattern="(.*?)"
|
||||
required
|
||||
/>
|
||||
</div>
|
||||
<!-- end refresh delay input -->
|
||||
|
||||
<div class="col-span-12 w-full justify-center flex mt-2">
|
||||
<button
|
||||
type="button"
|
||||
|
|
|
@ -217,7 +217,7 @@ plugins = config["CONFIG"].get_plugins() %}
|
|||
{% for plugin in plugins %} {% if plugin['page'] %}
|
||||
<div
|
||||
{{current_endpoint}}-external="{% if plugin['external'] %} external {%else%} internal {%endif%}"
|
||||
class="py-3 min-h-12 relative col-span-12 sm:col-span-6 md:col-span-4 lg:col-span-3 3xl:col-span-2 p-1 flex justify-between items-center transition rounded bg-gray-100 hover:bg-gray-300 dark:bg-slate-700 dark:hover:bg-slate-800"
|
||||
class="py-3 min-h-12 relative col-span-12 sm:col-span-6 2xl:col-span-4 3xl:col-span-3 p-1 flex justify-between items-center transition rounded bg-gray-100 hover:bg-gray-300 dark:bg-slate-700 dark:hover:bg-slate-800"
|
||||
>
|
||||
<p
|
||||
{{current_endpoint}}-content
|
||||
|
@ -259,11 +259,11 @@ plugins = config["CONFIG"].get_plugins() %}
|
|||
|
||||
<div
|
||||
{{current_endpoint}}-external="{% if plugin['external'] %} external {%else%} internal {%endif%}"
|
||||
class="py-3 min-h-12 relative col-span-12 sm:col-span-6 md:col-span-4 lg:col-span-3 3xl:col-span-2 p-1 flex justify-start items-center transition rounded bg-gray-100 hover:bg-gray-300 dark:bg-slate-700 dark:hover:bg-slate-800"
|
||||
class="py-3 min-h-12 relative col-span-12 sm:col-span-6 2xl:col-span-4 3xl:col-span-3 p-1 flex justify-between items-center transition rounded bg-gray-100 hover:bg-gray-300 dark:bg-slate-700 dark:hover:bg-slate-800"
|
||||
>
|
||||
<p
|
||||
{{current_endpoint}}-content
|
||||
class="ml-3 mb-0 transition duration-300 ease-in-out dark:opacity-90 text-center text-sm md:text-base text-slate-700 dark:text-gray-300"
|
||||
class="ml-3 mb-0 transition duration-300 ease-in-out dark:opacity-90 text-left text-sm md:text-base text-slate-700 dark:text-gray-300"
|
||||
>
|
||||
{{plugin['name']}}
|
||||
</p>
|
||||
|
|
|
@ -37,10 +37,10 @@
|
|||
|
||||
<!-- detail list -->
|
||||
<div
|
||||
class="w-full grid grid-cols-2 justify-items-center sm:justify-items-start gap-2 mt-4 mb-6 ml-3 sm:ml-1"
|
||||
class="w-full grid grid-cols-12 justify-items-center sm:justify-items-start gap-2 mt-4 mb-6 ml-3 sm:ml-1"
|
||||
>
|
||||
<!-- detail -->
|
||||
<div class="flex items-center col-span-2 sm:col-span-1">
|
||||
<div class="flex items-center col-span-12 sm:col-span-6 2xl:col-span-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out dark:opacity-90 font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 "
|
||||
>
|
||||
|
@ -75,7 +75,7 @@
|
|||
</div>
|
||||
<!-- end detail -->
|
||||
<!-- detail -->
|
||||
<div class="flex items-center col-span-2 sm:col-span-1">
|
||||
<div class="flex items-center col-span-12 sm:col-span-6 2xl:col-span-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out dark:opacity-90 font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 "
|
||||
>
|
||||
|
@ -109,7 +109,7 @@
|
|||
</div>
|
||||
<!-- end detail -->
|
||||
<!-- detail -->
|
||||
<div class="flex items-center col-span-2 sm:col-span-1">
|
||||
<div class="flex items-center col-span-12 sm:col-span-6 2xl:col-span-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out dark:opacity-90 font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 "
|
||||
>
|
||||
|
@ -143,7 +143,7 @@
|
|||
</div>
|
||||
<!-- end detail -->
|
||||
<!-- detail -->
|
||||
<div class="flex items-center col-span-2 sm:col-span-1">
|
||||
<div class="flex items-center col-span-12 sm:col-span-6 2xl:col-span-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out dark:opacity-90 font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 "
|
||||
>
|
||||
|
@ -178,7 +178,7 @@
|
|||
</div>
|
||||
<!-- end detail -->
|
||||
<!-- detail -->
|
||||
<div class="flex items-center col-span-2 sm:col-span-1">
|
||||
<div class="flex items-center col-span-12 sm:col-span-6 2xl:col-span-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out dark:opacity-90 font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 "
|
||||
>
|
||||
|
@ -212,7 +212,7 @@
|
|||
</div>
|
||||
<!-- end detail -->
|
||||
<!-- detail -->
|
||||
<div class="flex items-center col-span-2 sm:col-span-1">
|
||||
<div class="flex items-center col-span-12 sm:col-span-6 2xl:col-span-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out dark:opacity-90 font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 "
|
||||
>
|
||||
|
@ -246,7 +246,7 @@
|
|||
</div>
|
||||
<!-- end detail -->
|
||||
<!-- detail -->
|
||||
<div class="flex items-center col-span-2 sm:col-span-1">
|
||||
<div class="flex items-center col-span-12 sm:col-span-6 2xl:col-span-4">
|
||||
<p
|
||||
class="transition duration-300 ease-in-out dark:opacity-90 font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500 "
|
||||
>
|
||||
|
@ -280,7 +280,7 @@
|
|||
</div>
|
||||
<!-- end detail -->
|
||||
<!-- detail -->
|
||||
<div class="flex items-center col-span-2 sm:col-span-1">
|
||||
<div class="flex items-center col-span-12 sm:col-span-6 2xl:col-span-4">
|
||||
<p
|
||||
class="font-bold mb-0 font-sans text-sm leading-normal uppercase dark:text-gray-500"
|
||||
>
|
||||
|
|
|
@ -205,6 +205,7 @@
|
|||
<!-- end plugin settings -->
|
||||
</div>
|
||||
<!-- end plugin settings not multiple -->
|
||||
|
||||
<!-- plugin multiple -->
|
||||
{% if not plugin['multiple'] %}
|
||||
<div class="flex items-center mx-0 sm:mx-4 md:mx-6 md:my-3 my-2 2xl:mx-6 2xl:my-3 col-span-12 ">
|
||||
|
|
Loading…
Reference in a new issue