mirror of
https://github.com/ant-design/ant-design.git
synced 2025-06-11 11:32:52 +08:00
fix(DatePicker): Fixed incorrect cursor when Picker of DatePicker is month and quarter (#40607)
Co-authored-by: Yuiai01 <dujiaqi@kezaihui.com>
This commit is contained in:
parent
c48c712371
commit
f646ba9c3a
@ -321,7 +321,6 @@ export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
|
|||||||
pickerDateHoverRangeBorderColor,
|
pickerDateHoverRangeBorderColor,
|
||||||
borderRadiusSM,
|
borderRadiusSM,
|
||||||
colorTextLightSolid,
|
colorTextLightSolid,
|
||||||
borderRadius,
|
|
||||||
controlItemBgHover,
|
controlItemBgHover,
|
||||||
pickerTimePanelColumnHeight,
|
pickerTimePanelColumnHeight,
|
||||||
pickerTimePanelColumnWidth,
|
pickerTimePanelColumnWidth,
|
||||||
@ -331,8 +330,11 @@ export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
|
|||||||
} = token;
|
} = token;
|
||||||
|
|
||||||
const pickerPanelWidth = pickerPanelCellWidth * 7 + paddingSM * 2 + 4;
|
const pickerPanelWidth = pickerPanelCellWidth * 7 + paddingSM * 2 + 4;
|
||||||
const hoverCellFixedDistance =
|
const commonHoverCellFixedDistance =
|
||||||
(pickerPanelWidth - paddingXS * 2) / 3 - pickerYearMonthCellWidth / 2;
|
(pickerPanelWidth - paddingXS * 2) / 3 - pickerYearMonthCellWidth - paddingSM;
|
||||||
|
|
||||||
|
const quarterHoverCellFixedDistance =
|
||||||
|
(pickerPanelWidth - paddingXS * 2) / 4 - pickerYearMonthCellWidth;
|
||||||
|
|
||||||
return {
|
return {
|
||||||
[componentCls]: {
|
[componentCls]: {
|
||||||
@ -565,6 +567,26 @@ export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
|
|||||||
[`${componentCls}-content`]: {
|
[`${componentCls}-content`]: {
|
||||||
height: pickerQuarterPanelContentHeight,
|
height: pickerQuarterPanelContentHeight,
|
||||||
},
|
},
|
||||||
|
|
||||||
|
// Quarter Panel Special Style
|
||||||
|
[`${componentCls}-cell-range-hover-start::after`]: {
|
||||||
|
insetInlineStart: quarterHoverCellFixedDistance,
|
||||||
|
borderInlineStart: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
||||||
|
|
||||||
|
[`${componentCls}-panel-rtl &`]: {
|
||||||
|
insetInlineEnd: quarterHoverCellFixedDistance,
|
||||||
|
borderInlineEnd: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
[`${componentCls}-cell-range-hover-end::after`]: {
|
||||||
|
insetInlineEnd: quarterHoverCellFixedDistance,
|
||||||
|
borderInlineEnd: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
||||||
|
|
||||||
|
[`${componentCls}-panel-rtl &`]: {
|
||||||
|
insetInlineStart: quarterHoverCellFixedDistance,
|
||||||
|
borderInlineStart: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
||||||
|
},
|
||||||
|
},
|
||||||
},
|
},
|
||||||
|
|
||||||
// ======================== Footer ========================
|
// ======================== Footer ========================
|
||||||
@ -638,37 +660,51 @@ export const genPanelStyle = (token: SharedPickerToken): CSSObject => {
|
|||||||
},
|
},
|
||||||
|
|
||||||
[`${componentCls}-cell-range-hover-start::after`]: {
|
[`${componentCls}-cell-range-hover-start::after`]: {
|
||||||
insetInlineStart: hoverCellFixedDistance,
|
|
||||||
borderInlineStart: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
|
||||||
borderStartStartRadius: borderRadiusSM,
|
borderStartStartRadius: borderRadiusSM,
|
||||||
borderBottomStartRadius: borderRadiusSM,
|
borderEndStartRadius: borderRadiusSM,
|
||||||
borderStartEndRadius: 0,
|
borderStartEndRadius: 0,
|
||||||
borderBottomEndRadius: 0,
|
borderEndEndRadius: 0,
|
||||||
|
|
||||||
[`${componentCls}-panel-rtl &`]: {
|
[`${componentCls}-panel-rtl &`]: {
|
||||||
insetInlineEnd: hoverCellFixedDistance,
|
|
||||||
borderInlineEnd: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
|
||||||
borderStartStartRadius: 0,
|
borderStartStartRadius: 0,
|
||||||
borderBottomStartRadius: 0,
|
borderEndStartRadius: 0,
|
||||||
borderStartEndRadius: borderRadiusSM,
|
borderStartEndRadius: borderRadiusSM,
|
||||||
borderBottomEndRadius: borderRadiusSM,
|
borderEndEndRadius: borderRadiusSM,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
[`${componentCls}-cell-range-hover-end::after`]: {
|
[`${componentCls}-cell-range-hover-end::after`]: {
|
||||||
insetInlineEnd: hoverCellFixedDistance,
|
|
||||||
borderInlineEnd: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
|
||||||
borderStartStartRadius: 0,
|
borderStartStartRadius: 0,
|
||||||
borderBottomStartRadius: 0,
|
borderEndStartRadius: 0,
|
||||||
borderStartEndRadius: borderRadius,
|
borderStartEndRadius: borderRadiusSM,
|
||||||
borderBottomEndRadius: borderRadius,
|
borderEndEndRadius: borderRadiusSM,
|
||||||
|
|
||||||
[`${componentCls}-panel-rtl &`]: {
|
[`${componentCls}-panel-rtl &`]: {
|
||||||
insetInlineStart: hoverCellFixedDistance,
|
borderStartStartRadius: borderRadiusSM,
|
||||||
borderInlineStart: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
borderEndStartRadius: borderRadiusSM,
|
||||||
borderStartStartRadius: borderRadius,
|
|
||||||
borderBottomStartRadius: borderRadius,
|
|
||||||
borderStartEndRadius: 0,
|
borderStartEndRadius: 0,
|
||||||
borderBottomEndRadius: 0,
|
borderEndEndRadius: 0,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
[`&-year-panel,
|
||||||
|
&-month-panel`]: {
|
||||||
|
[`${componentCls}-cell-range-hover-start::after`]: {
|
||||||
|
insetInlineStart: commonHoverCellFixedDistance,
|
||||||
|
borderInlineStart: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
||||||
|
|
||||||
|
[`${componentCls}-panel-rtl &`]: {
|
||||||
|
insetInlineEnd: commonHoverCellFixedDistance,
|
||||||
|
borderInlineEnd: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
||||||
|
},
|
||||||
|
},
|
||||||
|
[`${componentCls}-cell-range-hover-end::after`]: {
|
||||||
|
insetInlineEnd: commonHoverCellFixedDistance,
|
||||||
|
borderInlineEnd: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
||||||
|
|
||||||
|
[`${componentCls}-panel-rtl &`]: {
|
||||||
|
insetInlineStart: commonHoverCellFixedDistance,
|
||||||
|
borderInlineStart: `${lineWidth}px dashed ${pickerDateHoverRangeBorderColor}`,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
Loading…
Reference in New Issue
Block a user