Calendar to follow website theme completely
.ea-submit { background-color: #52b02a !important; border-color: #52b02a !important; } .ea-submit:hover { background-color: #3e8121 !important; border-color: #3e8121 !important; }Best regards, Nikola
Thank you very much again Nikola!
looks much better now, thanks to you!
but i have a problem now. when i select a date, and time, the selected parameter text cant been read becuase its the same color. Can i make the selected date and time (when selected) to have the text in white?
Lastly the submit and cancel buttons can have the same button shape as my theme?
Thanks a million
https://shlykovapsycholog.ru/booking/
please try to have a look and try it out when you have the time 🙂
I also added these following codes to enhance the look more as close as possible to my theme:
.ea-bootstrap a { color: #52b02a !important; }
.ui-datepicker a:hover, .ui-datepicker td:hover a { color: #3E8121 !important; }
.ui-datepicker { background-color: #fff; border: 1px solid #52b02a; border-radius: 4px; box-shadow: 0 0 8px rgb(82 174 42 / 0.6) !important; }
.ea-bootstrap .form-control:focus { border-color: #52b02a; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(82 176 42 / 0.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(82 176 42 / 0.6) !important; }
Thank Nikola! 🙂
Now i have a small problem. when i select a date, and time, the selected parameter text cant been read becuase its the same color as the selecetion. Can i make the selected date and time (when selected) to have the text in white?
Lastly the submit and cancel buttons can have the same button shape as my theme?
if you can try it yourself maybe youll understand me better
Hoping to hear from you Nikola regarding my last issue 🙂
Thanks
Lastly i cant seem to align everything to center of my page. i tried modifiying lots of settings in my theme. but didnt achieve what im trying to.
Hi Nicola
I managed to center the calander finally 🙂
But i still cant sort when i select a date, and time, the selected parameter text cant been read becuase its the same color as the selecetion.
Please help when you have time
First without mouse hover. and second photo with mouse hover.
.selected-time:hover { color: white!important; }Best regards, Nikola
Hi Nikola
Thanks a million for getting back to me.
the code you provided doesn’t change anything when i applied it.
Current code i have now is:
.ea-submit { background-color: #52b02a !important; border-color: #52b02a !important; }
.ea-submit:hover { background-color: #3e8121 !important; border-color: #3e8121 !important; }
.ea-bootstrap.ea-bootstrap .selected-time, .ea-bootstrap.ea-bootstrap .selected-time:hover { background-color: #52b02a !important; }
.ea-bootstrap a { color: #52b02a !important; }
.ui-datepicker a:hover, .ui-datepicker td:hover a { color: #3E8121 !important; }
.ui-datepicker { background-color: #fff; border: 1px solid #52b02a; border-radius: 4px; box-shadow: 0 0 8px rgb(82 174 42 / 0.6) !important; }
.ea-bootstrap .form-control:focus { border-color: #52b02a; outline: 0; -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(82 176 42 / 0.6); box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgb(82 176 42 / 0.6) !important; }
.selected-time:hover { color: white!important; }
this row here makes conflict with one that I have suggested in last post:
.ui-datepicker a:hover, .ui-datepicker td:hover a { color: #3E8121 !important; }
can you try without that part
I removed the line: ui-datepicker a:hover, .ui-datepicker td:hover a { color: #3E8121 !important; }
but its still the same Nikola, on hover its showing white font only on time selection (on date its not showing). But both selected Date and time text aren’t showing due to having same color as the block background.
Please login or Register to submit your answer