diff --git a/libs/ui/src/lib/input/AmharicDatePicker.css b/libs/ui/src/lib/input/AmharicDatePicker.css index 5520848e9..d7cffeeb8 100644 --- a/libs/ui/src/lib/input/AmharicDatePicker.css +++ b/libs/ui/src/lib/input/AmharicDatePicker.css @@ -74,9 +74,13 @@ position: absolute; inset-block-start: 0; inset-inline-end: 0; + inset-block-end: auto; + inset-inline-start: auto; display: flex; align-items: center; + gap: 0.25rem; height: var(--rdp-nav-height); + z-index: 10; } .amharic-daypicker .rdp-button_previous, @@ -88,6 +92,7 @@ height: var(--rdp-nav_button-height); padding: 0; margin: 0; + flex-shrink: 0; } .amharic-daypicker .rdp-dropdowns { @@ -138,6 +143,7 @@ border: 1px solid var(--mantine-color-default-border); border-radius: var(--mantine-radius-sm); background-color: var(--mantine-color-body); + cursor: pointer; } .amharic-daypicker .rdp-button_previous:not([aria-disabled='true']):hover, diff --git a/libs/ui/src/lib/input/AmharicDatePicker.tsx b/libs/ui/src/lib/input/AmharicDatePicker.tsx index e883beb73..ee1071712 100644 --- a/libs/ui/src/lib/input/AmharicDatePicker.tsx +++ b/libs/ui/src/lib/input/AmharicDatePicker.tsx @@ -293,7 +293,6 @@ export function AmharicDatePicker({ defaultMonth={selected ?? undefined} endMonth={YEAR_DROPDOWN_END} numerals="latn" - captionLayout="dropdown" formatters={ETH_FORMATTERS} onSelect={(date: Date | undefined) => { onChange?.(date ? formatWireValue(mergeDateTime(selected, date), dateFormat, withTime) : ''); @@ -307,7 +306,6 @@ export function AmharicDatePicker({ selected={selected ?? undefined} defaultMonth={selected ?? undefined} endMonth={YEAR_DROPDOWN_END} - captionLayout="dropdown" onSelect={(date: Date | undefined) => { onChange?.(date ? formatWireValue(mergeDateTime(selected, date), dateFormat, withTime) : ''); if (!withTime) close();