elementUI 修改日期组件样式

<div class="search">
                <el-date-picker v-model="dateTime" type="daterange" range-separator="至" start-placeholder="开始日期"
                    end-placeholder="结束日期" value-format="yyyy-MM-dd" popper-class="date-style">
                </el-date-picker>
            </div>



<style lang="less" scoped>
.search{
        /deep/.el-date-editor {
            width: 60%;
            height: 40px;
            border: solid 1px rgb(20, 117, 166);
            background: rgba(0, 0, 0, 0.7);
            margin-right: 15px;
            display: flex;
            align-items: center;
            justify-content: space-between;
            .el-range-input {
              background: transparent;
              font-size: 16px;
              color: rgb(72, 178, 178);
              margin-top: 4px;
            }
            .el-range-separator {
              color: rgb(72, 178, 178);
              display: flex;
              align-items: center;
            }
            .el-range__icon {
              color: rgb(72, 178, 178);
              align-items: center;
              display: flex;
            }
            & ::placeholder {
              color: rgb(72, 178, 178);
            }
            .el-range__close-icon {
              display: flex;
              align-items: center;
              color: rgb(72, 178, 178);
              margin-right: -10px;
              display: none;
            }
          }
        }
</style>

<style lang="less">
.date-style {
  border: 1px solid #1371a3;
  border-radius: 0;
  background-color: rgba(0, 0, 0, 0.9);
  .el-date-range-picker__content.is-left{
    border-color: #1371a3;
  }
  .el-date-table th{
    color: #fff;
    border-color: #1371a3;
  }
  .el-date-table td span{
    line-height: 21px;
  }
  .el-date-table .in-range{
    color: #1371a3;
    background: transparent;
    > div{
      background: rgb(30, 69, 128);
    }
    :hover{
      background: rgba(30, 69, 128, .3);
    }
  }
}
/* 时间下拉框小三角样式 */
.date-style .popper__arrow {
  top: -7px !important;
  border-bottom-color: #0ceff5 !important;
  border-top-color: #0ceff5 !important;
}
.date-style .popper__arrow::after {
  border-bottom-color: #0ceff5 !important;
  border-top-color: #0ceff5 !important;
}
</style>