Refactor to reduce lines

This commit is contained in:
2026-02-18 00:27:59 +00:00
parent a943bf7166
commit 89a76c8b6d
6 changed files with 596 additions and 816 deletions

View File

@@ -27,74 +27,63 @@
<script src="{% static 'js/gridstack-all.js' %}"></script>
<script defer src="{% static 'js/magnet.min.js' %}"></script>
<script>
document.addEventListener("restore-scroll", function(event) {
var scrollpos = localStorage.getItem('scrollpos');
document.addEventListener("restore-scroll", function () {
var scrollpos = localStorage.getItem("scrollpos");
if (scrollpos) {
window.scrollTo(0, scrollpos)
};
window.scrollTo(0, scrollpos);
}
});
document.addEventListener("htmx:beforeSwap", function(event) {
localStorage.setItem('scrollpos', window.scrollY);
document.addEventListener("htmx:beforeSwap", function () {
localStorage.setItem("scrollpos", window.scrollY);
});
</script>
<script>
document.addEventListener('DOMContentLoaded', () => {
// Get all "navbar-burger" elements
const $navbarBurgers = Array.prototype.slice.call(document.querySelectorAll('.navbar-burger'), 0);
// Add a click event on each of them
$navbarBurgers.forEach( el => {
el.addEventListener('click', () => {
// Get the target from the "data-target" attribute
const target = el.dataset.target;
const $target = document.getElementById(target);
// Toggle the "is-active" class on both the "navbar-burger" and the "navbar-menu"
el.classList.toggle('is-active');
$target.classList.toggle('is-active');
document.addEventListener("DOMContentLoaded", function () {
document.querySelectorAll(".navbar-burger").forEach(function (el) {
el.addEventListener("click", function () {
var target = document.getElementById(el.dataset.target);
el.classList.toggle("is-active");
if (target) {
target.classList.toggle("is-active");
}
});
});
const composeLink = document.getElementById('nav-compose-link');
const composeDropdown = document.getElementById('nav-compose-contacts');
let composePreviewLoaded = false;
let composePreviewLoading = false;
if (composeLink && composeDropdown) {
composeLink.addEventListener('mouseenter', () => {
const previewUrl = composeLink.dataset.previewUrl || '';
if (!previewUrl || composePreviewLoaded || composePreviewLoading) {
return;
}
composePreviewLoading = true;
fetch(previewUrl, {
method: 'GET',
credentials: 'same-origin',
headers: { 'HX-Request': 'true' },
})
.then((response) => {
var composeLink = document.getElementById("nav-compose-link");
var composeDropdown = document.getElementById("nav-compose-contacts");
var composePreviewLoaded = false;
var composePreviewLoading = false;
if (!composeLink || !composeDropdown) {
return;
}
composeLink.addEventListener("mouseenter", function () {
var previewUrl = composeLink.dataset.previewUrl || "";
if (!previewUrl || composePreviewLoaded || composePreviewLoading) {
return;
}
composePreviewLoading = true;
fetch(previewUrl, {
method: "GET",
credentials: "same-origin",
headers: { "HX-Request": "true" },
})
.then(function (response) {
if (!response.ok) {
throw new Error('Failed contacts preview fetch.');
throw new Error("Failed contacts preview fetch.");
}
return response.text();
})
.then((html) => {
.then(function (html) {
composeDropdown.innerHTML = html;
composePreviewLoaded = true;
})
.catch(() => {
.catch(function () {
composePreviewLoaded = false;
})
.finally(() => {
.finally(function () {
composePreviewLoading = false;
});
});
}
});
});
</script>
<style>
@@ -112,9 +101,7 @@
opacity:0;
transition: opacity 500ms ease-in;
}
.htmx-request .htmx-indicator{
opacity:1
}
.htmx-request .htmx-indicator,
.htmx-request.htmx-indicator{
opacity:1
}
@@ -142,15 +129,11 @@
transition: all 0.2s ease-in-out;
}
tr:hover {
cursor:pointer;
background-color:rgba(221, 224, 255, 0.3) !important;
}
a.panel-block {
transition: all 0.2s ease-in-out;
}
tr:hover,
a.panel-block:hover {
cursor:pointer;
background-color:rgba(221, 224, 255, 0.3) !important;
@@ -180,11 +163,9 @@
}
.panel, .box, .modal {
/* background-color:rgba(250, 250, 250, 0.5) !important; */
background-color: var(--modal-color) !important;
}
.modal, .modal.box{
/* background-color:rgba(210, 210, 210, 0.9) !important; */
background-color: var(--background-color) !important;
}
.modal-background{
@@ -218,7 +199,8 @@
background-color:rgba(0, 0, 0, 0.03) !important;
}
.grid-stack-item-content {
.grid-stack-item-content,
.floating-window {
display: flex !important;
flex-direction: column !important;
overflow-x: hidden !important;
@@ -239,11 +221,6 @@
}
.floating-window {
/* background-color:rgba(210, 210, 210, 0.6) !important; */
display: flex !important;
flex-direction: column !important;
overflow-x: hidden !important;
overflow-y: hidden !important;
max-height: 300px;
z-index: 9000;
position: absolute;
@@ -257,8 +234,7 @@
.float-right {
float: right;
padding-right: 5px;
padding-left: 5px;
padding: 0 5px;
}
.grid-stack-item:hover .ui-resizable-handle {
display: block !important;