mirrors/shlink-web-client
1
0
Fork 0
mirror of https://github.com/shlinkio/shlink-web-client.git synced 2024-12-23 09:30:31 +03:00
Code Issues Projects Releases Packages Wiki Activity

Removed duplicated CSS from DateInput

Browse source
This commit is contained in:
Alejandro Celaya 2023-03-14 08:50:53 +01:00
parent 3be5126e2d
commit 999b21577a
2 changed files with 3 additions and 27 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

24
src/utils/dates/DateInput.scss
View file

@ -1,30 +1,6 @@
@import '../mixins/vertical-align'; @import '../mixins/vertical-align';
@import '../base'; @import '../base';
.date-input-container {
position: relative;
}
.date-input-container__input {
padding-right: 35px !important;
}
.date-input-container__input:not(:disabled) {
background-color: var(--primary-color) !important;
}
.card .date-input-container__input:not(:disabled),
.dropdown .date-input-container__input:not(:disabled) {
background-color: var(--input-color) !important;
}
.date-input-container__icon {
@include vertical-align();
right: .75rem;
cursor: pointer;
}
.react-datepicker__close-icon.react-datepicker__close-icon { .react-datepicker__close-icon.react-datepicker__close-icon {
@include vertical-align(); @include vertical-align();

6
src/utils/dates/DateInput.tsx
View file

@ -16,7 +16,7 @@ export const DateInput = (props: DateInputProps) => {
const ref = useRef<{ input: HTMLInputElement }>(); const ref = useRef<{ input: HTMLInputElement }>();
return ( return (
<div className="date-input-container"> <div className="icon-input-container">
<DatePicker <DatePicker
{...props} {...props}
popperModifiers={[ popperModifiers={[
@ -26,14 +26,14 @@ export const DateInput = (props: DateInputProps) => {
}, },
]} ]}
dateFormat={dateFormat ?? STANDARD_DATE_FORMAT} dateFormat={dateFormat ?? STANDARD_DATE_FORMAT}
className={classNames('date-input-container__input form-control', className)} className={classNames('icon-input-container__input form-control', className)}
// @ts-expect-error The DatePicker type definition is wrong. It has a ref prop // @ts-expect-error The DatePicker type definition is wrong. It has a ref prop
ref={ref} ref={ref}
/> />
{showCalendarIcon && ( {showCalendarIcon && (
<FontAwesomeIcon <FontAwesomeIcon
icon={calendarIcon} icon={calendarIcon}
className="date-input-container__icon" className="icon-input-container__icon"
onClick={() => ref.current?.input.focus()} onClick={() => ref.current?.input.focus()}
/> />
)} )}