kylefang/react
1
0
Fork 0
mirror of https://github.com/zhigang1992/react.git synced 2026-01-27 17:27:59 +08:00
Code Issues Packages Projects Releases Wiki Activity

docs(breakpoints): upgrade documentatino to match the new theme system (#478)

Browse Source
This commit is contained in:
witt
2021-03-15 01:14:34 +08:00
committed by GitHub
parent 2c236918fa
commit d351700d04
4 changed files with 48 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
pages/en-us/components/grid.mdx
View File

@@ -144,12 +144,18 @@ const breakpoints: GeistUIThemesBreakpoints = {
xl: { min: '1920px', max: '10000px' },
}
const App = () => (
<GeistProvider theme={{ breakpoints: breakpoints }}>
<CssBaseline />
<AppComponent />
</GeistProvider>
)
const App = () => {
const myTheme = Themes.createFromLight({
type: 'myTheme',
breakpoints,
})
return (
<GeistProvider themes={[myTheme]} themeType="myTheme">
<CssBaseline />
<AppComponent />
</GeistProvider>
)
}
```
<Attributes edit="/pages/en-us/components/grid.mdx">

18
pages/en-us/components/use-media-query.mdx
View File

@@ -63,12 +63,18 @@ const breakpoints: GeistUIThemesBreakpoints = {
xl: { min: '1920px', max: '10000px' },
}
const App = () => (
<GeistProvider theme={{ breakpoints: breakpoints }}>
<CssBaseline />
<AppComponent />
</GeistProvider>
)
const App = () => {
const myTheme = Themes.createFromLight({
type: 'myTheme',
breakpoints,
})
return (
<GeistProvider themes={[myTheme]} themeType="myTheme">
<CssBaseline />
<AppComponent />
</GeistProvider>
)
}
```
<Attributes edit="/pages/en-us/components/use-media-query.mdx">

18
pages/zh-cn/components/grid.mdx
View File

@@ -144,12 +144,18 @@ const breakpoints: GeistUIThemesBreakpoints = {
xl: { min: '1920px', max: '10000px' },
}
const App = () => (
<GeistProvider theme={{ breakpoints: breakpoints }}>
<CssBaseline />
<AppComponent />
</GeistProvider>
)
const App = () => {
const myTheme = Themes.createFromLight({
type: 'myTheme',
breakpoints,
})
return (
<GeistProvider themes={[myTheme]} themeType="myTheme">
<CssBaseline />
<AppComponent />
</GeistProvider>
)
}
```
<Attributes edit="/pages/zh-cn/components/grid.mdx">

18
pages/zh-cn/components/use-media-query.mdx
View File

@@ -63,12 +63,18 @@ const breakpoints: GeistUIThemesBreakpoints = {
xl: { min: '1920px', max: '10000px' },
}
const App = () => (
<GeistProvider theme={{ breakpoints: breakpoints }}>
<CssBaseline />
<AppComponent />
</GeistProvider>
)
const App = () => {
const myTheme = Themes.createFromLight({
type: 'myTheme',
breakpoints,
})
return (
<GeistProvider themes={[myTheme]} themeType="myTheme">
<CssBaseline />
<AppComponent />
</GeistProvider>
)
}
```
<Attributes edit="/pages/zh-cn/components/use-media-query.mdx">