search

creativetimofficial / ct-material-dashboard-pro-react

React version of Material Dashboard Pro
135 stars 26 forks source link

[Bug] Text overlapped in the FormField component #335

Open wangjian1106 opened 6 months ago

wangjian1106 commented 6 months ago

Version

2.2.0

Reproduction link

Operating System

macOS Sonoma 14.1.2

Device

Macbook Pro M2

Browser & Version

Google Chrome 122.0.6261.94

Steps to reproduce

  1. Open file /src/layouts/pages/users/new-user/schemas/form.js
  2. Change form.formField.company.type from "text" to "date"
  3. Execute "npm start" to run the application
  4. Click "Pages -> Users -> New User" to open the page
  5. Check the date picker

    What is expected?

    Only label shows in the the FormField component when the FormField component is not focused.

    What is actually happening?

    Both label and date format shows in the the FormField component when the FormField component is not focused. The label and date format overlapped.

    Screenshots

    case: variant="standard"

    image

    case: variant="outlined"

    image

    case: variant="outlined" with error

    image

    Note that the error mark is also overlapped with the date picker button at the right side of the FormField component.

Solution

Additional comments

My computer's language is Chinese, and the date format in the FormField component is 年/月/日.