mirror/ant-design
1
0
Fork 0
mirror of https://github.com/ant-design/ant-design.git synced 2024-11-24 02:59:58 +08:00
Code Issues Actions 5 Packages Projects Releases Wiki Activity

Add datepicker style

Browse Source
This commit is contained in:
afc163 2015-05-21 20:36:13 +08:00
parent 14a2a433d5
commit 4c121603ec
9 changed files with 117 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
.gitignore vendored
View File

@ -25,3 +25,5 @@ nohup.out
elasticsearch-*
config/base.yaml
_site
npm-debug.log
dist

6
README.md
View File

@ -21,3 +21,9 @@ $ npm start
```bash
$ npm run deploy
```
#### 构建
```bash
$ webpack
```

13
components/datepicker/demo/basic.md Normal file
View File

@ -0,0 +1,13 @@
# 基本
- description: 最简单的用法
---
````jsx
var Datepicker = antd.datepicker;
React.render(
<Datepicker />
, document.getElementById('components-datepicker-demo-basic'));
````

34
components/datepicker/index.jsx Normal file
View File

@ -0,0 +1,34 @@
require('rc-calendar/assets/index.css');
var React = require('react');
var Calendar = require('rc-calendar');
var DatePicker = Calendar.Picker;
var GregorianCalendar = require('gregorian-calendar');
var zhCn = require('gregorian-calendar/lib/locale/zh-cn');
module.exports = React.createClass({
getInitialState: function () {
var value = new GregorianCalendar(zhCn);
value.setTime(Date.now());
return {
time: Date.now(),
showTime: true,
value: value
};
},
render: function () {
var state = this.state;
var calendar = (
<Calendar
orient={['top', 'left']}
showTime={this.state.showTime} showClear={true} />
);
return (
<DatePicker
trigger={<span className="datepicker-icon" />}
formatter={this.props.formatter} calendar={calendar}
value={this.state.value} onChange={this.handleChange}>
<input type="text" className="datepicker-input" />
</DatePicker>
);
}
});

20
components/datepicker/index.md Normal file
View File

@ -0,0 +1,20 @@
# Datepicker 日期选择框
- category: Component
---
选择日期。
## 什么时候使用
的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束。
的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束，的凯撒垃圾分类快结束。
## 为什么使用
的凯撒垃圾分类的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束。
的凯撒垃圾分类快结束的凯撒垃圾分类快结束的凯撒垃圾分类快结束，的凯撒垃圾分类快结束。

3
index.js Normal file
View File

@ -0,0 +1,3 @@
window.antd = {
datepicker: require('./components/datepicker')
};

11
package.json
View File

@ -11,9 +11,18 @@
"url": "https://github.com/ant-design/ant-design.github.io/issues"
},
"dependencies": {
"gregorian-calendar": "~3.0.0",
"rc-calendar": "~3.3.0"
},
"devDependencies": {
"css-loader": "~0.13.1",
"gh-pages-cli": "~0.2.0",
"json-loader": "~0.5.1",
"jsx-loader": "~0.13.2",
"lodash": "~3.8.0",
"nico-jsx": "~0.5.3"
"nico-jsx": "~0.5.3",
"style-loader": "~0.12.2",
"webpack": "~1.9.7"
},
"scripts": {
"build": "npm run clean && nico build",

3
theme/templates/layout.html
View File

@ -13,9 +13,10 @@
<link href="http://fonts.useso.com/css?family=Raleway:600,500,400,300" rel="stylesheet" type="text/css">
<link rel="stylesheet" href="/static/tomorrow.css">
<script src="https://a.alipayobjects.com/jquery/jquery/1.11.1/jquery.js"></script>
<script src="/static/script.js"></script>
<!-- react -->
<script src="https://t.alipayobjects.com/images/T12TdfXlpbXXXXXXXX.js"></script>
<script src="/static/script.js"></script>
<script src="/dist/index.js"></script>
</head>
<body class="{%- if post.filepath === 'README.md' %}index-page{%- endif %}">
<header id="header">

27
webpack.config.js Normal file
View File

@ -0,0 +1,27 @@
var webpack = require('webpack');
module.exports = {
entry: './index.js',
resolve: {
extensions: ['', '.js', '.jsx'],
},
output: {
path: 'dist',
filename: 'index.js'
},
externals: {
react: "React"
},
module: {
loaders: [
{test: /\.jsx$/, loader: 'jsx-loader?harmony'},
{test: /\.js$/, loader: 'jsx-loader?harmony'},
{test: /\.json$/, loader: 'json-loader'},
{test: /\.css/, loader: 'style!css'}
]
},
};