Open1
【Material-UI】disabledした項目のスタイルを変更する
yu.miyoshi概要
disabled属性をつけ、自動的に変更されるスタイルを再度変更する
対応内容
material-uiのTextField内でdisabled属性をつけた時について確認
・disabledつけないとき
・disabled属性を付与すると、以下の画像のようにグレーアウトする
今回このグレーアウトをさせないようにしたい
Globalなスタイル設定
/src/theme.ts
import { createMuiTheme } from '@material-ui/core/styles'
const theme = createMuiTheme({
palette: {
text: {
disabled: 'red',
},
},
})
export default theme
disabled属性を付与した項目の文字色を変更する情報を記述し、importすると
文字色の変更ができた
枠色の変更なども可能
/src/theme.ts
import { createMuiTheme } from '@material-ui/core/styles'
const theme = createMuiTheme({
palette: {
action: {
disabled: 'red',
},
},
})
export default theme
枠色の変更ができた
その他詳しい変更は下記公式サイトからご確認ください
参考サイト