CODEWITHSUNDEEP
javascriptreactjstypescriptreact-nativematerial-ui
J. Doe
J. Doe

Reputation: 73

React export stylesheet

I would like to create an external stylesheet using the MaterialUI 'makeStyles' and 'createStyles' like you can in React Native however, I don't know how to do it.

export const useStyles = makeStyles((theme: Theme) =>
    createStyles({
        root: {
            display: 'flex'
        },
        content: {
            flexGrow: 1,
            padding: theme.spacing(3),
        }
    }),

);

So this would be called 'globalStyle.tsx' and then in any other file I can import it then do something like styles.root, etc. I've done it before in React Native but as said previously, I'm stuck on how to proceed.

React Native way: https://reactnative.dev/docs/stylesheet

Upvotes: 1

Views: 155

Answers (1)

Sina Salami
Sina Salami

Reputation: 35

First you should import the makeStyles like:

import { makeStyles } from "@material-ui/core/styles";

and then you can use it with something like this: 

export const useStyles = makeStyles((theme) => ({
  container: {
    width: "100%",
  },
}));

Upvotes: 1

Related Questions