rotating yellow selector blocks too much of image

[nanodan]

The rotating yellow sector rect blocks a good chunk of my images (~270x270px) after being selected so that its impossible to see image details and the metadata in infoCard. The rects are dynamically created under a shadowRoot so there's no way i can find to override their properties and adjust them.

[nanodan]

Was able to hack in some JS to modify the style on clicks, if anyone else needs a quick fix:

document.getElementById("elem").addEventListener("click", function(e) {
    var rects = document.getElementById("elem").shadowRoot.getElementById("vis").shadowRoot.getElementById("holder").querySelectorAll("rect")
    for (var i=0; i<rects.length; i++) {
        if (rects[i].className.baseVal === "rotate") {
            rects[i].style.strokeWidth = "0.05px";
            rects[i].style.x = -0.65;
            rects[i].style.y = -0.65;
            rects[i].style.width = 1.23;
            rects[i].style.height = 1.23;
            rects[i].style.stroke = '#ea184d'
        }
    }

[markddesimone]

Thank you! was missing final closing });

		  document.getElementById("elem").addEventListener("click", function(e) {
			var rects = document.getElementById("elem").shadowRoot.getElementById("vis").shadowRoot.getElementById("holder").querySelectorAll("rect")
			for (var i=0; i<rects.length; i++) {
				if (rects[i].className.baseVal === "rotate") {
					rects[i].style.strokeWidth = "0.05px";
					rects[i].style.x = -0.65;
					rects[i].style.y = -0.65;
					rects[i].style.width = 1.23;
					rects[i].style.height = 1.23;
					rects[i].style.stroke = '#ea184d'
				}
			}
		});