terribleplan/next.js
1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
Code Issues Releases Wiki Activity

Improved with-ant-design example (#4034)

Browse source 
* Improved with-ant-design example

* standardjs fix maybe
This commit is contained in:
Luke Plaster 2018-03-23 19:52:34 +08:00 committed by Tim Neutkens
parent 9470b91ba1
commit a6af11c6ae
5 changed files with 20 additions and 11 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
examples/with-ant-design/.babelrc
View file

@ -6,7 +6,7 @@
"import", "import",
{ {
"libraryName": "antd", "libraryName": "antd",
"style": false "style": "css"
} }
] ]
] ]

2
examples/with-ant-design/index.js
View file

@ -4,7 +4,7 @@ export default ({ children }) =>
<Head> <Head>
<meta name='viewport' content='width=device-width, initial-scale=1' /> <meta name='viewport' content='width=device-width, initial-scale=1' />
<meta charSet='utf-8' /> <meta charSet='utf-8' />
<link rel='stylesheet' href='https://unpkg.com/antd@3/dist/antd.min.css' /> <link rel='stylesheet' href='/_next/static/style.css' />
</Head> </Head>
<style jsx global>{` <style jsx global>{`
body { body {

8
examples/with-ant-design/next.config.js Normal file
View file

@ -0,0 +1,8 @@
const withCss = require('@zeit/next-css')
// fix: prevents error when .css files are required by node
if (typeof require !== 'undefined') {
require.extensions['.css'] = (file) => {}
}
module.exports = withCss()

3
examples/with-ant-design/package.json
View file

@ -7,7 +7,8 @@
"start": "next start" "start": "next start"
}, },
"dependencies": { "dependencies": {
"antd": "^3.0.2", "@zeit/next-css": "^0.1.4",
"antd": "^3.3.1",
"babel-plugin-import": "^1.1.1", "babel-plugin-import": "^1.1.1",
"next": "latest", "next": "latest",
"react": "^16.0.0", "react": "^16.0.0",

16
examples/with-ant-design/pages/index.js
View file

@ -12,7 +12,7 @@ export default () => (
label='Input Number' label='Input Number'
labelCol={{ span: 8 }} labelCol={{ span: 8 }}
wrapperCol={{ span: 8 }} wrapperCol={{ span: 8 }}
> >
<InputNumber size='large' min={1} max={10} style={{ width: 100 }} defaultValue={3} name='inputNumber' /> <InputNumber size='large' min={1} max={10} style={{ width: 100 }} defaultValue={3} name='inputNumber' />
<a href='#'>Link</a> <a href='#'>Link</a>
</FormItem> </FormItem>
@ -21,7 +21,7 @@ export default () => (
label='Switch' label='Switch'
labelCol={{ span: 8 }} labelCol={{ span: 8 }}
wrapperCol={{ span: 8 }} wrapperCol={{ span: 8 }}
> >
<Switch defaultChecked name='switch' /> <Switch defaultChecked name='switch' />
</FormItem> </FormItem>
@ -29,7 +29,7 @@ export default () => (
label='Slider' label='Slider'
labelCol={{ span: 8 }} labelCol={{ span: 8 }}
wrapperCol={{ span: 8 }} wrapperCol={{ span: 8 }}
> >
<Slider defaultValue={70} /> <Slider defaultValue={70} />
</FormItem> </FormItem>
@ -37,7 +37,7 @@ export default () => (
label='Select' label='Select'
labelCol={{ span: 8 }} labelCol={{ span: 8 }}
wrapperCol={{ span: 8 }} wrapperCol={{ span: 8 }}
> >
<Select size='large' defaultValue='lucy' style={{ width: 192 }} name='select'> <Select size='large' defaultValue='lucy' style={{ width: 192 }} name='select'>
<Option value='jack'>jack</Option> <Option value='jack'>jack</Option>
<Option value='lucy'>lucy</Option> <Option value='lucy'>lucy</Option>
@ -50,19 +50,19 @@ export default () => (
label='DatePicker' label='DatePicker'
labelCol={{ span: 8 }} labelCol={{ span: 8 }}
wrapperCol={{ span: 8 }} wrapperCol={{ span: 8 }}
> >
<DatePicker name='startDate' /> <DatePicker name='startDate' />
</FormItem> </FormItem>
<FormItem <FormItem
style={{ marginTop: 48 }} style={{ marginTop: 48 }}
wrapperCol={{ span: 8, offset: 8 }} wrapperCol={{ span: 8, offset: 8 }}
> >
<Button size='large' type='primary' htmlType='submit'> <Button size='large' type='primary' htmlType='submit'>
OK OK
</Button> </Button>
<Button size='large' style={{ marginLeft: 8 }}> <Button size='large' style={{ marginLeft: 8 }}>
Cancel Cancel
</Button> </Button>
</FormItem> </FormItem>
</Form> </Form>
</div> </div>