且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

材质UI主题全局密集设置

更新时间:2023-12-04 21:54:16

您可以为任何Material-UI组件道具设置默认值.请参阅此处的文档:

对于无法使用 props 控制的方面,您可以使用 覆盖主题的键,以覆盖每个组件的CSS.

Is there a way to set global Dense setting preferably somewhere inside theme config? I'm building applications exclusively for desktop users and would like more information to be on the screen.

Gmail already has this option

And many individual components have property to make them more compact.

You can set default values for any Material-UI component props. See the documentation here: https://material-ui.com/customization/globals/#default-props.

For instance to default all Material-UI List components to be dense, you would have the following in your theme:

const theme = createMuiTheme({
  props: {
    MuiList: {
      dense: true
    }
  }
});

For aspects that can't be controlled using props, you can use the overrides key of the theme to override CSS for each component.