feat: theme fix

Signed-off-by: Ameya Shenoy <shenoy.ameya@gmail.com>
This commit is contained in:
Ameya Shenoy 2025-06-07 15:49:11 +05:30
parent 718ade9c5f
commit 93f1ea741d

View file

@ -13,31 +13,25 @@ export function World() {
const randomY = Math.floor(Math.random() * (height - 2 * radius)) + radius;
return [randomX, randomY];
};
const getBgColor = () => {
if (typeof window !== "undefined") {
return getComputedStyle(document.documentElement)
.getPropertyValue("--color-background")
.trim();
}
};
const getFgColor = () => {
if (typeof window !== "undefined") {
return getComputedStyle(document.documentElement)
.getPropertyValue("--color-foreground")
.trim();
}
};
useEffect(() => {
const container = containerRef.current;
const pillTexts: HTMLDivElement[] = [];
let container = containerRef.current;
if (!container) {
return;
}
const width = container.offsetWidth;
const height = container.offsetHeight;
const bgColor = getBgColor();
const fgColor = getFgColor();
const bgColor = getComputedStyle(document.documentElement)
.getPropertyValue("--color-background")
.trim();
const fgColor = getComputedStyle(document.documentElement)
.getPropertyValue("--color-foreground")
.trim();
console.log(resolvedTheme, bgColor, fgColor);
const {
Engine,
@ -51,7 +45,7 @@ export function World() {
} = Matter;
const engine = Engine.create();
engine.gravity.y = 0.3;
engine.enableSleeping = false;
engine.enableSleeping = true;
const render = Render.create({
element: container,
@ -124,7 +118,7 @@ export function World() {
},
});
let pills: Matter.Body[] = [];
const pills: Matter.Body[] = [];
const pillsToRenderInfo = [
{ text: "ENGINEERING MANAGER" },
{ text: "PRINCIPAL ENGINEER" },
@ -165,7 +159,7 @@ export function World() {
);
pills.push(pill);
const text = document.createElement("div");
const text: HTMLDivElement = document.createElement("div");
Object.assign(text.style, {
position: "absolute",
width: `${pillWidth}px`,
@ -179,6 +173,7 @@ export function World() {
pointerEvents: "none",
});
text.innerText = pillText;
pillTexts.push(text);
render.canvas.getContext("2d").measure;
document.body.appendChild(text);
@ -213,6 +208,9 @@ export function World() {
Composite.clear(engine.world);
Engine.clear(engine);
render.canvas.remove();
pillTexts.forEach((pillText) => {
pillText.remove();
});
};
}, [resolvedTheme]);