Bugfixes (Resize observer)

This commit is contained in:
Simon Martens
2022-11-30 20:51:18 +01:00
parent c9f56d2ac6
commit 84357507c5
9 changed files with 67 additions and 24 deletions

View File

@@ -193,7 +193,7 @@
}
.ha-text .ha-btn-collapsed-box {
@apply absolute left-full ml-4 desktop:ml-[3.4rem] hidden md:inline-block cursor-pointer leading-none mt-0.5
@apply absolute left-full ml-4 desktop:ml-[1.7rem] hidden md:inline-block cursor-pointer leading-none mt-[0.2rem]
}
.ha-defaulttab .ha-hands {

File diff suppressed because one or more lines are too long

View File

@@ -1,21 +1,26 @@
// // Code specifically for the letter view
let activetab = null;
let activetabbtn = null;
let activetabbtn2 = null;
let tabbtnlist = document.querySelectorAll(".ha-tabbtn");
let tablist = document.querySelectorAll(".ha-tab");
for (let i = 0; i < tabbtnlist.length; i++) {
tablist[i].classList.add("hidden");
tablist[i % tablist.length].classList.add("hidden");
tabbtnlist[i].addEventListener("click", () => {
if (activetab != null)
activetab.classList.add("hidden");
if (activetabbtn != null)
if (activetabbtn != null)
activetabbtn.classList.remove("active");
if (activetabbtn2 != null)
activetabbtn2.classList.remove("active");
tablist[i].classList.remove("hidden");
tablist[i % tablist.length].classList.remove("hidden");
tabbtnlist[i].classList.add("active");
activetab = tablist[i];
tabbtnlist[(i + tablist.length) % tabbtnlist.length].classList.add("active");
activetab = tablist[i % tablist.length];
activetabbtn = tabbtnlist[i];
activetabbtn2 = tabbtnlist[(i + tablist.length) % tabbtnlist.length];
});
}

View File

@@ -115,14 +115,14 @@ const overlappingcollapsebox = function (selector, hoverfunction) {
let lines = Math.floor(eh / lineheight);
let cutoff = Math.floor((h - newlength) / lineheight);
m.style.cssText += "-webkit-line-clamp: " + (lines - cutoff) + ";";
m.style.cssText += "line-clamp: " + (lines - cutoff) + ";";
}
}
}
requestAnimationFrame(() => {
collapsedboxes.push(element);
collapsebox(element, newlength, lineheight);
});
requestAnimationFrame(() => {
addbuttoncaollapsebox(element, newlength, hoverfunction);
});
}
@@ -155,11 +155,36 @@ const collapseboxes = function () {
overlappingcollapsebox(".ha-text .ha-marginalbox", true);
};
var collapsedboxes = [];
const clearcollapsedboxes = function () {
var elements = document.querySelectorAll(".ha-text .ha-marginalbox");
elements.forEach(element => {
element.removeAttribute("style");
});
collapsedboxes.forEach(element => {
element.classList.remove("ha-expanded-box");
element.classList.remove("ha-collapsed-box");
element.outerHTML = element.outerHTML;
});
collapsedboxes = [];
var elements = document.querySelectorAll(".ha-btn-collapsed-box");
elements.forEach(element => {
element.remove();
});
}
const resetall = function() {
clearcollapsedboxes();
marginalboxwidthset();
collapseboxes();
}
marginalboxwidthset();
collapseboxes();
// var doit;
// this.window.addEventListener("resize", function () {
// this.clearTimeout(doit);
// marginalboxwidthset();
// doit = this.setTimeout(collapseboxes, 250);
// });
var doit;
this.window.addEventListener("resize", function () {
this.clearTimeout(doit);
doit = this.setTimeout(resetall, 250);
});