forked from OpenNeo/impress
Emi Matchu
4c809a5f5f
I guess I deleted this a while ago without really noticing… I think I'd at some point like to replace this with like, the DTI 2020 improved table layout thing, but I figured this would be pretty quick to throw in and make the page not feel like a pain to use lmao
41 lines
1.3 KiB
JavaScript
41 lines
1.3 KiB
JavaScript
import React from "react";
|
|
import ReactDOM from "react-dom";
|
|
|
|
import { AppProvider, ItemPageOutfitPreview } from "./wardrobe-2020";
|
|
|
|
const rootNode = document.querySelector("#outfit-preview-root");
|
|
const itemId = rootNode.getAttribute("data-item-id");
|
|
// TODO: Use the new React 18 APIs instead!
|
|
// eslint-disable-next-line react/no-deprecated
|
|
ReactDOM.render(
|
|
<AppProvider>
|
|
<ItemPageOutfitPreview itemId={itemId} />
|
|
</AppProvider>,
|
|
rootNode,
|
|
);
|
|
|
|
try {
|
|
const tradeHangers = document.querySelector("#trade-hangers");
|
|
const tradeSections = document.querySelectorAll("#trade-hangers p");
|
|
for (const section of tradeSections) {
|
|
const oneLine = parseFloat(getComputedStyle(section)['line-height']);
|
|
const maxHeight = oneLine * 2;
|
|
|
|
if (section.offsetHeight > maxHeight) {
|
|
section.style.maxHeight = `${maxHeight}px`;
|
|
section.setAttribute("data-overflows", "");
|
|
}
|
|
|
|
section.querySelector(".more")?.addEventListener("click", (event) => {
|
|
section.setAttribute("data-showing-more", "");
|
|
section.style.maxHeight = "none";
|
|
});
|
|
|
|
section.querySelector(".less")?.addEventListener("click", (event) => {
|
|
section.removeAttribute("data-showing-more");
|
|
section.style.maxHeight = `${maxHeight}px`;
|
|
});
|
|
}
|
|
} catch (error) {
|
|
console.error("Error applying trade list more/less toggle", error);
|
|
}
|