Options
In this section, we will detail all options available for every elements described in the Look & Feel page of a Privacy request widget.
ComponentOptionValue
ComponentOptionValue corresponds to a CSS property. You can edit the CSS property by adding the value.
fontColor
Color of input value
#000000
, red
, rgb(0, 0, 0)
fontSize
Size of input value
16px
fontWeight
Font weight of input value
600
lineHeight
Line height of input value
18px
borderRadius
Border radius of input
4px
borderColor
Border color of input
#000000
, red
, rgb(0, 0, 0)
borderWidth
Thickness of input border
1px
errorBorderColor
Color of input border when error
#000000
, red
, rgb(0, 0, 0)
placeholderColor
Color of input placeholder
#000000
, red
, rgb(0, 0, 0)
focusShadow
Focus state of input
#000000
, red
, rgb(0, 0, 0)
backgroundColor
Background color of input
#000000
, red
, rgb(0, 0, 0)
, transparent
errorPadding
Padding of input in case of error
16px 34px 16px 8px
padding
Padding of input
16px 34px 16px 8px
DidomiButtonOptions
DidomiButtonOptions corresponds to buttons found forms that allow you to go to the next step or submit. You can edit the style of the button itself as well as the style of the text within the button. You can also edit the content of the button by adding all translations needed (please view our languages supported and their corresponding codes here).
DidomiCardOptions
DidomiCardOptions corresponds to a block or a card containing children elements. You can edit the style of DidomiCardOptions by adding camel case CSS properties.
DidomiFormFieldOptions
DidomiFormFieldOptions corresponds to all elements related to an input. You can edit the style of input elements and the input itself with DidomiInputOptions.
label
Label of text input
description
Description of text input
hint
Hint of text input
errorMessage
Error message of text input
inputOptions
Text input options
DidomiImageOptions
DidomiImage correspond to options provided to edit icon placeholders and their style.
DidomiInputOptions
DidomiInputOptions corresponds to all style elements related to the input element. You can edit the style of DidomiCardOptions by adding camel case CSS properties.
fontColor
Color of input value
fontSize
Size of input value
fontWeight
Font weight of input value
lineHeight
Line height of input value
borderRadius
Border radius of input
borderColor
Border color of input
borderWidth
Thickness of input border
errorBorderColor
Color of input border when error
placeholderColor
Color of input placeholder
errorIcon
Error icon in input when error
focusShadow
Focus state when input is selected
backgroundColor
Background color of input
padding
Padding of input
errorPadding
Padding of input in case of error
DidomiPreferenceOptions
DidomiPreferenceOptions corresponds to all preference elements included in a widget. The style edited in DidomiPreferenceOptions will be applied to all preferences.
title
Name of preferences.
description
Description of preferences.
preferenceValuesOptions
Preference values options
DidomiPreferenceValueOptions
DidomiPreferenceValuesOptions corresponds to all preference values elements included in the widget. The style edited in DidomiPreferenceValuesOptions will be applied to all preference values.
label
Label of preference values.
DidomiPurposeOptions
DidomiPurposeOptions corresponds to all elements included in a purpose element.
title
Name of a purpose.
noIcon
Icon in radio button No input
noLabel
Content in radio button No input
yesIcon
Icon in radio button Yes input
yesLabel
Content in radio button Yes input
description
Description of purpose.
DidomiStyle
DidomiStyle corresponds to options provided to edit the style of an element. You can edit the style of this element by adding camel case CSS properties. Depending on the element, feel free to add the CSS property that will help your design. The list below is not exhaustive and all CSS properties can be used provided they are entered in camel case.
DidomiTextOptions
DidomiTextOptions corresponds to a text element in your widget. You can edit the style of the text element as well as its content adding all translations needed.
Last updated