70 lines
2.0 KiB
JavaScript
70 lines
2.0 KiB
JavaScript
const magneticButtons = document.querySelectorAll(".magnetic");
|
|
|
|
magneticButtons.forEach((button) => {
|
|
button.addEventListener("mousemove", (event) => {
|
|
const rect = button.getBoundingClientRect();
|
|
const x = event.clientX - rect.left - rect.width / 2;
|
|
const y = event.clientY - rect.top - rect.height / 2;
|
|
|
|
button.style.transform = `translate(${x * 0.15}px, ${y * 0.15}px)`;
|
|
});
|
|
|
|
button.addEventListener("mouseleave", () => {
|
|
button.style.transform = "translate(0, 0)";
|
|
});
|
|
});
|
|
|
|
document.querySelectorAll("input").forEach((input) => {
|
|
input.addEventListener("input", () => {
|
|
input.style.boxShadow = "0 0 8px rgba(59, 130, 246, 0.4)";
|
|
|
|
window.clearTimeout(input._loginGlowTimeout);
|
|
input._loginGlowTimeout = window.setTimeout(() => {
|
|
input.style.boxShadow = "";
|
|
}, 250);
|
|
});
|
|
});
|
|
|
|
document.querySelectorAll("form").forEach((form) => {
|
|
form.addEventListener("submit", (event) => {
|
|
const submitter = event.submitter;
|
|
|
|
if (!submitter || submitter.dataset.loadingLabelApplied === "true") {
|
|
return;
|
|
}
|
|
|
|
const loadingLabel = submitter.dataset.loadingLabel;
|
|
|
|
if (loadingLabel) {
|
|
submitter.dataset.loadingLabelApplied = "true";
|
|
submitter.dataset.originalLabel = submitter.innerText;
|
|
submitter.innerText = loadingLabel;
|
|
submitter.style.opacity = "0.7";
|
|
}
|
|
});
|
|
});
|
|
|
|
document.querySelectorAll(".qr-code[data-qr-value]").forEach((container) => {
|
|
const qrValue = container.dataset.qrValue;
|
|
|
|
if (!qrValue) {
|
|
return;
|
|
}
|
|
|
|
if (typeof window.QRCode !== "function") {
|
|
container.textContent = "QR preview could not be loaded.";
|
|
return;
|
|
}
|
|
|
|
container.innerHTML = "";
|
|
|
|
new window.QRCode(container, {
|
|
text: qrValue,
|
|
width: 220,
|
|
height: 220,
|
|
colorDark: "#172033",
|
|
colorLight: "#ffffff",
|
|
correctLevel: window.QRCode.CorrectLevel.M
|
|
});
|
|
});
|