LoginSignup
0
0

More than 5 years have passed since last update.

Material-uiのDialogを高さ100%にする(v0.14.4限定)

Posted at

v0.14.4限定の超暫定対処ですが、Material-uiのDialogを高さ100%にするオプションを追加しました。

このDialog、上下にpaddingがあって、高さ100%になりません。
なのでスマホとか狭い画面では致命的に使えません。

今回プロダクションで必要になったため急遽無理やりに対応しました。
サンプルは、
https://github.com/p-l-interface/material-ui/tree/custom-v0.14.4-release/examples/dialog-full-height-example
です。

フォークして、v0.14.4を改造してます。
https://github.com/p-l-interface/material-ui/tree/custom-v0.14.4-release

rootで buildして、できたlib/dialog.jsを
examples/dialog-full-height-example/node_modules/material-ui/lib/dialog.jsと入れ替えると動きます。

実際に使うときは、それなりに配置してください


 <Dialog
          open={this.state.open}
          title="Super Secret Password"
          actions={standardActions}
          modal={true}
          onRequestClose={this.handleRequestClose}
          autoScrollBodyContent={true}
          fullWidth={false}
          fullHeight={true}

        >

ついでに、fullWidthも追加しました。
fullHeight={true}にした場合は、縦横100%になります。

おちついたら、ちゃんとつくってmaterial-uiにプルリクしようと思います。

0
0
1

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0