CystomStyle properties
Property Definitions
Below is a detailed description of the editable and customizable components:
| Property | Object | Description |
|---|---|---|
| theme | Object | Object that defines global theme configuration for colors and styles. |
| theme.typography.primaryFontFamily | String | Defines the typography for widgets. |
| theme.colors.primaryTextColor | String | Primary text color. |
| theme.colors.backgroundSecondary | String | Background color in the OTP view. |
| theme.colors.backgroundPrimary | String | Background color in the main view. |
| theme.colors.buttonPrimaryFill | String | Fill color of the primary button. |
| theme.colors.buttonPrimaryHover | String | Fill color of the primary button on hover. |
| theme.colors.buttonPrimaryText | String | Text color of the primary button. |
| theme.colors.buttonPrimaryActive | String | Fill color of the primary button when clicked. |
| HeaderPattern | Object | Object that defines overrides for the header. |
| HeaderPattern.overrides | Object | Contains specific overrides for header components. |
| HeaderPattern.overrides.Logo | Object | Object that defines properties for the logo component. |
| HeaderPattern.overrides.Logo.props.url | String | URL of the logo that will be displayed in the header. |
| HeaderPattern.overrides.Logo.props.style | String | Defines the size of the logo. |
| HeaderPattern.overrides.Logo.props.position | String | Defines the alignment for displaying the logo, left or center. |
| CardInfoPattern | Object | Object that defines the card information. |
| CardInfoPattern.title | String | Title of the card information section. |
| CardInfoPattern.subtitle.content | String | Content of the subtitle. |
| UpperTagPattern | Object | Object that defines a custom upper tag. |
| UpperTagPattern.title | String | Title of the upper tag. |
| UpperTagPattern.description | String | Description of the upper tag. |
| UpperTagPattern.iconColor | String | Color of the upper tag icon. |
| UpperTagPattern.style | Object | Style of the upper tag, such as color (text color), box-shadow, margin-top and backgroundColor. |
| UserCardPattern | Object | Object that defines translations and configurations for user card management. |
| UserCardPattern.translations.es | Object | Spanish translations for user card management components. |
| UserCardPattern.translations.es.addNewCard.info | String | Text for the "Add new card" option. |
| UserCardPattern.translations.es.moreOptions.payWith | String | Text for the "Pay with" option. |
| UserCardPattern.translations.es.paymentMethods.seeAllMyCards | String | Text to see all saved cards. |
| UserCardPattern.translations.es.paymentMethods.expiredCard | String | Text indicating an expired card. |
| UserCardPattern.translations.es.paymentMethods.warningExpiredCard | String | Warning message to select a valid payment method. |
| UserCardPattern.translations.es.paymentMethods.confirmDeleteMethodTitle | String | Title for the card deletion confirmation modal. |
| UserCardPattern.translations.es.paymentMethods.deleteMainText | String | Main text for the delete option. |
| UserCardPattern.translations.es.paymentMethods.confirmDeleteMethodAccept | String | Text for the accept button in the deletion confirmation. |
| UserCardPattern.translations.es.paymentMethods.confirmDeleteMethodCancel | String | Text for the cancel button in the deletion confirmation. |
| UserCardPattern.translations.es.paymentMethods.confirmDeleteMethod | String | Message indicating that deletion is irreversible. |
| PaymentMethodsPattern.translations.es | Object | Object that defines translations and configurations for card input fields. |
| PaymentMethodsPattern.translations.es.inputs.identityDocument.label.{iso2_country_code} | Object | Custom labels for identity documents in different countries. |
| PaymentMethodsPattern.translations.es.inputs.identityDocument.label.CO | String | Label for Colombia: Cédula / Doc de identidad. |
| PaymentMethodsPattern.translations.es.inputs.identityDocument.label.CL | String | Label for Chile: RUT/DNI. |
| PaymentMethodsPattern.translations.es.inputs.identityDocument.label.EC | String | Label for Ecuador: Cédula / Doc de identidad. |
| PaymentMethodsPattern.translations.es.inputs.identityDocument.label.MX | String | Label for Mexico: Número de RFC. |
| PaymentMethodsPattern.translations.es.inputs.identityDocument.label.BR | String | Label for Brazil: CPF/CNPJ del titular. |
| PaymentMethodsPattern.translations.es.inputs.identityDocument.label.AR | String | Label for Argentina: DNI / Doc de identidad. |
| PaymentMethodsPattern.translations.es.inputs.identityDocument.label.UY | String | Label for Uruguay: Cédula / Doc de identidad. |
| PaymentMethodsPattern.translations.es.inputs.cardNumber.label | String | Custom label for the card number field. |
| PaymentMethodsPattern.translations.es.inputs.cardHolder | Object | Object that defines the label for the cardholder name field. |
| PaymentMethodsPattern.translations.es.inputs.cardHolder.label | String | Custom label for the cardholder name field. |
| PaymentMethodsPattern.translations.es.paymentMethods.info | Object | Object that defines translations and configurations for the payment methods header. |
| PaymentMethodsPattern.translations.es.paymentMethods.info.title | String | Title of the payment methods header. |
| PaymentMethodsPattern.translations.es.paymentMethods.info.subtitle | String | Subtitle of the payment methods. |
| installment | Object | Object that defines the label for the installments field. |
| PaymentMethodsPattern.translations.es.inputs.installment.label | String | Custom label for the installments field. |
| PaymentMethodsPattern.translations.es.inputs.installment.without_installments | String | Text to indicate no installments. |
| LowerTagPattern | Object | Object that defines a custom lower tag. |
| LowerTagPattern.title | String | Title of the lower tag. |
| LowerTagPattern.description | String | Description of the lower tag. |
| LowerTagPattern.iconColor | String | Color of the lower tag icon. |
| LowerTagPattern.style | Object | Style of the lower tag, such as color (text color), box-shadow and backgroundColor. |
| TermsConditionsPattern | Object | Object that defines the configuration for terms and conditions. |
| TermsConditionsPattern.showForGuest | Boolean | Indicates whether terms and conditions are shown for guest users. |
| TermsConditionsPattern.showForAuth | Boolean | Indicates whether terms and conditions are shown for authenticated users. |
| TermsConditionsPattern.legalMessage | String | Custom legal message. |
| TermsConditionsPattern.connectorText | String | Connector text in the terms and conditions. |
| TermsConditionsPattern.hideCompanyDisclaimer | Boolean | Indicates whether to hide the company disclaimer. |
| PaymentButtonPattern | Object | Object that defines the label, style and configuration of the payment button. |
| PaymentButtonPattern.label | String | Text for the payment button. |
| PaymentButtonPattern.showOrderTotal | Boolean | Indicates whether to show the order total in the form. |
| PaymentButtonPattern.styles | Object | Style of the payment button, such as padding and border radius. |
| PaymentButtonPattern.styles.padding | String | Padding of the payment button. |
| PaymentButtonPattern.styles.borderRadius | String | Border radius of the payment button. |
| PoweredByPattern | Object | Object that defines style and configuration for the "Powered by DEUNA" disclaimer. |
| PoweredByPattern.hide | Boolean | Indicates whether to hide the "Powered by DEUNA" branding. |
| PoweredByPattern.hidetext | Boolean | Indicates whether to hide the "Powered by" text. |
| PoweredByPattern.url | String | URL of the logo that will be displayed in "Powered by". |
| PoweredByPattern.imageStyle | Object | Style of the "Powered By" logo, width and height. |
| OtpPage | Object | Object that defines overrides for the OTP page. |
| OtpPage.overrides | Object | Contains specific overrides for OTP page components. |
| OtpPage.overrides.Header | Object | Object that defines header-related overrides for the OTP page. |
| OtpPage.overrides.Header.props | Object | Properties for the header, such as the logo URL. |
| OtpPage.overrides.Header.props.url | String | URL of the logo that will be displayed on the OTP page. |
| OtpPage.overrides.Headings | Object | Object that defines the title and description for the OTP page. |
| OtpPage.overrides.Headings.title | String | Custom title for the OTP page. |
| OtpPage.overrides.Headings.description | String | Descriptive text for the OTP page. |
| OtpPage.overrides.OtpChangeChannelButton | Object | Object that defines the description for the OTP channel change button. |
| OtpPage.overrides.OtpChangeChannelButton.description | Object | Descriptions for sending OTP via SMS or email. |
| OtpPage.overrides.OtpChangeChannelButton.description.sms | String | Custom description for sending OTP via SMS. |
| OtpPage.overrides.OtpChangeChannelButton.description.email | String | Custom description for sending OTP via email. |
| OtpPage.overrides.ContinueAsGuestButton | Object | Object that defines the description for the "continue as guest" button. |
| OtpPage.overrides.ContinueAsGuestButton.description | String | Descriptive text for continuing as a guest. |
Updated 3 days ago