Flex and Modern themes all enhance radio/checkbox inputs by turning them into buttons with mobile-friendly styling. Flex, stands out more with bolder colors, larger borders, and more space-efficient design, allowing users to customize its color scheme via the build.scss file.
Helpful tags
| Tag | Description |
show rows |
Defines the number of rows displayed. Accepts a number, or 'all'. |
start scroll |
Defines the number of rows the respondent must answer before a radio table will begin scrolling. |
mode |
Allows users to modify the table display. The following modes are available: textabove, buttons, vertical, classic, tiled
|
scale |
Forces options to stay in a single row or column. |
explain |
Shows info when hovering over an icon (desktop) or tapping (touchscreen). |
set text |
Underlines terms that function like tooltips when clicked or hovered. |
Tip! Flex is the default theme for all surveys.
Theme examples
The examples demonstrate how the different themes look. To get the "full experience" for how surveys will respond to different screen sizes, feel free to increase and decrease your browser width to watch how the survey responds to these size changes.
Navigation and default behavior
Survey pages automatically submit where appropriate. If all visible questions are single-select, the survey advances automatically after an answer is chosen. A back button briefly appears on the next page for corrections. For text inputs and multi-select questions, the survey displays a continue button that must be clicked to proceed.
Flex
Modern
Ranking questions
In ranking questions, hovering shows the next available rank if you are on a desktop device; if you are on a mobile device, the rank appears after selection.
Flex
Modern
Tooltips
Tooltips (a.k.a., "mouse overs") can be applied to questions via the explain or set text tags, and they function similarly as they do in other themes.
If the respondent's device has a touch screen, the icon or accented area must be clicked to reveal the explain text.
Flex
Modern
Comments
0 comments
Please sign in to leave a comment.