This commit is contained in:
syuilo 2018-03-05 11:33:44 +09:00
parent f5f7ceb66b
commit a9ce3a2f88
2 changed files with 82 additions and 83 deletions

View file

@ -33,26 +33,26 @@
</div> </div>
</header> </header>
<div class="body"> <div class="body">
<div class="text" ref="text"> <p class="channel" v-if="p.channel">
<p class="channel" v-if="p.channel"> <a :href="`${_CH_URL_}/${p.channel.id}`" target="_blank">{{ p.channel.title }}</a>:
<a :href="`${_CH_URL_}/${p.channel.id}`" target="_blank">{{ p.channel.title }}</a>: </p>
</p> <div class="text">
<a class="reply" v-if="p.reply">%fa:reply%</a> <a class="reply" v-if="p.reply">%fa:reply%</a>
<mk-post-html v-if="p.ast" :ast="p.ast" :i="os.i" :class="$style.text"/> <mk-post-html v-if="p.ast" :ast="p.ast" :i="os.i" :class="$style.text"/>
<div class="tags" v-if="p.tags && p.tags.length > 0">
<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
</div>
<a class="rp" v-if="p.repost">RP:</a> <a class="rp" v-if="p.repost">RP:</a>
<p class="location" v-if="p.geo">%fa:map-marker-alt% 位置情報</p>
<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
</div> </div>
<div class="media" v-if="p.media"> <div class="media" v-if="p.media">
<mk-images :images="p.media"/> <mk-images :images="p.media"/>
</div> </div>
<mk-poll v-if="p.poll" :post="p" ref="pollViewer"/> <mk-poll v-if="p.poll" :post="p" ref="pollViewer"/>
<div class="tags" v-if="p.tags && p.tags.length > 0">
<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
</div>
<a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.latitude},${p.geo.longitude}`" target="_blank">%fa:map-marker-alt% 位置情報</a>
<div class="repost" v-if="p.repost">%fa:quote-right -flip-h% <div class="repost" v-if="p.repost">%fa:quote-right -flip-h%
<mk-post-preview class="repost" :post="p.repost"/> <mk-post-preview class="repost" :post="p.repost"/>
</div> </div>
<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
</div> </div>
<footer> <footer>
<mk-reactions-viewer :post="p" ref="reactionsViewer"/> <mk-reactions-viewer :post="p" ref="reactionsViewer"/>
@ -433,12 +433,6 @@ export default Vue.extend({
color #aaa color #aaa
border-left solid 3px #eee border-left solid 3px #eee
.mk-url-preview
margin-top 8px
> .channel
margin 0
> .reply > .reply
margin-right 8px margin-right 8px
color #717171 color #717171
@ -448,39 +442,45 @@ export default Vue.extend({
font-style oblique font-style oblique
color #a0bf46 color #a0bf46
> .location > .location
margin 4px 0 margin 4px 0
font-size 12px font-size 12px
color #ccc color #ccc
> .tags > .tags
margin 4px 0 0 0 margin 4px 0 0 0
> * > *
display inline-block display inline-block
margin 0 8px 0 0 margin 0 8px 0 0
padding 2px 8px 2px 16px padding 2px 8px 2px 16px
font-size 90% font-size 90%
color #8d969e color #8d969e
background #edf0f3 background #edf0f3
border-radius 4px border-radius 4px
&:before &:before
content "" content ""
display block display block
position absolute position absolute
top 0 top 0
bottom 0 bottom 0
left 4px left 4px
width 8px width 8px
height 8px height 8px
margin auto 0 margin auto 0
background #fff background #fff
border-radius 100% border-radius 100%
&:hover &:hover
text-decoration none text-decoration none
background #e2e7ec background #e2e7ec
.mk-url-preview
margin-top 8px
> .channel
margin 0
> .mk-poll > .mk-poll
font-size 80% font-size 80%

View file

@ -32,23 +32,23 @@
</div> </div>
</header> </header>
<div class="body"> <div class="body">
<div class="text" ref="text"> <p class="channel" v-if="p.channel != null"><a target="_blank">{{ p.channel.title }}</a>:</p>
<p class="channel" v-if="p.channel != null"><a target="_blank">{{ p.channel.title }}</a>:</p> <div class="text">
<a class="reply" v-if="p.reply"> <a class="reply" v-if="p.reply">
%fa:reply% %fa:reply%
</a> </a>
<mk-post-html v-if="p.ast" :ast="p.ast" :i="os.i" :class="$style.text"/> <mk-post-html v-if="p.ast" :ast="p.ast" :i="os.i" :class="$style.text"/>
<div class="tags" v-if="p.tags && p.tags.length > 0">
<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
</div>
<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
<a class="rp" v-if="p.repost != null">RP:</a> <a class="rp" v-if="p.repost != null">RP:</a>
</div> </div>
<div class="media" v-if="p.media"> <div class="media" v-if="p.media">
<mk-images :images="p.media"/> <mk-images :images="p.media"/>
</div> </div>
<mk-poll v-if="p.poll" :post="p" ref="pollViewer"/> <mk-poll v-if="p.poll" :post="p" ref="pollViewer"/>
<p class="location" v-if="p.geo">%fa:map-marker-alt% 位置情報</p> <div class="tags" v-if="p.tags && p.tags.length > 0">
<router-link v-for="tag in p.tags" :key="tag" :to="`/search?q=#${tag}`">{{ tag }}</router-link>
</div>
<mk-url-preview v-for="url in urls" :url="url" :key="url"/>
<a class="location" v-if="p.geo" :href="`http://maps.google.com/maps?q=${p.geo.latitude},${p.geo.longitude}`" target="_blank">%fa:map-marker-alt% 位置情報</a>
<span class="app" v-if="p.app">via <b>{{ p.app.name }}</b></span> <span class="app" v-if="p.app">via <b>{{ p.app.name }}</b></span>
<div class="repost" v-if="p.repost">%fa:quote-right -flip-h% <div class="repost" v-if="p.repost">%fa:quote-right -flip-h%
<mk-post-preview class="repost" :post="p.repost"/> <mk-post-preview class="repost" :post="p.repost"/>
@ -356,7 +356,6 @@ export default Vue.extend({
> .body > .body
> .text > .text
cursor default
display block display block
margin 0 margin 0
padding 0 padding 0
@ -370,12 +369,6 @@ export default Vue.extend({
color #aaa color #aaa
border-left solid 3px #eee border-left solid 3px #eee
.mk-url-preview
margin-top 8px
> .channel
margin 0
> .reply > .reply
margin-right 8px margin-right 8px
color #717171 color #717171
@ -385,31 +378,6 @@ export default Vue.extend({
font-style oblique font-style oblique
color #a0bf46 color #a0bf46
> .tags
margin 4px 0 0 0
> *
display inline-block
margin 0 8px 0 0
padding 2px 8px 2px 16px
font-size 90%
color #8d969e
background #edf0f3
border-radius 4px
&:before
content ""
display block
position absolute
top 0
bottom 0
left 4px
width 8px
height 8px
margin auto 0
background #fff
border-radius 100%
[data-is-me]:after [data-is-me]:after
content "you" content "you"
padding 0 4px padding 0 4px
@ -419,6 +387,37 @@ export default Vue.extend({
background $theme-color background $theme-color
border-radius 4px border-radius 4px
.mk-url-preview
margin-top 8px
> .channel
margin 0
> .tags
margin 4px 0 0 0
> *
display inline-block
margin 0 8px 0 0
padding 2px 8px 2px 16px
font-size 90%
color #8d969e
background #edf0f3
border-radius 4px
&:before
content ""
display block
position absolute
top 0
bottom 0
left 4px
width 8px
height 8px
margin auto 0
background #fff
border-radius 100%
> .media > .media
> img > img
display block display block