Browse Source

fix: datepicker make the same width under wheel and normal mode (#1222)

YannLynn 3 years ago
parent
commit
871b126094

+ 22 - 0
packages/semi-foundation/datePicker/datePicker.scss

@@ -20,6 +20,17 @@ $module-list: #{$prefix}-scrolllist;
                 height: 0;
             }
         }
+
+        .#{$module-list}-list-outer {
+            -ms-overflow-style: none; /* Internet Explorer 10+ */
+            scrollbar-width: none; /* Firefox */
+
+            &::-webkit-scrollbar {
+                display: none;
+                width: 0;
+                height: 0;
+            }
+        }
     }
 
     // 双月网格
@@ -174,6 +185,13 @@ $module-list: #{$prefix}-scrolllist;
                 }
             }
 
+            &-item {
+                & > ul > li {
+                    // add paddingRight to make the same width under wheel and normal mode
+                    min-width: $width-datepicker_panel_yam_scrolllist_li_min + $spacing-scrollList_item_wheel_list_outer-paddingRight;
+                }
+            }
+
             &-body {
                 padding: 0;
                 overflow: hidden;
@@ -181,6 +199,10 @@ $module-list: #{$prefix}-scrolllist;
                 .#{$prefix}-scrolllist-item-wheel {
                     border: none;
                 }
+
+                .#{$prefix}-scrolllist-item {
+                    border: none;
+                }
             }
         }
     }

+ 1 - 1
packages/semi-foundation/datePicker/variables.scss

@@ -74,7 +74,7 @@ $spacing-datepicker_insetInput_wrapper-paddingX: 16px;
 $spacing-datepicker_insetInput_wrapper-paddingBottom: 0;
 $spacing-datepicker_insetInput_separator-paddingY: 0;
 $spacing-datepicker_insetInput_separator-paddingX: 4px;
-
+$spacing-scrollList_item_wheel_list_outer-paddingRight: 18px;
 
 // Color
 $color-datepicker_panel-bg-default: var(--semi-color-bg-3); // 日期选择器背景颜色