Graphics distort when the window aspect ratio is too big

[Babygogogo]

There is a resize() function in main.ts in Puzzling Potions as below: /** Set up a resize function for the app */ function resize(): void { const windowWidth = window.innerWidth; const windowHeight = window.innerHeight; const minWidth = 375; const minHeight = 700;

// Calculate renderer and canvas sizes based on current dimensions
const scaleX = windowWidth < minWidth ? minWidth / windowWidth : 1;
const scaleY = windowHeight < minHeight ? minHeight / windowHeight : 1;
const scale = scaleX > scaleY ? scaleX : scaleY;
const width = windowWidth * scale;
const height = windowHeight * scale;

// Update canvas style dimensions and scroll window up to avoid issues on mobile resize
app.renderer.canvas.style.width = `${windowWidth}px`;
app.renderer.canvas.style.height = `${windowHeight}px`;
window.scrollTo(0, 0);

// Update renderer  and navigation screens dimensions
app.renderer.resize(width, height);
navigation.resize(width, height);

}

It works fine in most common cases. However, I find that the game graphics distorts as the screenshot when the calculated width in resize() is larger than 8192. The billboard is not centered, and the top-right settings button disappears. It looks like the game screen is stretched horizontally beyond the window. Is it a bug of pixi or the game? Is there any work around?

I was using pixi.js 8.2.2, the latest version by far.