reactjsmaterial-uitextfieldthai

React Material-UI Textfield padding top - Thai Language


I'm use the library for input. But when use with Thai language, it need additional top padding to display word correctly as Thai has 2 level of vowel. For example, word like "ที่นั่น" will be cut on the top. Below is the code I use.

      <Grid item xs={12} md={10}>
        <TextField required id="name" label="Remark name" fullWidth />
      </Grid>

When i put word "ที่นั่น" inside Textfield will display only this. I try various style to change this but not success.

Screencap run of the code


Solution

  • Thank you for all your comment. For my case, I found out that I need to put paddingTop in InputProps. So, the code I use is:

    const styles = theme => ({
      thaiTextFieldInputProps:{
        paddingTop: '5px'
      },
    });
    

    and then

    <TextField
       InputProps={{
          classes: {
             input: classes.thaiTextFieldInputProps
          }
       }}
       label="Thai Remark"
       fullWidth
    />