add flash script to login + enhance style

This commit is contained in:
BlasenhauerJ 2022-12-05 16:50:06 +01:00
parent 6f5aab11d4
commit 0bd6d56551
4 changed files with 49 additions and 25 deletions

View File

@ -2071,6 +2071,11 @@ h6 {
padding-right: 0.25rem;
}
.py-4 {
padding-top: 1rem;
padding-bottom: 1rem;
}
.px-0 {
padding-left: 0px;
padding-right: 0px;
@ -2106,11 +2111,6 @@ h6 {
padding-bottom: 1.5rem;
}
.py-4 {
padding-top: 1rem;
padding-bottom: 1rem;
}
.px-0\.5 {
padding-left: 0.125rem;
padding-right: 0.125rem;
@ -2148,14 +2148,6 @@ h6 {
padding-top: 0.25rem;
}
.pt-4 {
padding-top: 1rem;
}
.pb-3 {
padding-bottom: 0.75rem;
}
.pl-0 {
padding-left: 0px;
}
@ -2184,6 +2176,10 @@ h6 {
padding-left: 1rem;
}
.pt-4 {
padding-top: 1rem;
}
.pt-3 {
padding-top: 0.75rem;
}
@ -2212,6 +2208,10 @@ h6 {
padding-top: 1.25rem;
}
.pb-3 {
padding-bottom: 0.75rem;
}
.text-left {
text-align: left;
}
@ -2484,16 +2484,6 @@ 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);
}
.brightness-90 {
--tw-brightness: brightness(.9);
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);
}
.brightness-95 {
--tw-brightness: brightness(.95);
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);
}
.filter {
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);
}

View File

@ -199,7 +199,41 @@
}
}
class FlashMsg {
constructor() {
this.delayBeforeRemove = 8000;
this.init();
}
//remove flash message after this.delay if exist
init() {
window.addEventListener("DOMContentLoaded", () => {
try {
const flashEl = document.querySelector("[flash-message]");
setTimeout(() => {
try {
flashEl.remove();
} catch (err) {}
}, this.delayBeforeRemove);
} catch (err) {}
});
window.addEventListener("click", (e) => {
try {
if (
e.target.closest("button").hasAttribute("close-flash-message")
) {
const closeBtn = e.target.closest("button");
const flashEl = closeBtn.closest("[flash-message]");
flashEl.remove();
}
} catch (err) {}
});
}
}
const setLoader = new Loader();
const setFlash = new FlashMsg();
tsParticles.loadJSON("particles-js", "json/particles.json");
</script>
</body>

View File

@ -437,7 +437,7 @@
<div class="w-full">
<a
href="logout"
class="dark:brightness-125 hover:brightness-75 w-full inline-block px-6 py-3 font-bold text-center text-white uppercase align-middle transition-all rounded-lg cursor-pointer bg-gradient-to-tl bg-primary leading-normal text-xs ease-in tracking-tight-rem shadow-xs bg-150 bg-x-25 hover:-translate-y-px active:opacity-85 hover:shadow-md"
class="tracking-wide dark:brightness-125 hover:brightness-75 w-full inline-block px-6 py-3 font-bold text-center text-white uppercase align-middle transition-all rounded-lg cursor-pointer bg-gradient-to-tl bg-primary leading-normal text-xs ease-in shadow-xs bg-150 bg-x-25 hover:-translate-y-px active:opacity-85 hover:shadow-md"
>
Logout
</a>

View File

@ -156,7 +156,7 @@
type="submit"
formtarget="_blank"
type="button"
class="dark:brightness-125 hover:brightness-75 w-full inline-block px-6 py-3 font-bold text-center text-white uppercase align-middle transition-all rounded-lg cursor-pointer bg-gradient-to-tl bg-primary leading-normal text-xs ease-in tracking-tight-rem shadow-xs bg-150 bg-x-25 hover:-translate-y-px active:opacity-85 hover:shadow-md"
class="dark:brightness-125 hover:brightness-75 w-full inline-block px-6 py-3 font-bold text-center text-white uppercase align-middle transition-all rounded-lg cursor-pointer bg-gradient-to-tl bg-primary leading-normal text-xs ease-in tracking-wide shadow-xs bg-150 bg-x-25 hover:-translate-y-px active:opacity-85 hover:shadow-md"
>
Subscribe
</button>