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

update Split

Browse source
This commit is contained in:
梁灏 2018-06-30 16:30:07 +08:00
parent 1e9bece0c1
commit 39fc24dc42
2 changed files with 27 additions and 12 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

12
examples/routers/split.vue
View file

@ -1,4 +1,5 @@
<template>
<div>
<div class="demo-split">
<Split v-model="split1">
<div slot="left" class="demo-split-pane">
@ -9,6 +10,17 @@
</div>
</Split>
</div>
<div class="demo-split">
<Split v-model="split1" mode="vertical">
<div slot="left" class="demo-split-pane">
左边面板
</div>
<div slot="right" class="demo-split-pane">
右边面板
</div>
</Split>
</div>
</div>
</template>
<script>

9
src/styles/components/split.less
View file

@ -1,7 +1,7 @@
@split-prefix-cls: ~"@{css-prefix}split";
@box-shadow: 0 0 4px 0 rgba(28, 36, 56, 0.4);
@trigger-bar-background: rgba(23, 35, 61, 0.25);
@trigger-background: #F8F8F9;
@trigger-background: #f8f8f9;
@trigger-width: 6px;
@trigger-bar-width: 4px;
@trigger-bar-offset: (@trigger-width - @trigger-bar-width) / 2;
@ -46,6 +46,7 @@
}
}
&-trigger {
border: 1px solid @border-color-base;
&-con {
position: absolute;
transform: translate(-50%, -50%);
@ -71,7 +72,8 @@
width: @trigger-width;
height: 100%;
background: @trigger-background;
box-shadow: @box-shadow;
border-top: none;
border-bottom: none;
cursor: col-resize;
.@{split-prefix-cls}-trigger-bar {
width: @trigger-bar-width;
@ -85,7 +87,8 @@
height: @trigger-width;
width: 100%;
background: @trigger-background;
box-shadow: @box-shadow;
border-left: none;
border-right: none;
cursor: row-resize;
.@{split-prefix-cls}-trigger-bar {
height: @trigger-bar-width;