/** * possible values to override, taken from the documentation: * https://surveyjs.io/form-library/examples/survey-customcss/reactjs#content-docs * * { * "root": "sd-root-modern", * "rootMobile": "sd-root-modern--mobile", * "rootReadOnly": "sd-root--readonly", * "container": "sd-container-modern", * "header": "sd-title sd-container-modern__title", * "body": "sd-body", * "bodyWithTimer": "sd-body--with-timer", * "clockTimerRoot": "sd-timer", * "clockTimerRootTop": "sd-timer--top", * "clockTimerRootBottom": "sd-timer--bottom", * "clockTimerProgress": "sd-timer__progress", * "clockTimerProgressAnimation": "sd-timer__progress--animation", * "clockTimerTextContainer": "sd-timer__text-container", * "clockTimerMinorText": "sd-timer__text--minor", * "clockTimerMajorText": "sd-timer__text--major", * "bodyEmpty": "sd-body sd-body--empty", * "footer": "sd-footer sd-body__navigation sd-clearfix", * "title": "sd-title", * "description": "sd-description", * "logo": "sd-logo", * "logoImage": "sd-logo__image", * "headerText": "sd-header__text", * "headerClose": "sd-hidden", * "navigationButton": "", * "bodyNavigationButton": "sd-btn", * "completedPage": "sd-completedpage", * "timerRoot": "sd-body__timer", * "navigation": { * "complete": "sd-btn--action sd-navigation__complete-btn", * "prev": "sd-navigation__prev-btn", * "next": "sd-navigation__next-btn", * "start": "sd-navigation__start-btn", * "preview": "sd-navigation__preview-btn", * "edit": "" * }, * "panel": { * "title": "sd-title sd-element__title sd-panel__title", * "titleExpandable": "sd-element__title--expandable", * "titleExpanded": "sd-element__title--expanded", * "titleCollapsed": "sd-element__title--collapsed", * "titleDisabled": "sd-element__title--disabled", * "titleOnExpand": "sd-panel__title--expanded", * "titleBar": "sd-action-title-bar", * "description": "sd-description sd-panel__description", * "container": "sd-element sd-element--complex sd-panel sd-row__panel", * "withFrame": "sd-element--with-frame", * "content": "sd-panel__content", * "icon": "sd-panel__icon", * "iconExpanded": "sd-panel__icon--expanded", * "footer": "sd-panel__footer", * "requiredText": "sd-panel__required-text", * "header": "sd-panel__header sd-element__header sd-element__header--location-top", * "collapsed": "sd-element--collapsed", * "expanded": "sd-element--expanded", * "nested": "sd-element--nested", * "invisible": "sd-element--invisible", * "navigationButton": "" * }, * "paneldynamic": { * "mainRoot": "sd-element sd-question sd-question--paneldynamic sd-element--complex sd-question--complex sd-row__question", * "empty": "sd-question--empty", * "root": "sd-paneldynamic", * "navigation": "sd-paneldynamic__navigation", * "title": "sd-title sd-element__title sd-question__title", * "button": "sd-action sd-paneldynamic__btn", * "buttonRemove": "sd-action--negative sd-paneldynamic__remove-btn", * "buttonAdd": "sd-paneldynamic__add-btn", * "buttonPrev": "sd-paneldynamic__prev-btn sd-action--icon sd-action", * "buttonPrevDisabled": "sd-action--disabled", * "buttonNextDisabled": "sd-action--disabled", * "buttonNext": "sd-paneldynamic__next-btn sd-action--icon sd-action", * "progressContainer": "sd-paneldynamic__progress-container", * "progress": "sd-progress", * "progressBar": "sd-progress__bar", * "progressText": "sd-paneldynamic__progress-text", * "separator": "sd-paneldynamic__separator", * "panelWrapper": "sd-paneldynamic__panel-wrapper", * "footer": "sd-paneldynamic__footer", * "panelFooter": "sd-paneldynamic__panel-footer", * "footerButtonsContainer": "sd-paneldynamic__buttons-container", * "panelWrapperInRow": "sd-paneldynamic__panel-wrapper--in-row", * "progressBtnIcon": "icon-progressbuttonv2", * "noEntriesPlaceholder": "sd-paneldynamic__placeholder sd-question__placeholder" * }, * "progress": "sd-progress sd-body__progress", * "progressBar": "sd-progress__bar", * "progressText": "sd-progress__text", * "progressButtonsContainerCenter": "sd-progress-buttons__container-center", * "progressButtonsContainer": "sd-progress-buttons__container", * "progressButtonsImageButtonLeft": "sd-progress-buttons__image-button-left", * "progressButtonsImageButtonRight": "sd-progress-buttons__image-button-right", * "progressButtonsImageButtonHidden": "sd-progress-buttons__image-button--hidden", * "progressButtonsListContainer": "sd-progress-buttons__list-container", * "progressButtonsList": "sd-progress-buttons__list", * "progressButtonsListElementPassed": "sd-progress-buttons__list-element--passed", * "progressButtonsListElementCurrent": "sd-progress-buttons__list-element--current", * "progressButtonsListElementNonClickable": "sd-progress-buttons__list-element--nonclickable", * "progressButtonsPageTitle": "sd-progress-buttons__page-title", * "progressButtonsPageDescription": "sd-progress-buttons__page-description", * "progressTextInBar": "sd-hidden", * "page": { * "root": "sd-page sd-body__page", * "emptyHeaderRoot": "sd-page__empty-header", * "title": "sd-title sd-page__title", * "description": "sd-description sd-page__description" * }, * "pageTitle": "sd-title sd-page__title", * "pageDescription": "sd-description sd-page__description", * "row": "sd-row sd-clearfix", * "rowMultiple": "sd-row--multiple", * "pageRow": "sd-page__row", * "question": { * "mainRoot": "sd-element sd-question sd-row__question", * "flowRoot": "sd-element sd-question sd-row__question sd-row__question--flow", * "withFrame": "sd-element--with-frame", * "asCell": "sd-table__cell", * "answered": "sd-question--answered", * "header": "sd-question__header sd-element__header", * "headerLeft": "sd-question__header--location--left", * "headerTop": "sd-question__header--location-top sd-element__header--location-top", * "headerBottom": "sd-question__header--location--bottom", * "content": "sd-question__content", * "contentLeft": "sd-question__content--left", * "titleLeftRoot": "sd-question--left", * "titleOnAnswer": "sd-question__title--answer", * "titleOnError": "sd-question__title--error", * "title": "sd-title sd-element__title sd-question__title", * "titleExpandable": "sd-element__title--expandable", * "titleExpanded": "sd-element__title--expanded", * "titleCollapsed": "sd-element__title--collapsed", * "titleDisabled": "sd-element__title--disabled", * "titleBar": "sd-action-title-bar", * "requiredText": "sd-question__required-text", * "number": "sd-element__num", * "description": "sd-description sd-question__description", * "descriptionUnderInput": "sd-description sd-question__description", * "comment": "sd-input sd-comment", * "other": "sd-input sd-comment", * "required": "sd-question--required", * "titleRequired": "sd-question__title--required", * "indent": 20, * "footer": "sd-question__footer", * "formGroup": "sd-question__form-group", * "hasError": "sd-question--error", * "collapsed": "sd-element--collapsed", * "expanded": "sd-element--expanded", * "nested": "sd-element--nested", * "invisible": "sd-element--invisible", * "composite": "sd-element--complex", * "disabled": "sd-question--disabled" * }, * "image": { * "mainRoot": "sd-question sd-question--image", * "root": "sd-image", * "image": "sd-image__image", * "adaptive": "sd-image__image--adaptive", * "withFrame": "" * }, * "html": { * "mainRoot": "sd-question sd-row__question sd-question--html", * "root": "sd-html", * "withFrame": "" * }, * "error": { * "root": "sd-question__erbox", * "icon": "", * "item": "", * "tooltip": "sd-question__erbox--tooltip", * "outsideQuestion": "sd-question__erbox--outside-question", * "aboveQuestion": "sd-question__erbox--above-question", * "belowQuestion": "sd-question__erbox--below-question", * "locationTop": "sd-question__erbox--location--top", * "locationBottom": "sd-question__erbox--location--bottom" * }, * "checkbox": { * "root": "sd-selectbase", * "rootRow": "sd-selectbase--row", * "rootMultiColumn": "sd-selectbase--multi-column", * "item": "sd-item sd-checkbox sd-selectbase__item", * "itemOnError": "sd-item--error", * "itemSelectAll": "sd-checkbox--selectall", * "itemNone": "sd-checkbox--none", * "itemDisabled": "sd-item--disabled sd-checkbox--disabled", * "itemChecked": "sd-item--checked sd-checkbox--checked", * "itemHover": "sd-item--allowhover sd-checkbox--allowhover", * "itemInline": "sd-selectbase__item--inline", * "label": "sd-selectbase__label", * "labelChecked": "", * "itemControl": "sd-visuallyhidden sd-item__control sd-checkbox__control", * "itemDecorator": "sd-item__svg sd-checkbox__svg", * "itemSvgIconId": "#icon-v2check", * "controlLabel": "sd-item__control-label", * "materialDecorator": "sd-item__decorator sd-checkbox__decorator", * "other": "sd-input sd-comment sd-selectbase__other", * "column": "sd-selectbase__column" * }, * "radiogroup": { * "root": "sd-selectbase", * "rootRow": "sd-selectbase--row", * "rootMultiColumn": "sd-selectbase--multi-column", * "item": "sd-item sd-radio sd-selectbase__item", * "itemOnError": "sd-item--error", * "itemInline": "sd-selectbase__item--inline", * "label": "sd-selectbase__label", * "labelChecked": "", * "itemDisabled": "sd-item--disabled sd-radio--disabled", * "itemChecked": "sd-item--checked sd-radio--checked", * "itemHover": "sd-item--allowhover sd-radio--allowhover", * "itemControl": "sd-visuallyhidden sd-item__control sd-radio__control", * "itemDecorator": "sd-item__svg sd-radio__svg", * "controlLabel": "sd-item__control-label", * "materialDecorator": "sd-item__decorator sd-radio__decorator", * "other": "sd-input sd-comment sd-selectbase__other", * "clearButton": "", * "column": "sd-selectbase__column" * }, * "boolean": { * "mainRoot": "sd-element sd-question sd-row__question sd-question--boolean", * "root": "sv_qcbc sv_qbln sd-scrollable-container", * "rootRadio": "sv_qcbc sv_qbln sd-scrollable-container sd-scrollable-container--compact", * "item": "sd-boolean", * "itemOnError": "sd-boolean--error", * "control": "sd-boolean__control sd-visuallyhidden", * "itemChecked": "sd-boolean--checked", * "itemIndeterminate": "sd-boolean--indeterminate", * "itemDisabled": "sd-boolean--disabled", * "label": "sd-boolean__label", * "switch": "sd-boolean__switch", * "disabledLabel": "sd-checkbox__label--disabled", * "sliderText": "sd-boolean__thumb-text", * "slider": "sd-boolean__thumb", * "radioItem": "sd-item", * "radioItemChecked": "sd-item--checked sd-radio--checked", * "radioLabel": "sd-selectbase__label", * "radioControlLabel": "sd-item__control-label", * "radioFieldset": "sd-selectbase", * "itemRadioDecorator": "sd-item__svg sd-radio__svg", * "materialRadioDecorator": "sd-item__decorator sd-radio__decorator", * "itemRadioControl": "sd-visuallyhidden sd-item__control sd-radio__control", * "rootCheckbox": "sd-selectbase", * "checkboxItem": "sd-item sd-selectbase__item sd-checkbox", * "checkboxLabel": "sd-selectbase__label", * "checkboxItemOnError": "sd-item--error", * "checkboxItemIndeterminate": "sd-checkbox--intermediate", * "checkboxItemChecked": "sd-item--checked sd-checkbox--checked", * "checkboxItemDecorator": "sd-item__svg sd-checkbox__svg", * "checkboxItemDisabled": "sd-checkbox--disabled", * "controlCheckbox": "sd-visuallyhidden sd-item__control sd-checkbox__control", * "checkboxMaterialDecorator": "sd-item__decorator sd-checkbox__decorator", * "checkboxControlLabel": "sd-item__control-label", * "svgIconCheckedId": "#icon-v2check" * }, * "text": { * "root": "sd-input sd-text", * "small": "sd-row__question--small", * "controlDisabled": "sd-input--disabled", * "onError": "sd-input--error" * }, * "multipletext": { * "root": "sd-multipletext", * "itemLabel": "sd-multipletext__item-container sd-input", * "itemLabelOnError": "sd-multipletext__item-container--error", * "item": "sd-multipletext__item", * "itemTitle": "sd-multipletext__item-title", * "row": "sd-multipletext__row", * "cell": "sd-multipletext__cell" * }, * "dropdown": { * "root": "sd-selectbase", * "small": "sd-row__question--small", * "selectWrapper": "", * "other": "sd-input sd-comment sd-selectbase__other", * "onError": "sd-input--error", * "label": "sd-selectbase__label", * "item": "sd-item sd-radio sd-selectbase__item", * "itemDisabled": "sd-item--disabled sd-radio--disabled", * "itemChecked": "sd-item--checked sd-radio--checked", * "itemHover": "sd-item--allowhover sd-radio--allowhover", * "itemControl": "sd-visuallyhidden sd-item__control sd-radio__control", * "itemDecorator": "sd-item__svg sd-radio__svg", * "cleanButton": "sd-dropdown_clean-button", * "cleanButtonSvg": "sd-dropdown_clean-button-svg", * "cleanButtonIconId": "icon-clear", * "control": "sd-input sd-dropdown", * "controlInputFieldComponent": "sd-dropdown__input-field-component", * "controlValue": "sd-dropdown__value", * "controlDisabled": "sd-input--disabled", * "controlEmpty": "sd-dropdown--empty", * "controlLabel": "sd-item__control-label", * "filterStringInput": "sd-dropdown__filter-string-input", * "materialDecorator": "sd-item__decorator sd-radio__decorator" * }, * "imagepicker": { * "mainRoot": "sd-element sd-question sd-row__question", * "root": "sd-selectbase sd-imagepicker", * "rootColumn": "sd-imagepicker--column", * "item": "sd-imagepicker__item", * "itemOnError": "sd-imagepicker__item--error", * "itemInline": "sd-imagepicker__item--inline", * "itemChecked": "sd-imagepicker__item--checked", * "itemDisabled": "sd-imagepicker__item--disabled", * "itemHover": "sd-imagepicker__item--allowhover", * "label": "sd-imagepicker__label", * "itemDecorator": "sd-imagepicker__item-decorator", * "imageContainer": "sd-imagepicker__image-container", * "itemControl": "sd-imagepicker__control sd-visuallyhidden", * "image": "sd-imagepicker__image", * "itemText": "sd-imagepicker__text", * "other": "sd-input sd-comment", * "itemNoImage": "sd-imagepicker__no-image", * "itemNoImageSvgIcon": "sd-imagepicker__no-image-svg", * "itemNoImageSvgIconId": "#icon-no-image", * "column": "sd-selectbase__column sd-imagepicker__column" * }, * "matrix": { * "mainRoot": "sd-element sd-question sd-row__question sd-element--complex sd-question--complex sd-question--table", * "tableWrapper": "sd-matrix", * "root": "sd-table sd-matrix__table", * "rootVerticalAlignTop": "sd-table--align-top", * "rootVerticalAlignMiddle": "sd-table--align-middle", * "rootAlternateRows": "sd-table--alternate-rows", * "rowError": "sd-matrix__row--error", * "cell": "sd-table__cell sd-matrix__cell", * "row": "sd-table__row", * "headerCell": "sd-table__cell sd-table__cell--header", * "rowTextCell": "sd-table__cell sd-matrix__cell sd-table__cell--row-text", * "label": "sd-item sd-radio sd-matrix__label", * "itemOnError": "sd-item--error", * "itemValue": "sd-visuallyhidden sd-item__control sd-radio__control", * "itemChecked": "sd-item--checked sd-radio--checked", * "itemDisabled": "sd-item--disabled sd-radio--disabled", * "itemHover": "sd-radio--allowhover", * "materialDecorator": "sd-item__decorator sd-radio__decorator", * "itemDecorator": "sd-item__svg sd-radio__svg", * "cellText": "sd-matrix__text", * "cellTextSelected": "sd-matrix__text--checked", * "cellTextDisabled": "sd-matrix__text--disabled", * "cellResponsiveTitle": "sd-matrix__responsive-title" * }, * "matrixdropdown": { * "mainRoot": "sd-element sd-question sd-row__question sd-element--complex sd-question--complex sd-question--table", * "rootScroll": "sd-question--scroll", * "root": "sd-table sd-matrixdropdown", * "rootVerticalAlignTop": "sd-table--align-top", * "rootVerticalAlignMiddle": "sd-table--align-middle", * "rootAlternateRows": "sd-table--alternate-rows", * "cell": "sd-table__cell", * "row": "sd-table__row", * "headerCell": "sd-table__cell sd-table__cell--header", * "rowTextCell": "sd-table__cell sd-table__cell--row-text", * "cellRequiredText": "sd-question__required-text", * "detailButton": "sd-table__cell--detail-button", * "detailButtonExpanded": "sd-table__cell--detail-button--expanded", * "detailIcon": "sd-detail-panel__icon", * "detailIconExpanded": "sd-detail-panel__icon--expanded", * "detailIconId": "icon-expanddetail", * "detailIconExpandedId": "icon-collapsedetail", * "actionsCell": "sd-table__cell sd-table__cell--actions", * "emptyCell": "sd-table__cell--empty", * "verticalCell": "sd-table__cell--vertical", * "cellQuestionWrapper": "sd-table__question-wrapper" * }, * "matrixdynamic": { * "mainRoot": "sd-element sd-question sd-row__question sd-element--complex sd-question--complex sd-question--table", * "rootScroll": "sd-question--scroll", * "empty": "sd-question--empty", * "root": "sd-table sd-matrixdynamic", * "cell": "sd-table__cell", * "row": "sd-table__row", * "headerCell": "sd-table__cell sd-table__cell--header", * "rowTextCell": "sd-table__cell sd-table__cell--row-text", * "cellRequiredText": "sd-question__required-text", * "button": "sd-action sd-matrixdynamic__btn", * "detailRow": "sd-table__row sd-table__row--detail", * "detailButton": "sd-table__cell--detail-button", * "detailButtonExpanded": "sd-table__cell--detail-button--expanded", * "detailIcon": "sd-detail-panel__icon", * "detailIconExpanded": "sd-detail-panel__icon--expanded", * "detailIconId": "icon-expanddetail", * "detailIconExpandedId": "icon-collapsedetail", * "detailPanelCell": "sd-table__cell--detail-panel", * "actionsCell": "sd-table__cell sd-table__cell--actions", * "buttonAdd": "sd-matrixdynamic__add-btn", * "buttonRemove": "sd-action--negative sd-matrixdynamic__remove-btn", * "iconAdd": "", * "iconRemove": "", * "dragElementDecorator": "sd-drag-element__svg", * "iconDragElement": "#icon-v2dragelement_16x16", * "footer": "sd-matrixdynamic__footer", * "emptyRowsSection": "sd-matrixdynamic__placeholder sd-question__placeholder", * "iconDrag": "sv-matrixdynamic__drag-icon", * "ghostRow": "sv-matrix-row--drag-drop-ghost-mod", * "emptyCell": "sd-table__cell--empty", * "verticalCell": "sd-table__cell--vertical", * "cellQuestionWrapper": "sd-table__question-wrapper" * }, * "rating": { * "rootDropdown": "sd-scrollable-container sd-scrollable-container--compact sd-selectbase", * "root": "sd-scrollable-container sd-rating", * "rootWrappable": "sd-scrollable-container sd-rating sd-rating--wrappable", * "item": "sd-rating__item", * "itemOnError": "sd-rating__item--error", * "itemHover": "sd-rating__item--allowhover", * "selected": "sd-rating__item--selected", * "minText": "sd-rating__item-text sd-rating__min-text", * "itemText": "sd-rating__item-text", * "maxText": "sd-rating__item-text sd-rating__max-text", * "itemDisabled": "sd-rating__item--disabled", * "control": "sd-input sd-dropdown", * "controlValue": "sd-dropdown__value", * "controlDisabled": "sd-input--disabled", * "controlEmpty": "sd-dropdown--empty", * "filterStringInput": "sd-dropdown__filter-string-input", * "onError": "sd-input--error" * }, * "comment": { * "root": "sd-input sd-comment", * "small": "sd-row__question--small", * "controlDisabled": "sd-input--disabled", * "onError": "sd-input--error" * }, * "expression": "", * "file": { * "root": "sd-file", * "other": "sd-input sd-comment", * "placeholderInput": "sd-visuallyhidden", * "preview": "sd-file__preview", * "fileSign": "", * "fileList": "sd-file__list", * "fileSignBottom": "sd-file__sign", * "dragArea": "sd-file__drag-area", * "dragAreaActive": "sd-file__drag-area--active", * "fileDecorator": "sd-file__decorator", * "onError": "sd-file__decorator--error", * "fileDecoratorDrag": "sd-file__decorator--drag", * "fileInput": "sd-visuallyhidden", * "noFileChosen": "sd-description sd-file__no-file-chosen", * "chooseFile": "sd-file__choose-btn", * "chooseFileAsText": "sd-action sd-file__choose-btn--text", * "chooseFileAsTextDisabled": "sd-action--disabled", * "chooseFileAsIcon": "sd-context-btn sd-file__choose-btn--icon", * "chooseFileIconId": "icon-choosefile", * "disabled": "sd-file__choose-btn--disabled", * "removeButton": "sd-context-btn sd-context-btn--negative sd-file__btn sd-file__clean-btn", * "removeButtonBottom": "", * "removeButtonIconId": "icon-clear", * "removeFile": "sd-hidden", * "removeFileSvg": "", * "removeFileSvgIconId": "icon-delete", * "wrapper": "sd-file__wrapper", * "defaultImage": "sd-file__default-image", * "defaultImageIconId": "icon-defaultfile", * "leftIconId": "icon-arrowleft", * "rightIconId": "icon-arrowright", * "removeFileButton": "sd-context-btn sd-context-btn--negative sd-file__remove-file-button", * "dragAreaPlaceholder": "sd-file__drag-area-placeholder", * "imageWrapper": "sd-file__image-wrapper", * "single": "sd-file--single", * "singleImage": "sd-file--single-image", * "mobile": "sd-file--mobile" * }, * "signaturepad": { * "mainRoot": "sd-element sd-question sd-question--signature sd-row__question", * "root": "sd-signaturepad sjs_sp_container", * "small": "sd-row__question--small", * "controls": "sjs_sp_controls sd-signaturepad__controls", * "placeholder": "sjs_sp_placeholder", * "clearButton": "sjs_sp_clear sd-context-btn sd-context-btn--negative sd-signaturepad__clear", * "clearButtonIconId": "icon-clear" * }, * "saveData": { * "root": "", * "saving": "", * "error": "", * "success": "", * "saveAgainButton": "" * }, * "window": { * "root": "sv_window", * "body": "sv_window_content", * "header": { * "root": "sv_window_title", * "title": "", * "button": "", * "buttonExpanded": "", * "buttonCollapsed": "" * } * }, * "ranking": { * "root": "sv-ranking", * "rootMobileMod": "sv-ranking--mobile", * "rootDragMod": "sv-ranking--drag", * "rootDisabled": "sd-ranking--disabled", * "rootDesignMode": "sv-ranking--design-mode", * "item": "sv-ranking-item", * "itemContent": "sv-ranking-item__content sd-ranking-item__content", * "itemIndex": "sv-ranking-item__index", * "controlLabel": "sv-ranking-item__text", * "itemGhostNode": "sv-ranking-item__ghost", * "itemIconContainer": "sv-ranking-item__icon-container", * "itemIcon": "sv-ranking-item__icon", * "itemIconHoverMod": "sv-ranking-item__icon--hover", * "itemIconFocusMod": "sv-ranking-item__icon--focus", * "itemGhostMod": "sv-ranking-item--ghost", * "itemDragMod": "sv-ranking--drag", * "itemOnError": "sv-ranking-item--error" * }, * "buttongroup": { * "root": "sv-button-group", * "item": "sv-button-group__item", * "itemIcon": "sv-button-group__item-icon", * "itemDecorator": "sv-button-group__item-decorator", * "itemCaption": "sv-button-group__item-caption", * "itemHover": "sv-button-group__item--hover", * "itemSelected": "sv-button-group__item--selected", * "itemDisabled": "sv-button-group__item--disabled", * "itemControl": "sv-visuallyhidden" * }, * "list": { * "root": "sv-list__container sd-list", * "item": "sv-list__item sd-list__item", * "itemBody": "sv-list__item-body sd-list__item-body", * "itemSelected": "sv-list__item--selected sd-list__item--selected" * }, * "actionBar": { * "root": "sd-action-bar", * "item": "sd-action", * "defaultSizeMode": "", * "smallSizeMode": "", * "itemPressed": "sd-action--pressed", * "itemAsIcon": "sd-action--icon", * "itemIcon": "sd-action__icon", * "itemTitle": "sd-action__title" * }, * "variables": { * "mobileWidth": "--sd-mobile-width", * "imagepickerGapBetweenItems": "--sd-imagepicker-gap", * "themeMark": "--sv-defaultV2-mark" * }, * "tagbox": { * "root": "sd-selectbase", * "small": "sd-row__question--small", * "selectWrapper": "", * "other": "sd-input sd-comment sd-selectbase__other", * "onError": "sd-input--error", * "label": "sd-selectbase__label", * "item": "sd-item sd-radio sd-selectbase__item", * "itemDisabled": "sd-item--disabled sd-radio--disabled", * "itemChecked": "sd-item--checked sd-radio--checked", * "itemHover": "sd-item--allowhover sd-radio--allowhover", * "itemControl": "sd-visuallyhidden sd-item__control sd-radio__control", * "itemDecorator": "sd-item__svg sd-radio__svg", * "cleanButton": "sd-tagbox_clean-button sd-dropdown_clean-button", * "cleanButtonSvg": "sd-tagbox_clean-button-svg sd-dropdown_clean-button-svg", * "cleanButtonIconId": "icon-clear", * "cleanItemButton": "sd-tagbox-item_clean-button", * "cleanItemButtonSvg": "sd-tagbox-item_clean-button-svg", * "cleanItemButtonIconId": "icon-clear_16x16", * "control": "sd-input sd-tagbox sd-dropdown", * "controlValue": "sd-tagbox__value sd-dropdown__value", * "controlValueItems": "sd-tagbox__value-items", * "placeholderInput": "sd-tagbox__placeholder", * "controlDisabled": "sd-input--disabled", * "controlEmpty": "sd-dropdown--empty sd-tagbox--empty", * "controlLabel": "sd-item__control-label", * "filterStringInput": "sd-tagbox__filter-string-input sd-dropdown__filter-string-input", * "materialDecorator": "sd-item__decorator sd-checkbox__decorator" * } * } * */ export const css = { root: 'survey', header: 'survey__header', body: 'survey__body', bodyEmpty: '', footer: 'survey__footer', navigationButton: 'button button--primary', completedPage: 'survey__body--completed', navigation: { complete: 'button button--primary', prev: 'button button--primary', next: 'button button--primary', start: 'button button--primary', }, progress: 'survey__progress', progressBar: 'survey__progress-bar', page: { root: 'survey__page', title: 'survey__page-title', description: 'survey__page-description', }, pageTitle: 'survey__page-title', pageDescription: 'survey__page-description', row: 'sv_row', question: { mainRoot: 'survey__question question', flowRoot: 'sv_q_flow sv_qstn', titleLeftRoot: 'sv_qstn_left', title: 'survey__question-title', titleOnError: 'survey__question-title--error', content: 'survey__question-content', number: 'sv_q_num', 'survey__question-description': 'small', comment: 'survey__question-input skillbox-input question__input', required: '', titleRequired: '', hasError: 'survey__question--error question--error', indent: 20, }, panel: { title: 'survey__panel-title', titleOnError: 'survey__panel-title--error', description: 'small survey__panel-description', container: 'sv_p_container', }, error: { root: 'alert alert-danger', icon: 'glyphicon glyphicon-exclamation-sign', item: 'survey__error-item', locationTop: 'survey__error survey__error--top', locationBottom: 'survey__error survey__error--bottom', }, boolean: { root: 'sv_qbln form-inline checkbox', item: '', label: '', materialDecorator: 'checkbox-material', }, checkbox: { root: 'survey__checkbox-group', item: 'base-input-container base-input-container--survey', itemControl: 'base-input-container__input', itemChecked: 'base-input-container__input--checked', itemDecorator: '', label: 'base-input-container__label-container', controlLabel: 'base-input-container__label', materialDecorator: 'base-input-container__checkbox base-input-container__icon', other: 'sv_q_checkbox_other skillbox-input', column: 'sv_q_select_column', }, comment: 'survey__input skillbox-input question__input', dropdown: { root: '', control: 'survey__input skillbox-input skillbox-dropdown', other: 'sv_q_dd_other skillbox-input', }, html: { root: '', }, matrix: { root: 'survey__matrix matrix', label: 'base-input-container__label-container matrix__label', item: 'survey__matrix-item', itemValue: 'survey__matrix-item matrix__item base-input-container__input', headerCell: 'matrix__header-cell', materialDecorator: 'base-input-container__radiobutton base-input-container__icon matrix__radio', row: 'survey__radiogroup-group matrix__row', cell: 'base-input-container base-input-container--survey base-input-container--matrix matrix__cell', cellText: 'survey__matrix-cell-text', cellTextSelected: 'survey__matrix-cell-text--selected', cellLabel: 'survey__matrix-cell-label', }, matrixdropdown: { root: 'table', }, matrixdynamic: { root: 'table', button: 'button', buttonAdd: '', buttonRemove: '', iconAdd: '', iconRemove: '', }, paneldynamic: { root: '', button: 'button', buttonPrev: '', buttonNext: '', buttonAdd: '', buttonRemove: '', }, multipletext: { root: 'table', itemTitle: '', itemValue: 'sv_q_mt_item_value skillbox-input', }, radiogroup: { root: 'survey__radiogroup-group', item: 'base-input-container base-input-container--survey', label: 'base-input-container__label-container', itemControl: 'base-input-container__input', controlLabel: 'base-input-container__label', materialDecorator: 'base-input-container__radiobutton base-input-container__icon', other: 'sv_q_radiogroup_other skillbox-input', clearButton: 'sv_q_radiogroup_clear button', column: 'sv_q_select_column', }, imagepicker: { root: 'sv_imgsel', item: 'sv_q_imgsel', label: 'sv_q_imgsel_label', itemControl: 'sv_q_imgsel_control_item', image: 'sv_q_imgsel_image', itemText: 'sv_q_imgsel_text', clearButton: 'sv_q_radiogroup_clear', }, rating: { root: 'btn-group', item: 'btn btn-default btn-secondary', selected: 'active', minText: '', itemText: '', maxText: '', }, text: 'survey__input skillbox-input question__input', expression: 'survey__input skillbox-input', file: { root: 'sv_q_file', placeholderInput: 'sv_q_file_placeholder', preview: 'sv_q_file_preview', removeButton: 'sv_q_file_remove_button', fileInput: 'sv_q_file_input', removeFile: 'sv_q_file_remove', }, saveData: { root: 'save-data', saving: 'alert alert-info', error: 'alert alert-danger', success: 'alert alert-success', saveAgainButton: '', }, window: { root: 'modal-content', body: 'modal-body', header: { root: 'modal-header panel-title', title: 'pull-left', button: 'glyphicon pull-right', buttonExpanded: 'glyphicon pull-right glyphicon-chevron-up', buttonCollapsed: 'glyphicon pull-right glyphicon-chevron-down', }, }, };