diff --git a/app.qmd b/app.qmd index fce998d..81cdf39 100644 --- a/app.qmd +++ b/app.qmd @@ -79,6 +79,13 @@ chart = { const margin = {top: 40, right: 20, bottom: 40, left: 40}; const innerWidth = width - margin.left - margin.right; const innerHeight = height - margin.top - margin.bottom; + // Set container width to match SVG plot width + container.style("max-width", `${width}px`).style("width", "100%"); + // Set controls container width to match SVG plot width + controlsContainer.style("max-width", `${width}px`).style("width", "100%"); + // Distribute each control evenly and make sliders full-width + controlsContainer.selectAll("div").style("flex", "1").style("min-width", "0px"); + controlsContainer.selectAll("input").style("width", "100%").style("box-sizing", "border-box"); // Create scales const x = d3.scaleLinear()