Skip to content

Commit

Permalink
Add simple breadcrumb
Browse files Browse the repository at this point in the history
  • Loading branch information
afc163 committed Jul 1, 2015
1 parent 65f72a5 commit c103918
Showing 6 changed files with 78 additions and 2 deletions.
19 changes: 19 additions & 0 deletions components/breadcrumb/demo/basic.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,19 @@
# 基本

- order: 0

最简单的用法。

---

````jsx
var Breadcrumb = antd.Breadcrumb;

React.render(
<Breadcrumb>
<Breadcrumb.Item href="">首页</Breadcrumb.Item>
<Breadcrumb.Item href="">应用列表</Breadcrumb.Item>
<Breadcrumb.Item>应用</Breadcrumb.Item>
</Breadcrumb>
, document.getElementById('components-breadcrumb-demo-basic'));
````
35 changes: 35 additions & 0 deletions components/breadcrumb/index.jsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,35 @@
'use strict';

import React from 'react';

let prefixCls = 'ant-breadcrumb';

let BreadcrumbItem = React.createClass({
render() {
var link = <a className={prefixCls + '-link'} {...this.props}>{this.props.children}</a>;
var slash = <span className={prefixCls + '-slash'}>/</span>;
if (typeof this.props.href === 'undefined') {
slash = '';
link = <span className={prefixCls + '-link'} {...this.props}>{this.props.children}</span>;
}
return (
<span>
{link}
{slash}
</span>
);
}
});

let Breadcrumb = React.createClass({
render() {
return (
<div className={prefixCls}>
{this.props.children}
</div>
);
}
});

Breadcrumb.Item = BreadcrumbItem;
export default Breadcrumb;
2 changes: 1 addition & 1 deletion components/breadcrumb/index.md
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
# BreadCrumb

- category: CSS
- category: Components
- chinese: 面包屑

---
1 change: 1 addition & 0 deletions index.js
Original file line number Diff line number Diff line change
@@ -10,6 +10,7 @@ var antd = {
Progress: require('./components/progress'),
Popover: require('./components/popover'),
Select: require('./components/select'),
Breadcrumb: require('./components/breadcrumb'),
Popconfirm: require('./components/popconfirm'),
confirm: require('./components/modal/confirm'),
Steps: require('./components/steps')
20 changes: 20 additions & 0 deletions style/components/breadcrumb.less
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
@breadcrumbPrefixCls: ant-breadcrumb;

.@{breadcrumbPrefixCls} {
color: #999;
font-size: 12px;

a&-link {
color: #666;
}

> span:last-child {
font-weight: bold;
color: #666;
}

&-slash {
margin: 0 8px;
color: #d9d9d9;
}
}
3 changes: 2 additions & 1 deletion style/components/index.less
Original file line number Diff line number Diff line change
@@ -11,4 +11,5 @@
@import "form";
@import "loading";
@import "progress";
@import "steps";
@import "steps";
@import "breadcrumb";

0 comments on commit c103918

Please sign in to comment.