github
/
element
mirror of https://github.com/ElemeFE/element
1
0
Fork 0
Code Issues Releases Wiki Activity

Tree: expand hot area of arrow icon

pull/7899/head
Leopoldthecoder 2017-10-31 16:53:36 +08:00 committed by 杨奕
parent 1412b5757c
commit ee72cd5b9f
2 changed files with 5 additions and 10 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

13
packages/theme-chalk/src/tree.scss
View File

@ -33,7 +33,7 @@
cursor: pointer; cursor: pointer;
& > .el-tree-node__expand-icon { & > .el-tree-node__expand-icon {
margin: 0 8px; padding: 6px;
} }
& > .el-checkbox { & > .el-checkbox {
margin-right: 8px; margin-right: 8px;
@ -45,13 +45,8 @@
@include e(expand-icon) { @include e(expand-icon) {
cursor: pointer; cursor: pointer;
width: 0; color: $--tree-expand-icon-color;
height: 0; font-size: 12px;
margin-left: 10px;
border: 3.5px solid transparent;
border-right-width: 0;
border-left-color: $--tree-expand-icon-color;
border-left-width: 6px;
transform: rotate(0deg); transform: rotate(0deg);
transition: transform 0.3s ease-in-out; transition: transform 0.3s ease-in-out;
@ -61,7 +56,7 @@
} }
&.is-leaf { &.is-leaf {
border-color: transparent; color: transparent;
cursor: default; cursor: default;
} }
} }

2
packages/tree/src/tree-node.vue
View File

@ -10,7 +10,7 @@
<div class="el-tree-node__content" <div class="el-tree-node__content"
:style="{ 'padding-left': (node.level - 1) * tree.indent + 'px' }"> :style="{ 'padding-left': (node.level - 1) * tree.indent + 'px' }">
<span <span
class="el-tree-node__expand-icon" class="el-tree-node__expand-icon el-icon-caret-right"
@click.stop="handleExpandIconClick" @click.stop="handleExpandIconClick"
:class="{ 'is-leaf': node.isLeaf, expanded: !node.isLeaf && expanded }"> :class="{ 'is-leaf': node.isLeaf, expanded: !node.isLeaf && expanded }">
</span> </span>