elementui日期选择器修改

这段时间要重新设计页面，根据ui设计图来看，我们画风改为了暗黑风，看着像微星的bios

， 所以这个日期选择器，样式还是要修改。原本我想用vdeep的方式来修改样式。但简单看了下选择框的实现，是通过外面上了一层el-popup，所以deep应该是没办法实现了。

根据我之前修改下拉选择框的经验，我怀疑日期选择器也有同样的属性可以设置。但是真没有。

那我就在body上套一个类来控制全局样式，用笨方法一层一层到下面去修改。先在App.vue里的created里加上样式名

document.body.classList.add('estimate-dark')

之后再去全局样式表里，写这个类名。然后再观察日期选择器的具体样式。首先把背景色改了

.estimate-dark {

  .el-picker-panel.el-date-picker.el-popper {

    background: linear-gradient(180deg, #313131 0%, #1a1a1a 100%);

    .el-picker-panel__icon-btn {

      color: #ffffff !important;}

    .el-month-table td.disabled .cell {

      background: rgba(255, 255, 255, 0.3) !important;} }}

再看一下，已经大差不差了，再修改下鼠标悬浮样式就行了

:hover {
              color: #ffffff;
              border-radius: 4px;
              opacity: 0.4;
              text-decoration:none;
              background: linear-gradient(
                180deg,
                rgba(255, 255, 255, 0.502) 0%,
                rgba(255, 255, 255, 0.051) 100%
              );
              box-sizing: border-box;
              border: 1px solid #ffffff;
              box-shadow: inset 0px 3px 6px 0px rgba(255, 255, 255, 0.1608);
            }

ok，完工