[英]Angular ui-bootstrap datepicker change theme
I have a angular datepicker that shows like this - 我有一个像这样显示的有角日期选择器-
This datepicker is huge and covers up almost 30% of the screen and also, dates have huge gaps among them. 这个日期选择器非常庞大,几乎占据了屏幕的30%,而且日期之间也有很大的差距。
Now I suspect that this is happening because I have styled my tables and buttons for the whole project. 现在,我怀疑这种情况正在发生,因为我已经为整个项目设置了表格和按钮的样式。 How do I change/style my datepicker so my table and button styling does not affect the datepicker. 我如何更改/设置日期选择器的样式,以便表和按钮的样式不会影响日期选择器。
PS : I tried styling it with .datepicker
syntax, did not work. PS :我尝试使用.datepicker
语法设置样式,但是没有用。 Thanks. 谢谢。
I had a similar problem in my website as well when using ui-bootstrap datepicker. 使用ui-bootstrap datepicker时,我的网站也有类似的问题。 The datepicker is good with many features but finding a way to customize it becomes a pain. 日期选择器具有很多功能,但是找到一种自定义日期选择器的方法很麻烦。
Coming to your problem, I have few suggestions: 关于您的问题,我有几点建议:
The datepicker will take the CSS that you have by default for table, th, td, tr in your website. 日期选择器将采用您网站上表,th,td,tr的默认CSS。 Find a way to specify the styling for uib-datepicker-popup. 找到一种方法来指定uib-datepicker-popup的样式。
Try using a custom template as mentioned in the website documentation. 尝试使用网站文档中提到的自定义模板。 Check this out 看一下这个
This link will be useful - http://stackoverflow.com/questions/36801772/how-do-i-change-the-uib-datepicker-popup-button-bar 此链接将非常有用-http: //stackoverflow.com/questions/36801772/how-do-i-change-the-uib-datepicker-popup-button-bar
You actually need CSS tricks. 您实际上需要CSS技巧。 like: 喜欢:
#someContainer div.uib-datepicker {...}
or #someContainer div.uib-datepicker > table > tbody > tr > td {...}
(well, doing this with css-preprocessors are quite easy) 使您的选择器更强大,例如#someContainer div.uib-datepicker {...}
或#someContainer div.uib-datepicker > table > tbody > tr > td {...}
(好吧,使用CSS预处理程序是很简单) By the way, adm-dtp
module might be more helpful. 顺便说一句, adm-dtp
模块可能会更有用。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.