Leon19656
/
tiny-vue
forked from opentiny/tiny-vue
1
0
Fork 0
Code Issues Pull Requests 2 Packages Projects Releases Wiki Activity

恢复demo中的示例中的样式 (#311) 

* fix(theme): 移除container ,layout中的样式

* fix(docs): 恢复container.layout的示例

* fix(docs): 恢复container.layout的示例
This commit is contained in:
申君健 2023-07-10 15:08:56 +08:00 committed by GitHub
parent 0c1e8dc763
commit e73df05bad
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
7 changed files with 104 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
examples/docs/resources/pc/demo/col/col-move.vue
View File

@ -1,32 +1,39 @@
<template>
<div class="content">
<tiny-layout class="tiny-layout-col-move">
<tiny-row>
<tiny-col :span="2">
<div class="col">move 0</div>
</tiny-col>
<tiny-col :span="2" :move="1">
<div class="col">move 1</div>
</tiny-col>
<tiny-col :span="2" :move="4">
<div class="col">向右移动4格</div>
</tiny-col>
<tiny-col :span="2" :move="-6">
<div class="col">向左移动6格</div>
</tiny-col>
</tiny-row>
<tiny-layout>
<tiny-col :span="2">
<div class="col">move 0</div>
</tiny-col>
<tiny-col :span="2" :move="1">
<div class="col">move 1</div>
</tiny-col>
<tiny-col :span="2" :move="4">
<div class="col">向右移动4格</div>
</tiny-col>
<tiny-col :span="2" :move="-6">
<div class="col">向左移动6格</div>
</tiny-col>
</tiny-layout>
</div>
</template>
<script lang="jsx">
import { Layout, Row, Col } from '@opentiny/vue'
import { Layout, Col } from '@opentiny/vue'
export default {
components: {
TinyLayout: Layout,
TinyRow: Row,
TinyCol: Col
}
}
</script>
<style scoped>
.col {
line-height: 30px;
text-align: center;
color: #fff;
background: #1f9ed8;
border-radius: 15px;
}
</style>

12
examples/docs/resources/pc/demo/col/tag.vue
View File

@ -1,7 +1,7 @@
<template>
<div>
<div class="content">
<tiny-layout class="tiny-layout-tag">
<tiny-layout>
<tiny-row>
<tiny-col :span="3">
<div class="col">div element</div>
@ -29,3 +29,13 @@ export default {
}
}
</script>
<style scoped>
.col {
line-height: 30px;
text-align: center;
color: #fff;
background: #1f9ed8;
border-radius: 15px;
}
</style>

14
examples/docs/resources/pc/demo/row/align.vue
View File

@ -1,5 +1,5 @@
<template>
<tiny-layout class="tiny-layout-align">
<tiny-layout>
<tiny-row :flex="true" class="margin-bottom10">
<tiny-col :span="3">
<div class="col lg">默认</div>
@ -49,6 +49,18 @@ export default {
</script>
<style scoped>
.margin-bottom10 {
margin-bottom: 10px;
}
.col {
line-height: 30px;
text-align: center;
color: #fff;
background: #1f9ed8;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
.lg {
height: 120px;
}

16
examples/docs/resources/pc/demo/row/gutter.vue
View File

@ -1,5 +1,5 @@
<template>
<tiny-layout class="tiny-layout-gutter">
<tiny-layout>
<tiny-row class="margin-bottom10">
<tiny-col :span="3" id="test">
<div class="col">默认</div>
@ -47,3 +47,17 @@ export default {
}
}
</script>
<style scoped>
.margin-bottom10 {
margin-bottom: 10px;
}
.col {
line-height: 30px;
text-align: center;
color: #fff;
background: #1f9ed8;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
</style>

16
examples/docs/resources/pc/demo/row/justify.vue
View File

@ -1,5 +1,5 @@
<template>
<tiny-layout class="tiny-layout-justify">
<tiny-layout>
<tiny-row :flex="true" class="margin-bottom10">
<tiny-col :span="3">
<div class="col">默认</div>
@ -69,3 +69,17 @@ export default {
}
}
</script>
<style scoped>
.margin-bottom10 {
margin-bottom: 10px;
}
.col {
line-height: 30px;
text-align: center;
color: #fff;
background: #1f9ed8;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
</style>

16
examples/docs/resources/pc/demo/row/order.vue
View File

@ -1,5 +1,5 @@
<template>
<tiny-layout class="tiny-layout-order">
<tiny-layout>
<tiny-row :flex="true" order="asc" class="margin-bottom10">
<tiny-col :span="3" :no="3">
<div class="col">3 asc</div>
@ -42,3 +42,17 @@ export default {
}
}
</script>
<style scoped>
.margin-bottom10 {
margin-bottom: 10px;
}
.col {
line-height: 30px;
text-align: center;
color: #fff;
background: #1f9ed8;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
</style>

12
examples/docs/resources/pc/demo/row/tag1.vue
View File

@ -1,5 +1,5 @@
<template>
<tiny-layout class="tiny-layout-tag1">
<tiny-layout>
<tiny-row tag="span">
<tiny-col :span="3">
<div class="col">span（行标签已改为span）</div>
@ -25,3 +25,13 @@ export default {
}
}
</script>
<style scoped>
.col {
line-height: 30px;
text-align: center;
color: #fff;
background: #1f9ed8;
box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
}
</style>