Skip to content

Date-range calendar

Date-range calendar

Name Type Default Value Description
label string labelText Text label to display
displayLabel boolean True If true, a label is displayed on the left side of the date-range picker
displayTimePicker boolean False If true, time is displayed next to the date in AM/PM format
displayTimePicker24Hour boolean False If true and displayTimePicker also true, time is displayed next to the date
labelFontSize number 0.5 Label font-size
labelColor string var(--widget-label-color) Label text color
labelFontFamily string var(--widget-font-family) Label font-family. Possible values: Arial, Verdana, Tahoma, Trebuchet MS, Times New Roman, Georgia, Garamond, Courier New, Brush Script MT, Montserrat, ralway, Lucida Grande, Lato, Menlo
labelWidthProportion string 25% Label width proportion with respect to the widget width. The value should be in percentage
valueFontSize number 0.5 Value font-size
valueColor string var(--widget-color) Color of the displayed value
valueFontFamily string var(--widget-font-family) Value font-family. Possible values: Arial, Verdana, Tahoma, Trebuchet MS, Times New Roman, Georgia, Garamond, Courier New, Brush Script MT, Montserrat, ralway, Lucida Grande, Lato, Menlo
valueTextAlign string left Value text horizontal alignment. Possible values: left, center, right
displayBorder boolean True If true, a border is displayed around the widget
borderColor string var(--widget-border-color) Border color of the date-range calendar
backgroundColor string var(--widget-input-color) Background color of the date-range calendar