refactor:foramt views/component-demo

This commit is contained in:
Pan
2017-11-17 17:51:41 +08:00
parent 46b4f74969
commit d20585a3f9
35 changed files with 289 additions and 446 deletions

View File

@@ -1,7 +1,7 @@
<template>
<div class="components-container">
<code>splitPane 如果你用过<a href='http://codepen.io/' target='_blank'> codepen</a>,<a href='https://jsfiddle.net/' target='_blank'> jsfiddle </a>就不会陌生了
<a href='https://github.com/PanJiaChen/vue-split-pane' target='_blank'>项目地址</a>
<code>splitPane 如果你用过<a href="http://codepen.io/" target="_blank"> codepen</a>,<a href="https://jsfiddle.net/" target="_blank"> jsfiddle </a>就不会陌生了
<a href="https://github.com/PanJiaChen/vue-split-pane" target='_blank'>项目地址</a>
</code>
<split-pane v-on:resize="resize" split="vertical">
<template slot="paneL">
@@ -26,6 +26,7 @@
import splitPane from 'vue-splitpane'
export default {
name: 'splitpane-demo',
components: { splitPane },
methods: {
resize() {
@@ -37,29 +38,29 @@ export default {
<style scoped>
.components-container {
position: relative;
height: 100vh;
position: relative;
height: 100vh;
}
.left-container {
background-color: #F38181;
height: 100%;
background-color: #F38181;
height: 100%;
}
.right-container {
background-color: #FCE38A;
height: 200px;
background-color: #FCE38A;
height: 200px;
}
.top-container {
background-color: #FCE38A;
width: 100%;
height: 100%;
background-color: #FCE38A;
width: 100%;
height: 100%;
}
.bottom-container {
width: 100%;
background-color: #95E1D3;
height: 100%;
width: 100%;
background-color: #95E1D3;
height: 100%;
}
</style>