summaryrefslogtreecommitdiff
path: root/src/web
diff options
context:
space:
mode:
Diffstat (limited to 'src/web')
-rw-r--r--src/web/app/common/tags/index.js2
-rw-r--r--src/web/app/common/tags/poll-editor.tag47
-rw-r--r--src/web/app/common/tags/poll.tag73
-rw-r--r--src/web/app/desktop/tags/notifications.tag6
-rw-r--r--src/web/app/desktop/tags/post-form.tag12
-rw-r--r--src/web/app/desktop/tags/timeline-post.tag4
-rw-r--r--src/web/app/mobile/tags/notification-preview.tag34
-rw-r--r--src/web/app/mobile/tags/notification.tag93
-rw-r--r--src/web/app/mobile/tags/post-form.tag12
-rw-r--r--src/web/app/mobile/tags/timeline-post.tag4
10 files changed, 251 insertions, 36 deletions
diff --git a/src/web/app/common/tags/index.js b/src/web/app/common/tags/index.js
index ef61d51ba4..692a7070a4 100644
--- a/src/web/app/common/tags/index.js
+++ b/src/web/app/common/tags/index.js
@@ -18,3 +18,5 @@ require('./signin-history.tag');
require('./api-info.tag');
require('./twitter-setting.tag');
require('./authorized-apps.tag');
+require('./poll.tag');
+require('./poll-editor.tag');
diff --git a/src/web/app/common/tags/poll-editor.tag b/src/web/app/common/tags/poll-editor.tag
new file mode 100644
index 0000000000..04c712b611
--- /dev/null
+++ b/src/web/app/common/tags/poll-editor.tag
@@ -0,0 +1,47 @@
+<mk-poll-editor>
+ <ul>
+ <li each={ choice, i in choices }>
+ <input value={ choice } oninput={ oninput.bind(null, i) }>
+ <button onclick={ remove.bind(null, i) }>削除</button>
+ </li>
+ </ul>
+ <button onclick={ add }>選択肢を追加</button>
+ <style type="stylus">
+ :scope
+ display block
+
+ > ul
+ display block
+ margin 0
+ padding 0
+ list-style none
+
+ > li
+ display block
+ margin 4px
+ padding 8px 12px
+ width 100%
+
+ </style>
+ <script>
+ @choices = ['', '']
+
+ @oninput = (i, e) ~>
+ @choices[i] = e.target.value
+
+ @add = ~>
+ @choices.push ''
+ @update!
+
+ @remove = (i) ~>
+ console.log i
+ console.log @choices.filter((_, _i) -> _i != i)
+ @choices = @choices.filter((_, _i) -> _i != i)
+ @update!
+
+ @get = ~>
+ return {
+ choices: @choices.filter (choice) -> choice != ''
+ }
+ </script>
+</mk-poll-editor>
diff --git a/src/web/app/common/tags/poll.tag b/src/web/app/common/tags/poll.tag
new file mode 100644
index 0000000000..8c14b895eb
--- /dev/null
+++ b/src/web/app/common/tags/poll.tag
@@ -0,0 +1,73 @@
+<mk-poll>
+ <ul>
+ <li each={ poll.choices } onclick={ vote.bind(null, id) } class={ voted: voted }>
+ <div class="backdrop" if={ parent.result } style={ 'width:' + (votes / parent.total * 100) + '%' }></div>
+ <span>
+ <i class="fa fa-check" if={ is_voted }></i>
+ { text }
+ <span class="votes" if={ parent.result }>({ votes }票)</span>
+ </span>
+ </li>
+ </ul>
+ <p>{ total }人が投票</p>
+ <style type="stylus">
+ :scope
+ display block
+
+ > ul
+ display block
+ margin 0
+ padding 0
+ list-style none
+
+ > li
+ display block
+ margin 4px
+ padding 4px 8px
+ width 100%
+ border-radius 4px
+ overflow hidden
+ cursor pointer
+
+ &:hover
+ background rgba(0, 0, 0, 0.05)
+
+ &:active
+ background rgba(0, 0, 0, 0.1)
+
+ > .backdrop
+ position absolute
+ top 0
+ left 0
+ height 100%
+ background $theme-color
+
+ > .votes
+ margin-left 4px
+
+ </style>
+ <script>
+ @mixin \api
+
+ @post = @opts.post
+ @poll = @post.poll
+ @total = @poll.choices.reduce ((a, b) -> a + b.votes), 0
+ @result = @poll.choices.some (c) -> c.is_voted
+
+ @vote = (id) ~>
+ if (@poll.choices.some (c) -> c.is_voted) then return
+ @api \posts/polls/vote do
+ post_id: @post.id
+ choice: id
+ .then ~>
+ @poll.choices.for-each (c) ->
+ if c.id == id
+ c.votes++
+ c.is_voted = true
+ @update do
+ poll: @poll
+ result: true
+ total: @total + 1
+
+ </script>
+</mk-poll>
diff --git a/src/web/app/desktop/tags/notifications.tag b/src/web/app/desktop/tags/notifications.tag
index aaf72bb2ca..3c5f3d89e2 100644
--- a/src/web/app/desktop/tags/notifications.tag
+++ b/src/web/app/desktop/tags/notifications.tag
@@ -39,6 +39,12 @@
<p><i class="fa fa-at"></i><a href={ CONFIG.url + '/' + notification.post.user.username } data-user-preview={ notification.post.user_id }>{ notification.post.user.name }</a></p><a class="post-preview" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
</div>
</virtual>
+ <virtual if={ notification.type == 'poll_vote' }>
+ <a class="avatar-anchor" href={ CONFIG.url + '/' + notification.user.username } data-user-preview={ notification.user.id }><img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=48' } alt="avatar"/></a>
+ <div class="text">
+ <p><i class="fa fa-pie-chart"></i><a href={ CONFIG.url + '/' + notification.user.username } data-user-preview={ notification.user.id }>{ notification.user.name }</a></p><a class="post-ref" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
+ </div>
+ </virtual>
</div>
<p class="date" if={ i != notifications.length - 1 && notification._date != notifications[i + 1]._date }><span><i class="fa fa-angle-up"></i>{ notification._datetext }</span><span><i class="fa fa-angle-down"></i>{ notifications[i + 1]._datetext }</span></p>
</virtual>
diff --git a/src/web/app/desktop/tags/post-form.tag b/src/web/app/desktop/tags/post-form.tag
index 872e928816..d4b93a6a18 100644
--- a/src/web/app/desktop/tags/post-form.tag
+++ b/src/web/app/desktop/tags/post-form.tag
@@ -10,9 +10,11 @@
<p class="remain">残り{ 4 - files.length }</p>
</div>
<mk-uploader ref="uploader"></mk-uploader>
+ <div ref="pollZone"></div>
<button ref="upload" title="PCからファイルを添付" onclick={ selectFile }><i class="fa fa-upload"></i></button>
<button ref="drive" title="ドライブからファイルを添付" onclick={ selectFileFromDrive }><i class="fa fa-cloud"></i></button>
<button class="cat" title="Insert The Cat" onclick={ cat }><i class="fa fa-smile-o"></i></button>
+ <button class="poll" title="投票を作成" onclick={ addPoll }><i class="fa fa-pie-chart"></i></button>
<p class="text-count { over: refs.text.value.length > 1000 }">のこり{ 1000 - refs.text.value.length }文字</p>
<button class={ wait: wait } ref="submit" disabled={ wait || (refs.text.value.length == 0 && files.length == 0) } onclick={ post }>{ wait ? '投稿中' : opts.reply ? '返信' : '投稿' }
<mk-ellipsis if={ wait }></mk-ellipsis>
@@ -239,6 +241,7 @@
[ref='upload']
[ref='drive']
.cat
+ .poll
display inline-block
cursor pointer
padding 0
@@ -295,6 +298,7 @@
@uploadings = []
@files = []
@autocomplete = null
+ @poll = null
@in-reply-to-post = @opts.reply
@@ -409,6 +413,13 @@
@trigger \change-files @files
@update!
+ @add-poll = ~>
+ if @poll?
+ @poll.unmount!
+ @poll = null
+ return
+ @poll = riot.mount(@refs.pollZone.append-child document.create-element \mk-poll-editor).0
+
@post = (e) ~>
@wait = true
@@ -420,6 +431,7 @@
text: @refs.text.value
media_ids: files
reply_to_id: if @in-reply-to-post? then @in-reply-to-post.id else undefined
+ poll: if @poll? then @poll.get! else undefined
.then (data) ~>
@trigger \post
@notify if @in-reply-to-post? then '返信しました!' else '投稿しました!'
diff --git a/src/web/app/desktop/tags/timeline-post.tag b/src/web/app/desktop/tags/timeline-post.tag
index dd26f79e2d..b4e83ae1f3 100644
--- a/src/web/app/desktop/tags/timeline-post.tag
+++ b/src/web/app/desktop/tags/timeline-post.tag
@@ -40,6 +40,7 @@
<div class="media" if={ p.media }>
<mk-images-viewer images={ p.media }></mk-images-viewer>
</div>
+ <mk-poll if={ p.poll } post={ p }></mk-poll>
<div class="repost" if={ p.repost }><i class="fa fa-quote-right fa-flip-horizontal"></i>
<mk-post-preview class="repost" post={ p.repost }></mk-post-preview>
</div>
@@ -258,6 +259,9 @@
display block
max-width 100%
+ > mk-poll
+ font-size 80%
+
> .repost
margin 8px 0
diff --git a/src/web/app/mobile/tags/notification-preview.tag b/src/web/app/mobile/tags/notification-preview.tag
index aaae1d483b..131866d1d7 100644
--- a/src/web/app/mobile/tags/notification-preview.tag
+++ b/src/web/app/mobile/tags/notification-preview.tag
@@ -1,48 +1,52 @@
<mk-notification-preview class={ notification.type }>
- <div class="main" if={ notification.type == 'like' }><img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ <virtual if={ notification.type == 'like' }><img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
<div class="text">
<p><i class="fa fa-thumbs-o-up"></i>{ notification.user.name }</p>
<p class="post-ref">{ getPostSummary(notification.post) }</p>
</div>
- </div>
- <div class="main" if={ notification.type == 'repost' }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </virtual>
+ <virtual if={ notification.type == 'repost' }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
<div class="text">
<p><i class="fa fa-retweet"></i>{ notification.post.user.name }</p>
<p class="post-ref">{ getPostSummary(notification.post.repost) }</p>
</div>
- </div>
- <div class="main" if={ notification.type == 'quote' }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </virtual>
+ <virtual if={ notification.type == 'quote' }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
<div class="text">
<p><i class="fa fa-quote-left"></i>{ notification.post.user.name }</p>
<p class="post-preview">{ getPostSummary(notification.post) }</p>
</div>
- </div>
- <div class="main" if={ notification.type == 'follow' }><img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </virtual>
+ <virtual if={ notification.type == 'follow' }><img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
<div class="text">
<p><i class="fa fa-user-plus"></i>{ notification.user.name }</p>
</div>
- </div>
- <div class="main" if={ notification.type == 'reply' }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </virtual>
+ <virtual if={ notification.type == 'reply' }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
<div class="text">
<p><i class="fa fa-reply"></i>{ notification.post.user.name }</p>
<p class="post-preview">{ getPostSummary(notification.post) }</p>
</div>
- </div>
- <div class="main" if={ notification.type == 'mention' }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </virtual>
+ <virtual if={ notification.type == 'mention' }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
<div class="text">
<p><i class="fa fa-at"></i>{ notification.post.user.name }</p>
<p class="post-preview">{ getPostSummary(notification.post) }</p>
</div>
- </div>
+ </virtual>
+ <virtual if={ notification.type == 'poll_vote' }><img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ <div class="text">
+ <p><i class="fa fa-pie-chart"></i>{ notification.user.name }</p>
+ <p class="post-ref">{ getPostSummary(notification.post) }</p>
+ </div>
+ </virtual>
<style type="stylus">
:scope
display block
margin 0
padding 8px
color #fff
-
- > .main
- overflow-wrap break-word
+ overflow-wrap break-word
&:after
content ""
diff --git a/src/web/app/mobile/tags/notification.tag b/src/web/app/mobile/tags/notification.tag
index 583e74b727..ccd4d1dc9d 100644
--- a/src/web/app/mobile/tags/notification.tag
+++ b/src/web/app/mobile/tags/notification.tag
@@ -1,40 +1,94 @@
<mk-notification class={ notification.type }>
<mk-time time={ notification.created_at }></mk-time>
- <div class="main" if={ notification.type == 'like' }><a class="avatar-anchor" href={ CONFIG.url + '/' + notification.user.username }><img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/></a>
+ <virtual if={ notification.type == 'like' }>
+ <a class="avatar-anchor" href={ CONFIG.url + '/' + notification.user.username }>
+ <img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </a>
<div class="text">
- <p><i class="fa fa-thumbs-o-up"></i><a href={ CONFIG.url + '/' + notification.user.username }>{ notification.user.name }</a></p><a class="post-ref" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
+ <p>
+ <i class="fa fa-thumbs-o-up"></i>
+ <a href={ CONFIG.url + '/' + notification.user.username }>{ notification.user.name }</a>
+ </p>
+ <a class="post-ref" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
</div>
- </div>
- <div class="main" if={ notification.type == 'repost' }><a class="avatar-anchor" href={ CONFIG.url + '/' + notification.post.user.username }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/></a>
+ </virtual>
+ <virtual if={ notification.type == 'repost' }>
+ <a class="avatar-anchor" href={ CONFIG.url + '/' + notification.post.user.username }>
+ <img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </a>
<div class="text">
- <p><i class="fa fa-retweet"></i><a href={ CONFIG.url + '/' + notification.post.user.username }>{ notification.post.user.name }</a></p><a class="post-ref" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post.repost) }</a>
+ <p>
+ <i class="fa fa-retweet"></i>
+ <a href={ CONFIG.url + '/' + notification.post.user.username }>{ notification.post.user.name }</a>
+ </p>
+ <a class="post-ref" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post.repost) }</a>
</div>
- </div>
- <div class="main" if={ notification.type == 'quote' }><a class="avatar-anchor" href={ CONFIG.url + '/' + notification.post.user.username }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/></a>
+ </virtual>
+ <virtual if={ notification.type == 'quote' }>
+ <a class="avatar-anchor" href={ CONFIG.url + '/' + notification.post.user.username }>
+ <img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </a>
<div class="text">
- <p><i class="fa fa-quote-left"></i><a href={ CONFIG.url + '/' + notification.post.user.username }>{ notification.post.user.name }</a></p><a class="post-preview" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
+ <p>
+ <i class="fa fa-quote-left"></i>
+ <a href={ CONFIG.url + '/' + notification.post.user.username }>{ notification.post.user.name }</a>
+ </p>
+ <a class="post-preview" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
</div>
- </div>
- <div class="main" if={ notification.type == 'follow' }><a class="avatar-anchor" href={ CONFIG.url + '/' + notification.user.username }><img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/></a>
+ </virtual>
+ <virtual if={ notification.type == 'follow' }>
+ <a class="avatar-anchor" href={ CONFIG.url + '/' + notification.user.username }>
+ <img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </a>
<div class="text">
- <p><i class="fa fa-user-plus"></i><a href={ CONFIG.url + '/' + notification.user.username }>{ notification.user.name }</a></p>
+ <p>
+ <i class="fa fa-user-plus"></i>
+ <a href={ CONFIG.url + '/' + notification.user.username }>{ notification.user.name }</a>
+ </p>
</div>
- </div>
- <div class="main" if={ notification.type == 'reply' }><a class="avatar-anchor" href={ CONFIG.url + '/' + notification.post.user.username }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/></a>
+ </virtual>
+ <virtual if={ notification.type == 'reply' }>
+ <a class="avatar-anchor" href={ CONFIG.url + '/' + notification.post.user.username }>
+ <img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </a>
<div class="text">
- <p><i class="fa fa-reply"></i><a href={ CONFIG.url + '/' + notification.post.user.username }>{ notification.post.user.name }</a></p><a class="post-preview" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
+ <p>
+ <i class="fa fa-reply"></i>
+ <a href={ CONFIG.url + '/' + notification.post.user.username }>{ notification.post.user.name }</a>
+ </p>
+ <a class="post-preview" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
</div>
- </div>
- <div class="main" if={ notification.type == 'mention' }><a class="avatar-anchor" href={ CONFIG.url + '/' + notification.post.user.username }><img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/></a>
+ </virtual>
+ <virtual if={ notification.type == 'mention' }>
+ <a class="avatar-anchor" href={ CONFIG.url + '/' + notification.post.user.username }>
+ <img class="avatar" src={ notification.post.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </a>
<div class="text">
- <p><i class="fa fa-at"></i><a href={ CONFIG.url + '/' + notification.post.user.username }>{ notification.post.user.name }</a></p><a class="post-preview" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
+ <p>
+ <i class="fa fa-at"></i>
+ <a href={ CONFIG.url + '/' + notification.post.user.username }>{ notification.post.user.name }</a>
+ </p>
+ <a class="post-preview" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
</div>
- </div>
+ </virtual>
+ <virtual if={ notification.type == 'poll_vote' }>
+ <a class="avatar-anchor" href={ CONFIG.url + '/' + notification.user.username }>
+ <img class="avatar" src={ notification.user.avatar_url + '?thumbnail&size=64' } alt="avatar"/>
+ </a>
+ <div class="text">
+ <p>
+ <i class="fa fa-pie-shart"></i>
+ <a href={ CONFIG.url + '/' + notification.user.username }>{ notification.user.name }</a>
+ </p>
+ <a class="post-ref" href={ CONFIG.url + '/' + notification.post.user.username + '/' + notification.post.id }>{ getPostSummary(notification.post) }</a>
+ </div>
+ </virtual>
<style type="stylus">
:scope
display block
margin 0
padding 16px
+ overflow-wrap break-word
> mk-time
display inline
@@ -45,9 +99,6 @@
color rgba(0, 0, 0, 0.6)
font-size 12px
- > .main
- overflow-wrap break-word
-
&:after
content ""
display block
diff --git a/src/web/app/mobile/tags/post-form.tag b/src/web/app/mobile/tags/post-form.tag
index 900f742e85..cfed7c1a8d 100644
--- a/src/web/app/mobile/tags/post-form.tag
+++ b/src/web/app/mobile/tags/post-form.tag
@@ -19,9 +19,11 @@
</ul>
</div>
<mk-uploader ref="uploader"></mk-uploader>
+ <div ref="pollZone"></div>
<button ref="upload" onclick={ selectFile }><i class="fa fa-upload"></i></button>
<button ref="drive" onclick={ selectFileFromDrive }><i class="fa fa-cloud"></i></button>
<button class="cat" onclick={ cat }><i class="fa fa-smile-o"></i></button>
+ <button class="poll" onclick={ addPoll }><i class="fa fa-pie-chart"></i></button>
<input ref="file" type="file" accept="image/*" multiple="multiple" onchange={ changeFile }/>
</div>
<style type="stylus">
@@ -163,6 +165,7 @@
> [ref='upload']
> [ref='drive']
.cat
+ .poll
display inline-block
padding 0
margin 0
@@ -185,6 +188,7 @@
@wait = false
@uploadings = []
@files = []
+ @poll = null
@on \mount ~>
@refs.uploader.on \uploaded (file) ~>
@@ -241,6 +245,13 @@
@trigger \change-files @files
@update!
+ @add-poll = ~>
+ if @poll?
+ @poll.unmount!
+ @poll = null
+ return
+ @poll = riot.mount(@refs.pollZone.append-child document.create-element \mk-poll-editor).0
+
@post = ~>
@wait = true
@@ -252,6 +263,7 @@
text: @refs.text.value
media_ids: files
reply_to_id: if @opts.reply? then @opts.reply.id else undefined
+ poll: if @poll? then @poll.get! else undefined
.then (data) ~>
@trigger \post
@unmount!
diff --git a/src/web/app/mobile/tags/timeline-post.tag b/src/web/app/mobile/tags/timeline-post.tag
index d4696e6037..ff4007f0c9 100644
--- a/src/web/app/mobile/tags/timeline-post.tag
+++ b/src/web/app/mobile/tags/timeline-post.tag
@@ -27,6 +27,7 @@
<div class="media" if={ p.media }>
<mk-images-viewer images={ p.media }></mk-images-viewer>
</div>
+ <mk-poll if={ p.poll } post={ p }></mk-poll>
<span class="app" if={ p.app }>via <b>{ p.app.name }</b></span>
<div class="repost" if={ p.repost }><i class="fa fa-quote-right fa-flip-horizontal"></i>
<mk-post-preview class="repost" post={ p.repost }></mk-post-preview>
@@ -242,6 +243,9 @@
font-size 12px
color #ccc
+ > mk-poll
+ font-size 80%
+
> .repost
margin 8px 0