时间选择样式调整

src/views/cockpitNew1/datePicker.scss

@@ -1,107 +1,109 @@
 // .el-date-editor .el-range__close-icon {
 //     display: none;
 //   }
-  
-  .el-picker-panel__sidebar {
-    background: #002446;
-    border-color: rgba(37, 103, 141, 0.46);
-    border-radius: 6px 0 0 6px;
-  
-    .el-picker-panel__shortcut {
-      color: rgba(255, 255, 255, 1);
-    }
-  }
-  
-  //// 时间选择器  通用样式
-  .el-date-editor--daterange.el-input__inner {
-    // width: 200px;
-    background: #002446;
-  }
-  
-  .el-date-editor .el-range-separator {
-    padding: 0;
-    height: 78%;
-  }
-  
-  .el-date-editor .el-range__close-icon {
-    line-height: 23px;
-  }
-  
-  .el-date-editor .el-range__icon {
-    line-height: 22px;
-  }
-  
-  .el-date-picker__header-label {
-    color: #fff;
-  }
-  
-  .el-range-input {
-    background: #002446;
-    font-size: 12px;
-    font-weight: 400;
+
+.el-picker-panel__sidebar {
+  background: #002446;
+  border-color: rgba(37, 103, 141, 0.46);
+  border-radius: 6px 0 0 6px;
+
+  .el-picker-panel__shortcut {
     color: rgba(255, 255, 255, 1);
   }
-  
-  .el-range-separator {
-    line-height: 20px !important;
-    color: rgba(255, 255, 255, 1) !important;
-  }
-  
-  .el-date-editor .el-range-input {
-    font-size: 12px;
-    font-weight: 400;
-    color: rgba(255, 255, 255, 1);
-  }
-  
-  .el-picker-panel,
-  .el-time-panel {
-    background: #002446 !important;
-    border: 1px solid rgba(37, 103, 141, 0.46);
-    color: #fff;
-    border-radius: 6px;
-  }
-  
-  .el-time-spinner__item {
-    color: #fff;
-  
-    &.active:not(.disabled) {
-      color: #fff;
-    }
-  
-    &:hover {
-      background: transparent !important;
-      color: rgb(64, 158, 255); //#3B5064
-    }
-  }
-  
-  .el-date-range-picker__content.is-left {
-    border-right: 1px solid rgba(37, 103, 141, 0.46);
-    color: #fff;
-  }
-  
-  .el-date-table td.in-range div,
-  .el-date-table td.in-range div:hover,
-  .el-date-table.is-week-mode .el-date-table__row.current div,
-  .el-date-table.is-week-mode .el-date-table__row:hover div {
-    background: rgba(23, 94, 165, 0.31) !important;
-  }
-  
-  .el-date-table th {
+}
+
+//// 时间选择器  通用样式
+.el-date-editor--daterange.el-input__inner {
+  // width: 200px;
+  background: #002446;
+  padding: 0;
+  padding-left: 7px;
+}
+
+.el-date-editor .el-range-separator {
+  padding: 0;
+  height: 78%;
+}
+
+.el-date-editor .el-range__close-icon {
+  line-height: 23px;
+}
+
+.el-date-editor .el-range__icon {
+  line-height: 22px;
+}
+
+.el-date-picker__header-label {
+  color: #fff;
+}
+
+.el-range-input {
+  background: #002446;
+  font-size: 12px;
+  font-weight: 400;
+  color: rgba(255, 255, 255, 1);
+}
+
+.el-range-separator {
+  line-height: 20px !important;
+  color: rgba(255, 255, 255, 1) !important;
+}
+
+.el-date-editor .el-range-input {
+  font-size: 12px;
+  font-weight: 400;
+  color: rgba(255, 255, 255, 1);
+}
+
+.el-picker-panel,
+.el-time-panel {
+  background: #002446 !important;
+  border: 1px solid rgba(37, 103, 141, 0.46);
+  color: #fff;
+  border-radius: 6px;
+}
+
+.el-time-spinner__item {
+  color: #fff;
+
+  &.active:not(.disabled) {
     color: #fff;
   }
-  
-  .el-date-table td.next-month,
-  .el-date-table td.prev-month {
-    color: #747985;
+
+  &:hover {
+    background: transparent !important;
+    color: rgb(64, 158, 255); //#3B5064
   }
-  
-  // 选择器箭头方向
-  .el-input__suffix-inner .el-icon-arrow-down:before {
-    content: " ";
-    border-top: 8px solid #64daff !important;
-    border-bottom: 8px solid transparent !important;
-    border-left: 5.5px solid transparent !important;
-    border-right: 5.5px solid transparent !important;
-    position: relative;
-    top: 12px;
-  }
+}
+
+.el-date-range-picker__content.is-left {
+  border-right: 1px solid rgba(37, 103, 141, 0.46);
+  color: #fff;
+}
+
+.el-date-table td.in-range div,
+.el-date-table td.in-range div:hover,
+.el-date-table.is-week-mode .el-date-table__row.current div,
+.el-date-table.is-week-mode .el-date-table__row:hover div {
+  background: rgba(23, 94, 165, 0.31) !important;
+}
+
+.el-date-table th {
+  color: #fff;
+}
+
+.el-date-table td.next-month,
+.el-date-table td.prev-month {
+  color: #747985;
+}
+
+// 选择器箭头方向
+.el-input__suffix-inner .el-icon-arrow-down:before {
+  content: " ";
+  border-top: 8px solid #64daff !important;
+  border-bottom: 8px solid transparent !important;
+  border-left: 5.5px solid transparent !important;
+  border-right: 5.5px solid transparent !important;
+  position: relative;
+  top: 12px;
+}