Skip to content
This repository was archived by the owner on May 13, 2024. It is now read-only.

Commit 4ae4231

Browse files
authored
fix: cannot click tag labels on outside of the text (fix #84) (#85)
1 parent c453d0d commit 4ae4231

File tree

1 file changed

+39
-34
lines changed

1 file changed

+39
-34
lines changed

components/PostTag.vue

Lines changed: 39 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,8 @@
11
<template>
22
<li class="post-tag">
3-
<router-link :to="'/tag/' + tag"> {{ tag }} </router-link>
3+
<router-link :to="'/tag/' + tag">
4+
<span>{{ tag }}</span>
5+
</router-link>
46
</li>
57
</template>
68

@@ -18,48 +20,51 @@ export default {
1820

1921
<style scoped lang="stylus">
2022
.post-tag
21-
background-color $postTagBgColor
22-
border-radius 3px 0 0 3px
23-
height 26px
24-
padding 0 20px 0 23px
25-
position relative
26-
cursor pointer
23+
height 26px
2724
2825
&:not(:last-child)
2926
margin-right 10px
3027
3128
a
32-
color $postTagColor
29+
background-color $postTagBgColor
30+
border-radius 3px 0 0 3px
31+
padding 0 20px 0 23px
32+
position relative
3333
text-decoration none
34-
transition color 0.2s
34+
height 26px
35+
display inline-block
3536
36-
&:before
37-
position absolute
38-
left 10px
39-
top 10px
40-
background #fff
41-
border-radius 50%
42-
box-shadow inset 0 1px rgba(0, 0, 0, 0.25)
43-
content ''
44-
height 6px
45-
width 6px
37+
span
38+
color $postTagColor
39+
transition color 0.2s
4640
47-
&:after
48-
position absolute
49-
right 0
50-
top 0
51-
background $bgColor
52-
border-bottom 13px solid transparent
53-
border-left 10px solid $postTagBgColor
54-
border-top 13px solid transparent
55-
content ''
56-
57-
&:hover
58-
background-color $accentColor
41+
&:before
42+
position absolute
43+
left 10px
44+
top 10px
45+
background #fff
46+
border-radius 50%
47+
box-shadow inset 0 1px rgba(0, 0, 0, 0.25)
48+
content ''
49+
height 6px
50+
width 6px
5951
6052
&:after
61-
border-left-color $accentColor
53+
position absolute
54+
right 0
55+
top 0
56+
background $bgColor
57+
border-bottom 13px solid transparent
58+
border-left 10px solid $postTagBgColor
59+
border-top 13px solid transparent
60+
content ''
61+
62+
&:hover
63+
background-color $accentColor
64+
65+
&:after
66+
border-left-color $accentColor
6267
63-
a
64-
color #fff
68+
span
69+
color #fff
6570
</style>

0 commit comments

Comments
 (0)