Skip to content

Commit

Permalink
Merge branch 'next' into remove-cloneChildrenWithClassName
Browse files Browse the repository at this point in the history
  • Loading branch information
oliviertassinari authored Apr 16, 2019
2 parents e6ec572 + 4e4a2ed commit 2cf169d
Show file tree
Hide file tree
Showing 45 changed files with 556 additions and 386 deletions.
2 changes: 1 addition & 1 deletion docs/src/modules/components/Demo.js
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,7 @@ const styles = theme => ({
class Demo extends React.Component {
state = {
anchorEl: null,
codeOpen: false,
codeOpen: Boolean(this.props.demoOptions.defaultCodeOpen),
demoHovered: false,
sourceHintSeen: false,
};
Expand Down
5 changes: 0 additions & 5 deletions docs/src/pages/demos/pickers/pickers.md
Original file line number Diff line number Diff line change
Expand Up @@ -45,8 +45,3 @@ For more advanced use cases you might be able to take advantage of.
[material-ui-pickers](https://material-ui-pickers.firebaseapp.com/) provides date and time controls that follow the Material Design spec.

{{"demo": "pages/demos/pickers/MaterialUIPickers.js"}}

### Other

- [material-ui-time-picker](https://github.com/TeamWertarbyte/material-ui-time-picker): time pickers.
- [material-ui-next-pickers](https://github.com/chingyawhao/material-ui-next-pickers): date pickers and time pickers.
36 changes: 34 additions & 2 deletions docs/src/pages/getting-started/faq/faq.md
Original file line number Diff line number Diff line change
Expand Up @@ -49,9 +49,9 @@ const theme = createMuiTheme({
});
```

## How can I disable animations globally?
## How can I disable transitions globally?

You can disable animations globally by providing the following in your theme:
You can disable transitions globally by providing the following in your theme:

```js
import { createMuiTheme } from '@material-ui/core';
Expand All @@ -67,6 +67,38 @@ const theme = createMuiTheme({
Sometimes you will want to enable this behavior conditionally, for instance during testing or on low-end devices,
in these cases, you can dynamically change the theme value.

You can go one step further by disabling all the transitions, animations and the ripple effect:

```js
import { createMuiTheme } from '@material-ui/core';

const theme = createMuiTheme({
transitions: {
// So we have `transition: none;` everywhere
create: () => 'none',
},
overrides: {
// Name of the component ⚛️
CssBasline: {
// Name of the rule
'@global': {
'*, *::before, *::after': {
transition: 'none !important',
animation: 'none !important',
},
},
},
},
props: {
// Name of the component ⚛️
MuiButtonBase: {
// The properties to apply
disableRipple: true, // No more ripple, on the whole application!
},
},
});
```

## Do I have to use JSS to style my app?

It's highly recommended:
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -3,10 +3,8 @@ import clsx from 'clsx';
import MuiBadge from '@material-ui/core/Badge';
import { BADGE } from '../../theme/core';

const Badge = ({ className, dotted, children, ...props }) => (
<MuiBadge className={clsx(BADGE.root, className, dotted && BADGE.dotted)} {...props}>
{children}
</MuiBadge>
const Badge = ({ className, dotted, ...props }) => (
<MuiBadge className={clsx(BADGE.root, className, dotted && BADGE.dotted)} {...props} />
);

export default Badge;
Original file line number Diff line number Diff line change
Expand Up @@ -3,13 +3,11 @@ import clsx from 'clsx';
import MuiListItemIcon from '@material-ui/core/ListItemIcon';
import { LIST_ITEM_ICON } from '../../theme/core';

const ListItemIcon = ({ className, children, subcategory, ...props }) => (
const ListItemIcon = ({ className, subcategory, ...props }) => (
<MuiListItemIcon
className={clsx(LIST_ITEM_ICON.root, className, subcategory && LIST_ITEM_ICON.subcategory)}
{...props}
>
{children}
</MuiListItemIcon>
/>
);

export default ListItemIcon;
17 changes: 10 additions & 7 deletions docs/src/pages/premium-themes/onepirate/Privacy.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
import withRoot from './modules/withRoot';
// --- Post bootstrap -----
import React from 'react';
import Container from '@material-ui/core/Container';
import Box from '@material-ui/core/Box';
import Markdown from './modules/components/Markdown';
import Typography from './modules/components/Typography';
import LayoutBody from './modules/components/LayoutBody';
import AppAppBar from './modules/views/AppAppBar';
import privacy from './modules/views/privacy.md';
import AppFooter from './modules/views/AppFooter';
Expand All @@ -12,12 +13,14 @@ function Privacy() {
return (
<React.Fragment>
<AppAppBar />
<LayoutBody margin marginBottom>
<Typography variant="h3" gutterBottom marked="center" align="center">
Privacy
</Typography>
<Markdown>{privacy}</Markdown>
</LayoutBody>
<Container>
<Box mt={7} mb={12}>
<Typography variant="h3" gutterBottom marked="center" align="center">
Privacy
</Typography>
<Markdown>{privacy}</Markdown>
</Box>
</Container>
<AppFooter />
</React.Fragment>
);
Expand Down
17 changes: 10 additions & 7 deletions docs/src/pages/premium-themes/onepirate/Terms.js
Original file line number Diff line number Diff line change
@@ -1,9 +1,10 @@
import withRoot from './modules/withRoot';
// --- Post bootstrap -----
import React from 'react';
import Container from '@material-ui/core/Container';
import Box from '@material-ui/core/Box';
import Markdown from './modules/components/Markdown';
import Typography from './modules/components/Typography';
import LayoutBody from './modules/components/LayoutBody';
import AppAppBar from './modules/views/AppAppBar';
import terms from './modules/views/terms.md';
import AppFooter from './modules/views/AppFooter';
Expand All @@ -12,12 +13,14 @@ function Terms() {
return (
<React.Fragment>
<AppAppBar />
<LayoutBody margin marginBottom>
<Typography variant="h3" gutterBottom marked="center" align="center">
Terms
</Typography>
<Markdown>{terms}</Markdown>
</LayoutBody>
<Container>
<Box mt={7} mb={12}>
<Typography variant="h3" gutterBottom marked="center" align="center">
Terms
</Typography>
<Markdown>{terms}</Markdown>
</Box>
</Container>
<AppFooter />
</React.Fragment>
);
Expand Down
Original file line number Diff line number Diff line change
@@ -1,31 +1,24 @@
import React from 'react';
import { withStyles } from '@material-ui/core/styles';
import MuiButton from '@material-ui/core/Button';
import Button from '@material-ui/core/Button';

const styles = theme => ({
export default withStyles(theme => ({
root: {
borderRadius: 0,
fontWeight: theme.typography.fontWeightMedium,
fontFamily: theme.typography.fontFamilySecondary,
padding: `${theme.spacing(2) - 1}px ${theme.spacing(4)}px`,
padding: theme.spacing(2, 4),
fontSize: theme.typography.pxToRem(14),
boxShadow: 'none',
'&:active, &:focus': {
boxShadow: 'none',
},
},
sizeSmall: {
padding: `${theme.spacing(1)}px ${theme.spacing(3)}px`,
padding: theme.spacing(1, 3),
fontSize: theme.typography.pxToRem(13),
},
sizeLarge: {
padding: `${theme.spacing(3) - 3}px ${theme.spacing(6)}px`,
padding: theme.spacing(2, 5),
fontSize: theme.typography.pxToRem(16),
},
});

function Button(props) {
return <MuiButton {...props} />;
}

export default withStyles(styles)(Button);
}))(Button);

This file was deleted.

Original file line number Diff line number Diff line change
@@ -1,6 +1,5 @@
import React from 'react';
import { withStyles } from '@material-ui/core/styles';
import MuiToolbar from '@material-ui/core/Toolbar';
import Toolbar from '@material-ui/core/Toolbar';

export const styles = theme => ({
root: {
Expand All @@ -11,8 +10,4 @@ export const styles = theme => ({
},
});

function Toolbar(props) {
return <MuiToolbar {...props} />;
}

export default withStyles(styles)(Toolbar);
Loading

0 comments on commit 2cf169d

Please sign in to comment.