-
Notifications
You must be signed in to change notification settings - Fork 373
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
How to add different colors for startdate and enddate when enable range selection #261
Comments
Screen.Recording.2020-12-24.at.3.00.49.PM.mov |
Try passing styles to these props:
|
Thanks @peacechen its working but is there any prop? changing text color in selectedRangeStartStyle and selectedRangeEndStyle |
Try the prop |
No its not working it does not change text color in selectedRangeStartStyle selectedRangeStartStyle = {{ backgroundColor: Colors.themePrimary,selectedDayTextStyle:'#fff'}} |
That looks like a bug due to the order of styles in the array. CalendarPicker/CalendarPicker/Day.js Line 160 in b93ae2e
If you have time, please submit a PR that moves
|
Published in 7.0.7 |
Thanks @peacechen |
Pass a style to |
@peacechen selectedDayTextStyle pass it changes all selected days but i want to change selectedRangeStartStyle and selectedRangeEndStyle |
I see what you mean. |
…#261) Minor refactor of style variable names.
The new props have been published in 7.0.8 I recommend that you learn how to submit Pull Requests (PR) to contribute to this library. You wouldn't need to wait around for someone else to make the change for you. |
Thank you @peacechen |
onDateChange(date, type) {
if (type === 'END_DATE') {
this.setState({
selectedEndDate: date,
});
} else {
this.setState({
selectedStartDate: date,
selectedEndDate: date,
});
}
}
<CalendarPicker
dayLabelsWrapper = {{borderTopWidth:0}}
startFromMonday={true}
allowRangeSelection={true}
minDate={minDate}
weekdays={['S', 'M', 'T', 'W', 'T', 'F', 'Sat']}
maxDate={maxDate}
//previousTitle=" <"
//nextTitle="> "
previousTitleStyle={{ marginLeft: 30, fontSize: 30 }}
//customDatesStyles={customDatesStyles}
nextTitleStyle = {{fontSize: 30,marginRight:30}}
todayBackgroundColor={'#E9EFF4'}
selectedDayColor={'#E9EFF4'}
selectedDayTextColor="#242E42"
scaleFactor={450}
width={450}
allowBackwardRangeSelect = {true}
textStyle={{
fontFamily: Fonts.latoMedium,
color: '#242E42',
}}
onDateChange={this.onDateChange}
/>
The text was updated successfully, but these errors were encountered: