你好,
因此,这里是我对日历弹出窗口中的一些错误的描述和一些优化建议。
新选择的日期以错误的语言显示
我目前正在使用德语网站上的“bookingcom of theficial-archbox”。初始显示正常。请参见https://i.imgur.com/gUgmVnS.jpg网站
但是,当我在弹出日历中为“报到日期”选择一个新日期时,新的日期值将以英语格式显示,而不是以德语格式显示。请参见https://i.imgur.com-QDWcuD2.jpg
选择新日期会在浏览器控制台中显示“折旧警告”
折旧警告:提供的值不是可识别的RFC2822或ISO格式。moment构造回到js-Date(),这在所有浏览器和版本中都不可靠。不鼓励使用非RFC2822/ISO日期格式。请参阅http://momentjs.com/guides/#/warnings/js-日期/了解更多信息。论据:[0]_isAMonentObject:true,_isUTC:false,_useUTC:false,_l:undefined,_i:2022-2-10,_f:undefine,_strict:undefinited,_locale:[对象对象]t吨/<@https://my.xyz.com/portal/wp-content/plugins/bookingcom官方搜索框/assets/js/mement with locales.min.js?x10279:1:3274巴/<@https://my.xyz.com/portal/wp-content/plugins/bookingcom-official-searchbox/assets/js/moment-with-locales.min.js?x10279:1:21836ba@https://my.xyz.com/portal/wp-content/plugins/bookingcom-official-searchbox/assets/js/momet-with-locales.min.js?x10279:1:21887Sa@https://my.xyz.com/portal/wp-content/plugins/bookingcom-official-searchbox/assets/js/momet-with-locales.min.js?x10279:1:22453哈@https://my.xyz.com/portal/wp-content/plugins/bookingcom-official-searchbox/assets/js/momet-with-locales.min.js?x10279:1:22535M(M)@https://my.xyz.com/portal/wp-content/plugins/bookingcom-official-searchbox/assets/js/moment-with-locales.min.js?x10279:1:209pickDate@https://my.xyz.com/portal/wp-content/plugins/bookingcom-official-searchbox/assets/js/bos_date.js?10279:307:29像素@javascript:pickDate(2022,02,10,'b_checkin','b_frm');:1:9
弹出日历需要一些CSS调整
1.)弹出式日历需要CSS id“b_calendarPopup”的z索引,以确保元素涵盖“bookingcom-official-searchbox”下的所有其他元素。CSS示例:#b_calendarPopup{z-index:100;}
2.)显示弹出日历时,某些项目(在我的情况下)没有正确显示。请参阅以了解https://i.imgur.com/XJRziHA.jpg网站
以下是我在我的案例中必须进行的一些自定义CSS更改:
a) 在我的情况下,一周中几天的文本颜色是白色(#FFFFFF)。所以你当然不能在白色背景上看到一周中的几天。这可能反映了为“搜索框”选择的文本颜色。我将一周中几天的字体颜色更改为“#385c94”,并将“font-weight”设置为“bold”。
b) 我将“Selected-Day Container”的背景色更改为“#385c94”。
c) 我将“Selected-Day Container”中日期编号的字体颜色更改为“#FFFFFF”,并将“font-weight”设置为“bold”。
我用一些自定义CSS修复了显示错误,但我认为也可以为用户提供一些弹出日历的附加CSS设置。
/*Booking.com-日历-CSS推文-2022年2月4日*/#b_calendar弹出菜单{z指数:100;}.b_calendarInner、.bos_calendar-month、.bos_calendar__row、#flexi_searchbox.bos_month_wrapper select、.b_calFuture a、.b_Cal关闭{颜色:#385c94!重要;不透明度:继承;/*对于Google Chrome*/}.bos_calendar_day-name,.b_calClose a,.bos-calendar__dates.bos-calenar__dete--b_calSelected关闭一个{font-weight:粗体;}.bos-calendar__dates.bos-calender__date--b_cal已选择{背景色:#385c94}.bos-calendar__dates.bos-calender__date--b_calSelected日期{颜色:#ffffff!重要;}
查看结果:https://i.imgur.com/XyaQRMh.jpg网站
最后,我想指出,在弹出日历中选择小字体更适合移动设备。对于台式机来说,小字体不是那么好。
#flexi_搜索框{font:small/1.2宋体,Helvetica,sans-serif;font-weight:正常;字体大小:小;线高:1.2;font-family:宋体,Helvetica,sans-serif;
我建议最好将CSS文件“bos_searchbox.CSS”中的小字体卸载到移动设备的媒体查询中,桌面计算机使用正常字体大小。
我还没有将此更改添加到我的自定义CSS代码中!
对不起,我知道这些是很多建议的更改/请求。但我认为,即使是不了解CSS的用户也应该能够通过附加的CSS设置以简单的方式影响弹出式日历的显示。
顺颂商祺