cell component

This commit is contained in:
cookfront 2017-02-13 19:24:03 +08:00
parent 35ec796e61
commit e62665f3bc
2 changed files with 24 additions and 2 deletions

View File

@ -1,10 +1,21 @@
<style>
.cell-groups {
padding-left: 10px;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
</style>
## Cell 组件 ## Cell 组件
### 基础用法 ### 基础用法
:::demo 样例代码 :::demo 样例代码
```html ```html
<o2-cell title="单元格" value="单元格标题"></o2-cell> <div class="cell-groups">
<o2-cell title="单元格1" value="单元格1内容"></o2-cell>
<o2-cell title="单元格2" value="单元格2内容"></o2-cell>
</div>
``` ```
::: :::

View File

@ -12,8 +12,8 @@
<slot> <slot>
<span v-text="value"></span> <span v-text="value"></span>
</slot> </slot>
<i class="o2-cell-arrow-right" v-if="isLink"></i>
</div> </div>
<i class="o2-cell-arrow-right" v-if="isLink"></i>
</a> </a>
</template> </template>
@ -35,6 +35,17 @@ export default {
@component-namespace o2 { @component-namespace o2 {
@component cell { @component cell {
display: block; display: block;
overflow: hidden;
position: relative;
padding: 10px 10px 10px 0;
line-height: 22px;
color: #666;
text-decoration: none;
border-bottom: 1px solid #ccc;
&:last-child {
border-bottom: 0;
}
@descendent title { @descendent title {
float: left; float: left;