add popup darkmode

This commit is contained in:
BlasenhauerJ 2023-04-26 15:20:10 +02:00
parent 3a4a6ee5f2
commit 8a5836dd95
3 changed files with 21 additions and 6 deletions

View File

@ -3038,6 +3038,16 @@ h6 {
color: rgb(245 57 57 / var(--tw-text-opacity));
}
.dark .dark\:text-gray-50 {
--tw-text-opacity: 1;
color: rgb(248 249 250 / var(--tw-text-opacity));
}
.dark .dark\:text-gray-100 {
--tw-text-opacity: 1;
color: rgb(235 239 244 / var(--tw-text-opacity));
}
.dark .dark\:opacity-50 {
opacity: 0.5;
}
@ -3095,6 +3105,11 @@ h6 {
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.dark .dark\:brightness-75 {
--tw-brightness: brightness(.75);
filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
}
.dark .dark\:checked\:border-primary:checked {
--tw-border-opacity: 1;
border-color: rgb(8 85 119 / var(--tw-border-opacity));

View File

@ -251,8 +251,8 @@ class DisabledPop {
const popupHTML = `
<div data-disabled-info class="${
type === "select" ? "translate-y-2" : ""
} bg-blue-500 absolute right-2 rounded-lg px-2 py-1 z-20">
<p class="m-0 text-xs text-white">disabled by ${method}</p>
} bg-blue-500 absolute right-2 rounded-lg px-2 py-1 z-20 dark:brightness-90">
<p class="m-0 text-xs text-white dark:text-gray-100">disabled by ${method}</p>
</div>`;
el.insertAdjacentHTML("beforebegin", popupHTML);
}

View File

@ -50,10 +50,10 @@ data-plugin-item="{{plugin['id']}}"
/>
</svg>
<!-- popover -->
<div class="hidden transition z-50 rounded-md p-3 left-0 -translate-y-7 bottom-0 absolute bg-blue-500"
<div class="dark:brightness-90 hidden transition z-50 rounded-md p-3 left-0 -translate-y-7 bottom-0 absolute bg-blue-500"
data-popover-content="{{ value["label"] }}"
>
<p class="transition duration-300 ease-in-out dark:opacity-90 font-bold text-sm text-white m-0" >{{value['help']}}
<p class="transition duration-300 ease-in-out dark:opacity-90 font-bold text-sm text-white dark:text-gray-100 m-0" >{{value['help']}}
</p>
</div>
<!-- end popover -->
@ -276,10 +276,10 @@ data-plugin-item="{{plugin['id']}}"
/>
</svg>
<!-- popover -->
<div class="hidden transition z-50 rounded-md p-3 left-0 -translate-y-7 bottom-0 absolute bg-blue-500"
<div class="dark:brightness-80 hidden transition z-50 rounded-md p-3 left-0 -translate-y-7 bottom-0 absolute bg-blue-500"
data-popover-content="{{ value["label"] }}"
>
<p class="transition duration-300 ease-in-out dark:opacity-90 font-bold text-sm text-white m-0" >{{value['help']}}
<p class="transition duration-300 ease-in-out dark:opacity-90 font-bold text-sm text-white dark:text-gray-100 m-0" >{{value['help']}}
</p>
</div>
<!-- end popover -->