Thursday, 13 October 2022

Custom range css and full names in month selector: Antd datepicker

I am using antd datepicker for date range purposes. How can I style the selected range css , may be have custom css for the ends of the range and for the in between selected dates. Also when I click on the month, I need the full months name with year like January 2020, February 2020 on top. Right now it just shows the year. Also in the month section it shows Jan, Feb , Mar as months abbreviation. I need that to be full months like January, February

Sandbox: https://codesandbox.io/s/black-breeze-6gmz85?file=/src/styles.css

import React from "react";
import "./styles.css";
import { DatePicker } from "antd";
import "antd/dist/antd.css";
import moment from "moment";

const { RangePicker } = DatePicker;

export default function App() {
  return (
    <div className="App">
      <br />
      <RangePicker />
    </div>
  );
}

Current Range Styling Current Range Picker Behavior



from Custom range css and full names in month selector: Antd datepicker

No comments:

Post a Comment