Glass MUI

Repository providing theming utilities and custom components implimenting the Glass Design framework.

This library is intended to be used in conjunction with the MUI (Material-ui) component library:

https://mui.com/material-ui/

Installation

Using npm:

npm i glass-mui

Usage

Theme Provider

The Glass Theme Provider acts as a convenience wrapper for the standard MUI Theme Provider by automatically specifying the use of the Glass Theme in the provider's props.

The Theme Provider's usage replicates that of the MUI Theme Provider:

https://mui.com/material-ui/customization/theming/

import { GlassThemeProvider } from "glass-mui";

<GlassThemeProvider>
  <App/>
</GlassThemeProvider>

Props

cssBaseline - The theme provider includes the MUI CssBaseline component in the wrapper by default. This can be disabled by setting the value of this prop to false

<GlassThemeProvider cssBaseline={false}>
  <App/>
</GlassThemeProvider>

Theme

In cases where additional customisation is required, the theme object can be "composed" to create a new MUI theme object:

https://mui.com/material-ui/customization/theming/#nesting-the-theme

For this purpose, the Glass MUI theme is directly exposed in the package:

import { glassTheme } from "glass-mui";

Note: Customising the theme in this way will require the use of the original MUI Theme Provider

Custom Components

...