Size / width of the widget

[artsported]

Hi
@fabian: First of all, many thanks for this GREAT alternative! Happy to bypass GØØG£€!
I've one question: is it possible to change the width of the widget?
I did not find any clue on the configuration file / options...
When I modify it directly in the <div>, it works until ~350px but I would like to go until 700px
Thanks
Roxane

[fabianwennink]

Hi! Nice to hear you like IconCaptcha. Regarding the width of the captcha, there is currently no way to change the width of the widget. When mentioning you want to change the width to 700px, do you mean the widget or the challenge image?

The challenge image is rendered as a 320px image, and the internal calculations to position the icons are based off of this dimension. This could be made dynamic, but would require some rewriting of the challenge generation process. The widget itself (the 'challenge holder') is set to 330px but can be set to basically any dimension as long as the image still fits inside the container. You can change this by overriding the width with custom CSS (or by changing it in the SCSS file and recompiling it) and set it to 700px, but it would look odd as the challenge is still rendered at 320px and centered in the widget.

[artsported]

Hi Fabian
No I don't need (want...) to change images, just the widget in order to write longer texts...
Thanks for your answer!
Roxane

[fabianwennink]

Hi! If you only want to change the width, you can achieve this by overriding the max-width of the iconcaptcha-widget class.

.iconcaptcha-widget {
    max-width: 700px !important;
}

Or, change the width in the widget CSS source found in the IconCaptcha Widget repository and compile the stylesheet with this change.