Smooth Signature widget will not resize when rotated

I am using the Smooth Signature widget and the mobile responsive widget together for a clean looking form on my phone. However, when I rotate my phone from portrait to landscape the signature widget does not resize.

What I have also learned is if I open the form whatever rotation I am in it stays that size... ergo if I open the page in landscape and rotate to portrait its way to big for the screen and if I open it from portrait it's too small if I rotate to landscape.

Any ideas how to fix this... if I refresh the page then I lose the data in the form.

I was able to replicate the issue you are describing. Please give me more time to troubleshoot this problem. I will contact you via thread once I have an update.

Thank you for your patience.

Sorry for the delay. Unfortunately, I was not able to find a solution for the Smooth Signature widget to be responsive. Actually, the media queries CSS is working for the widget. However, there are times that the widget is not adjusting responsively. You need to refresh the form in order for it to display the proper or responsive width.

I suggest you use the E-signature widget instead. After inserting the E-signature widget, please inject this custom CSS into the form:

@media screen and (max-width: 480px){
canvas.jSignature {
width : 100% !important;
}
.signature-pad-wrapper {
width : 100% !important;
}
.signature-line.signature-wrapper {
width : 100% !important;
}
.pad {
width : 100% !important;
}
}

Here's a guide on How-to-Inject-Custom-CSS-Codes. Here's the result:

Hope that helps. Thank you.