Skip to content

Commit a71c3d8

Browse files
kouchaokouchao
committed
新增 block的主题属性
1 parent 2987828 commit a71c3d8

File tree

2 files changed

+40
-33
lines changed

2 files changed

+40
-33
lines changed

‎src/components/block/src/block.vue

Lines changed: 8 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,9 @@
1010
<slot></slot>
1111
</div>
1212
</fieldset>
13-
<blockquote v-else class="layui-elem-quote" :style="styleName">
13+
<blockquote v-else class="layui-elem-quote"
14+
:class="'layui-quote-' + theme"
15+
:style="styleName">
1416
<slot></slot>
1517
</blockquote>
1618

@@ -23,7 +25,8 @@
2325
props: {
2426
color: String,
2527
title: String,
26-
border: Boolean
28+
border: Boolean,
29+
theme: String
2730
},
2831
data: function () {
2932
return {
@@ -36,8 +39,8 @@
3639
</script>
3740

3841
<style scoped>
39-
.layui-elem-quote {
40-
border-left: 5px solid #009688
41-
}
42+
/*.layui-elem-quote {*/
43+
/*border-left: 5px solid #009688*/
44+
/*}*/
4245
4346
</style>

‎src/views/Badge.vue

Lines changed: 32 additions & 28 deletions
Original file line numberDiff line numberDiff line change
@@ -2,34 +2,38 @@
22
<div class="demo">
33
<lay-block title="小徽章、大家族"></lay-block>
44

5-
<div style="margin: 10px 30px">
6-
小圆点：
7-
<lay-badge type="dot"></lay-badge>
8-
<lay-badge type="dot" theme="orange"></lay-badge>
9-
<lay-badge type="dot" theme="green"></lay-badge>
10-
<lay-badge type="dot" theme="cyan"></lay-badge>
11-
<lay-badge type="dot" theme="blue"></lay-badge>
12-
<lay-badge type="dot" theme="black"></lay-badge>
13-
<lay-badge type="dot" theme="gray"></lay-badge>
14-
</div>
15-
<div style="margin: 15px 30px">
16-
常规弧形徽章：
17-
<lay-badge>6</lay-badge>
18-
<lay-badge>99</lay-badge>
19-
<lay-badge>61728</lay-badge>
20-
<lay-badge>赤</lay-badge>
21-
<lay-badge theme="orange">橙</lay-badge>
22-
<lay-badge theme="green">绿</lay-badge>
23-
<lay-badge theme="cyan">青</lay-badge>
24-
<lay-badge theme="blue">蓝</lay-badge>
25-
<lay-badge theme="black">黑</lay-badge>
26-
<lay-badge theme="gray">灰</lay-badge>
27-
</div>
28-
<div style="margin: 15px 30px">
29-
边框徽章：
30-
<lay-badge type="rim">6</lay-badge>
31-
<lay-badge type="rim">Hot</lay-badge>
32-
</div>
5+
<lay-block theme="nm">
6+
<div style="margin: 10px 0">
7+
小圆点：
8+
<lay-badge type="dot"></lay-badge>
9+
<lay-badge type="dot" theme="orange"></lay-badge>
10+
<lay-badge type="dot" theme="green"></lay-badge>
11+
<lay-badge type="dot" theme="cyan"></lay-badge>
12+
<lay-badge type="dot" theme="blue"></lay-badge>
13+
<lay-badge type="dot" theme="black"></lay-badge>
14+
<lay-badge type="dot" theme="gray"></lay-badge>
15+
</div>
16+
<div style="margin: 10px 0">
17+
常规弧形徽章：
18+
<lay-badge>6</lay-badge>
19+
<lay-badge>99</lay-badge>
20+
<lay-badge>61728</lay-badge>
21+
<lay-badge>赤</lay-badge>
22+
<lay-badge theme="orange">橙</lay-badge>
23+
<lay-badge theme="green">绿</lay-badge>
24+
<lay-badge theme="cyan">青</lay-badge>
25+
<lay-badge theme="blue">蓝</lay-badge>
26+
<lay-badge theme="black">黑</lay-badge>
27+
<lay-badge theme="gray">灰</lay-badge>
28+
</div>
29+
<div style="margin: 10px 0">
30+
边框徽章：
31+
<lay-badge type="rim">6</lay-badge>
32+
<lay-badge type="rim">Hot</lay-badge>
33+
</div>
34+
</lay-block>
35+
36+
3337

3438
<lay-block title="与其它元素的搭配"></lay-block>
3539

0 commit comments

Comments
 (0)