fix(time-range): [time-picker,date-picker] modify style

opentiny · Nov 4, 2024 · ac7730d · ac7730d
1 parent fe88459
commit ac7730d
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 28 deletions.
diff --git a/packages/theme/src/time-range/index.less b/packages/theme/src/time-range/index.less
@@ -24,7 +24,6 @@
   &__content {
     position: relative;
     text-align: center;
-    padding: var(--tv-TimeRange-content-padding);
     display: flex;
     justify-content: flex-start;
     align-items: flex-start;
@@ -39,31 +38,26 @@
     display: flex;
     justify-content: space-around;
     color: var(--tv-TimeRange-header-text-color);
-    padding: 8px;
-    height: 30px;
+    padding: var(--tv-TimeRange-title-padding);
     align-items: center;
-    line-height: 30px;
   }
 
   &__cell {
-    box-sizing: border-box;
-    margin: 0;
-    padding: var(--tv-TimeRange-cell-padding);
     width: 50%;
+
+    .tiny-time-panel__content {
+      padding-bottom: var(--tv-TimeRange-cell-content-padding-bottom);
+    }
   }
 
   &__header {
     height: var(--tv-TimeRange-header-height);
     color: var(--tv-TimeRange-header-text-color);
     line-height: var(--tv-TimeRange-header-line-height);
-    margin-bottom: var(--tv-TimeRange-header-margin-bottom);
+    padding: var(--tv-TimeRange-header-padding);
     text-align: left;
     font-size: var(--tv-TimeRange-font-size);
-    border-bottom: 1px solid var(--tv-TimeRange-header-border-bottom);
-
-    span {
-      margin-left: var(--tv-TimeRange-header-margin-left);
-    }
+    border-bottom: 1px solid var(--tv-TimeRange-border-color-divider);
   }
 
   &__body {
@@ -73,9 +67,6 @@
   &__footer {
     border-top: 1px solid var(--tv-TimeRange-border-color-divider);
     padding: var(--tv-TimeRange-footer-padding);
-    height: var(--tv-TimeRange-footer-height);
-    box-sizing: border-box;
-    margin-top: 12px;
     display: flex;
     justify-content: flex-end;
     align-items: center;

diff --git a/packages/theme/src/time-range/vars.less b/packages/theme/src/time-range/vars.less
@@ -19,27 +19,25 @@
   --tv-TimeRange-border-color-divider: var(--tv-color-border-divider, #f0f0f0);
 
   // 单元格内间距
-  --tv-TimeRange-cell-padding: 0px;
-  // 内容区内间距
-  --tv-TimeRange-content-padding: 0px;
+  --tv-TimeRange-cell-content-padding-bottom: var(--tv-space-xl, 16px);
 
   // 头部高度
   --tv-TimeRange-header-height: var(--tv-size-height-xl, 48px);
   // 头部行高
-  --tv-TimeRange-header-line-height: calc(var(--tv-size-height-xl, 48px) - 2px);
-  // 头部底部外间距
-  --tv-TimeRange-header-margin-bottom: 0px;
+  --tv-TimeRange-header-line-height: 48px;
+
   // 头部文本色
   --tv-TimeRange-header-text-color: var(--tv-color-text-weaken, #808080);
-  // 头部右侧外间距
-  --tv-TimeRange-header-margin-left: var(--tv-space-xl, 16px);
+  // 头部内间距
+  --tv-TimeRange-header-padding: 0 var(--tv-space-xl, 16px);
+  // 标题内间距
+  --tv-TimeRange-title-padding: var(--tv-space-lg, 12px) var(--tv-space-md, 8px) var(--tv-space-md, 8px)
+    var(--tv-space-md, 8px);
 
-  // 底部高度
-  --tv-TimeRange-footer-height: 56px;
   // 底部内间距
-  --tv-TimeRange-footer-padding: var(--tv-space-xl, 16px) var(--tv-space-xl, 16px) 0 0;
+  --tv-TimeRange-footer-padding: var(--tv-space-xl, 16px);
 
-  //按钮内间距
+  // 按钮内间距
   --tv-TimeRange-btn-padding: 0 var(--tv-space-sm, 4px);
   // 按钮高度
   --tv-TimeRange-btn-height: var(--tv-size-height-sm, 28px);