summaryrefslogtreecommitdiffstats
path: root/src/components/TimelineEntry.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/TimelineEntry.vue')
-rw-r--r--src/components/TimelineEntry.vue48
1 files changed, 25 insertions, 23 deletions
diff --git a/src/components/TimelineEntry.vue b/src/components/TimelineEntry.vue
index a6a621f2..19c08d88 100644
--- a/src/components/TimelineEntry.vue
+++ b/src/components/TimelineEntry.vue
@@ -25,17 +25,20 @@
</div>
<!-- eslint-disable-next-line vue/no-v-html -->
<div class="post-message" v-html="formatedMessage" />
+ <div v-click-outside="hidePopoverMenu" class="post-actions">
+ <a v-tooltip.bottom="t('social', 'Reply')" class="icon-reply" @click.prevent="reply" />
+ <div v-tooltip.bottom="t('social', 'More actions')" class="post-actions-more">
+ <a class="icon-more" @click.prevent="togglePopoverMenu" />
+ <div :class="{open: menuOpened}" class="popovermenu">
+ <popover-menu :menu="popoverMenu" />
+ </div>
+ </div>
+ </div>
</div>
<div>
<div :data-timestamp="timestamp" class="post-timestamp live-relative-timestamp">
{{ relativeTimestamp }}
</div>
- <div v-click-outside="hidePopoverMenu" class="post-actions">
- <a class="icon-more" @click.prevent="togglePopoverMenu" />
- <div :class="{open: menuOpened}" class="popovermenu">
- <popover-menu :menu="popoverMenu" />
- </div>
- </div>
</div>
</div>
</div>
@@ -69,11 +72,6 @@ export default {
computed: {
popoverMenu() {
var actions = [
- {
- action: () => { this.$root.$emit('composer-reply', this.item) },
- icon: 'icon-reply',
- text: t('social', 'Reply to post')
- }
]
if (this.item.actor_info.account === this.cloudId) {
actions.push(
@@ -118,6 +116,9 @@ export default {
methods: {
userDisplayName(actorInfo) {
return actorInfo.name !== '' ? actorInfo.name : actorInfo.preferredUsername
+ },
+ reply() {
+ this.$root.$emit('composer-reply', this.item)
}
}
}
@@ -128,10 +129,6 @@ export default {
margin-bottom: 10px;
}
- .social__welcome h3 {
- margin-top: 0;
- }
-
.post-author {
font-weight: bold;
}
@@ -158,15 +155,24 @@ export default {
}
.post-actions {
- position: relative;
- width: 44px;
+ margin-left: -13px;
height: 44px;
- float: right;
+ .post-actions-more {
+ position: relative;
+ width: 44px;
+ height: 34px;
+ display: inline-block;
+ }
+ .icon-reply,
.icon-more {
display: inline-block;
width: 44px;
- height: 44px;
+ height: 34px;
+ opacity: .5;
+ &:hover, &:focus {
+ opacity: 1;
+ }
}
}
@@ -184,10 +190,6 @@ export default {
.post-timestamp {
opacity: .7;
}
-
- .icon-reply {
- background-image: url(../../img/reply.svg);
- }
</style>
<style>
.post-message a {