希望改变 react-datepicker 组件中所显示的日历外观

在实现日期范围选择时使用 react-datepicker，由于我修改了一些 CSS，所以写下备忘录。如果不需要指定范围，可以参考我提供的文章，但在指定范围时（选择开始日期但尚未确定结束日期），有一些颜色等需要修改的地方，因此我进行了添加和删除。

引入程序

npm install react-datepicker --save
npm install @types/react-datepicker

默认的日历

完成的日历 de

进行实施

...
// CSS
import "react-datepicker/dist/react-datepicker.css";
import "../../assets/styles/date-picker.css";
// 日本語化
import ja from "date-fns/locale/ja";
registerLocale("ja", ja);
...
retutn (
    <Datepicker
        selected={startDate}
        onChange={handleDatesChange}
        startDate={startDate}
        endDate={endDate}
        inline={inline}
        dateFormat="yyyy/MM/dd" // デフォだと「dd/MM/YYYY」なので
        locale="ja" // 上で設定した日本語化をここで設定
        minDate={MIN_DATE}
        maxDate={MAX_DATE}
        monthsShown={monthsShown}
        selectsRange
    />
)

.react-datepicker-wrapper,
.react-datepicker__input-container {
  display: block;
}

/* 曜日から上のヘッダー部分 */ 
.react-datepicker__header {
  background-color: #fff;
}

/* 曜日の下の線 */
.react-datepicker__header,
.react-datepicker__time-container {
  border-color: #fff;
}
 
/* 日付ホバー時 */
.react-datepicker__day:hover {
  background: #db4d6d;
  color: #fafafa;
}

 /* 曜日 */ 
.react-datepicker__day-name {
  color: rgba(0, 0, 0, 0.54);
}

/* 今日の日付 */
.react-datepicker__day--keyboard-selected,
.react-datepicker__month-text--keyboard-selected,
.react-datepicker__quarter-text--keyboard-selected,
.react-datepicker__year-text--keyboard-selected {
  border-radius: 0.3rem;
  background-color: #fff; /* デフォだと今日の日付に色がつくので白に上書き */
}

/* 選択された日付 */
.react-datepicker__day--selected,
.react-datepicker__day--in-selecting-range,
.react-datepicker__day--in-range,
.react-datepicker__month-text--selected,
.react-datepicker__month-text--in-selecting-range,
.react-datepicker__month-text--in-range,
.react-datepicker__time-container
  .react-datepicker__time
  .react-datepicker__time-box
  ul.react-datepicker__time-list
  li.react-datepicker__time-list-item--selected {
  background: #e87a90;
  font-weight: normal;
  color: #fafafa;
}

/* 選択中の日付 */ 
.react-datepicker__day--in-selecting-range:not(
    .react-datepicker__day--in-range,
    .react-datepicker__month-text--in-range,
    .react-datepicker__quarter-text--in-range,
    .react-datepicker__year-text--in-range
  ),
.react-datepicker__month-text--in-selecting-range:not(
    .react-datepicker__day--in-range,
    .react-datepicker__month-text--in-range,
    .react-datepicker__quarter-text--in-range,
    .react-datepicker__year-text--in-range
  ),
.react-datepicker__quarter-text--in-selecting-range:not(
    .react-datepicker__day--in-range,
    .react-datepicker__month-text--in-range,
    .react-datepicker__quarter-text--in-range,
    .react-datepicker__year-text--in-range
  ),
.react-datepicker__year-text--in-selecting-range:not(
    .react-datepicker__day--in-range,
    .react-datepicker__month-text--in-range,
    .react-datepicker__quarter-text--in-range,
    .react-datepicker__year-text--in-range
  ) {
  background-color: #f596aa;
}

请提供更多的上下文信息，这样我才能为您进行准确的翻译。