CSS problem for datepicker
Permalink Browser Info Environment
Hello,
I've noticed a problem with the CSS of the calendar for datepicker field, see attached file.
I've solved it quick&dirty by adding "background-color: #fff;" into "application/blocks/[myblock]/css_form/bootstrap-datetimepicker.min.css" for ".bootstrap-datetimepicker-widget".
I use blockdesigner v2.6.1 and concrete5.7.5.6 ; I've not tested with the last version of blockdesigner but I don't see this problem solved into changelog.
Please check this problem and thank you for solving it if it's not done yet.
I've noticed a problem with the CSS of the calendar for datepicker field, see attached file.
I've solved it quick&dirty by adding "background-color: #fff;" into "application/blocks/[myblock]/css_form/bootstrap-datetimepicker.min.css" for ".bootstrap-datetimepicker-widget".
I use blockdesigner v2.6.1 and concrete5.7.5.6 ; I've not tested with the last version of blockdesigner but I don't see this problem solved into changelog.
Please check this problem and thank you for solving it if it's not done yet.
Type: | Discussion |
---|---|
Status: | Resolved |
Hi there,
What happens when you switch to your default theme (Elemental), does it still happen then? I've just tested with 5.7.5 and 8.3.2 versions of concrete5, and it's all OK (default Elemental theme). I'm guessing your theme CSS does something for this element, so that it's transparent (.dropdown-menu). Can you confirm?
Kind regards,
Ramon
What happens when you switch to your default theme (Elemental), does it still happen then? I've just tested with 5.7.5 and 8.3.2 versions of concrete5, and it's all OK (default Elemental theme). I'm guessing your theme CSS does something for this element, so that it's transparent (.dropdown-menu). Can you confirm?
Kind regards,
Ramon
Hello,
I don't use Elemental theme and I can't test by using it because I use custom area.
In attached screenshot, you can see CSS applied to datepicker with my theme :
- I've added "background-color:white" and "border:1px solid lightgrey" to datepicker css
- "border:0" of my grid.css explains why border is missing
- but none of my css deletes background color and no background color is applied to datepicker (except the one I've added).
I have no .dropdown-menu class in my css.
Cordially
I don't use Elemental theme and I can't test by using it because I use custom area.
In attached screenshot, you can see CSS applied to datepicker with my theme :
- I've added "background-color:white" and "border:1px solid lightgrey" to datepicker css
- "border:0" of my grid.css explains why border is missing
- but none of my css deletes background color and no background color is applied to datepicker (except the one I've added).
I have no .dropdown-menu class in my css.
Cordially
Hi Cordially,
I've just updated Block Designer, so it adds the extra needed CSS styling whenever "bootstrap-modified" or Bootstrap in general is not loaded. That means it should be working with your non-Bootstrap theme now!
Let me know if this fixed your issues.
Kind regards,
Ramon
I've just updated Block Designer, so it adds the extra needed CSS styling whenever "bootstrap-modified" or Bootstrap in general is not loaded. That means it should be working with your non-Bootstrap theme now!
Let me know if this fixed your issues.
Kind regards,
Ramon
Hello Ramon,
It works great in that case, thanks for your job.
Cordially
Fred :-)
It works great in that case, thanks for your job.
Cordially
Fred :-)
For future blocks, I've also added "background-color:white;border:1px solid lightgrey" into "packages\block_designer\src\FieldType\DateTimeFieldType\css\bootstrap-datetimepicker.min.css" for ".bootstrap-datetimepicker-widget".
See result attached.
I've looked into BlockDesigner 3.1.0 source code and this CSS is still missing.
Please have a look at this problem.