drip-public/iview
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

add Breadcrumb UI

Browse source 
add Breadcrumb UI
This commit is contained in:
梁灏 2016-09-21 18:16:37 +08:00
parent 95436eeb98
commit a86e42c06d
6 changed files with 71 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
dist/styles/iview.all.css vendored
View file

File diff suppressed because one or more lines are too long

2
dist/styles/iview.css vendored
View file

File diff suppressed because one or more lines are too long

34
local/routers/radio.vue
View file

@ -121,13 +121,41 @@
<Input-number :value="2" size="small"></Input-number> <Input-number :value="2" size="small"></Input-number>
<Input-number :value="2"></Input-number> <Input-number :value="2"></Input-number>
<Input-number :value="2" size="large"></Input-number> <Input-number :value="2" size="large"></Input-number>
<br><br>
<Breadcrumb>
<Breadcrumb-item href="/">Home</Breadcrumb-item>
<Breadcrumb-item href="/components/breadcrumb">Components</Breadcrumb-item>
<Breadcrumb-item>Breadcrumb</Breadcrumb-item>
</Breadcrumb>
<Breadcrumb>
<Breadcrumb-item href="/">
<Icon type="ios-home-outline"></Icon> Home
</Breadcrumb-item>
<Breadcrumb-item href="/components/breadcrumb">
<Icon type="social-buffer-outline"></Icon> Components
</Breadcrumb-item>
<Breadcrumb-item>
<Icon type="pound"></Icon> Breadcrumb
</Breadcrumb-item>
</Breadcrumb>
<Breadcrumb separator=">">
<Breadcrumb-item href="/">Home</Breadcrumb-item>
<Breadcrumb-item href="/components/breadcrumb">Components</Breadcrumb-item>
<Breadcrumb-item>Breadcrumb</Breadcrumb-item>
</Breadcrumb>
<Breadcrumb separator="<b class='demo-breadcrumb-separator'>=></b>">
<Breadcrumb-item href="/">Home</Breadcrumb-item>
<Breadcrumb-item href="/components/breadcrumb">Components</Breadcrumb-item>
<Breadcrumb-item>Breadcrumb</Breadcrumb-item>
</Breadcrumb>
</template> </template>
<script> <script>
import { Radio, Alert, Icon, Collapse, Button, Checkbox, Switch, InputNumber } from 'iview'; import { Radio, Alert, Icon, Collapse, Button, Checkbox, Switch, InputNumber, Breadcrumb } from 'iview';
const RadioGroup = Radio.Group; const RadioGroup = Radio.Group;
const Panel = Collapse.Panel; const Panel = Collapse.Panel;
const CheckboxGroup = Checkbox.Group; const CheckboxGroup = Checkbox.Group;
const BreadcrumbItem = Breadcrumb.Item;
export default { export default {
components: { components: {
@ -141,7 +169,9 @@
Checkbox, Checkbox,
CheckboxGroup, CheckboxGroup,
Switch, Switch,
InputNumber InputNumber,
Breadcrumb,
BreadcrumbItem
}, },
props: { props: {

2
package.json
View file

@ -1,6 +1,6 @@
{ {
"name": "iview", "name": "iview",
"version": "0.0.15", "version": "0.0.16",
"title": "iView", "title": "iView",
"description": "A high quality UI components Library with Vue.js", "description": "A high quality UI components Library with Vue.js",
"homepage": "http://www.iviewui.com", "homepage": "http://www.iviewui.com",

34
styles/mixins/breadcrumb.less Normal file
View file

@ -0,0 +1,34 @@
@breadcrumb-prefix-cls: ~"@{css-prefix}breadcrumb";
.@{breadcrumb-prefix-cls} {
color: #999;
font-size: @font-size-base;
a {
color: @text-color;
.transition(color @transition-time @ease-in-out);
&:hover {
color: tint(@primary-color, 20%);
}
}
& > span:last-child {
font-weight: bold;
color: @text-color;
}
& > span:last-child &-item-separator {
display: none;
}
&-item-separator {
margin: 0 8px;
color: @border-color-base;
}
&-item-link {
> .ivu-icon + span {
margin-left: 4px;
}
}
}

3
styles/mixins/index.less
View file

@ -10,4 +10,5 @@
@import "loading"; @import "loading";
@import "close"; @import "close";
@import "checkbox"; @import "checkbox";
@import "input"; @import "input";
@import "breadcrumb";