Fix alignment issues in status heading and repeat info

This commit is contained in:
shpuld 2018-04-14 14:24:05 +03:00
parent 3153bb5b05
commit 424e9166d9

View file

@ -33,7 +33,8 @@
<h4 class="user-name">{{status.user.name}}</h4> <h4 class="user-name">{{status.user.name}}</h4>
<span class="links"> <span class="links">
<router-link :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link> <router-link :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link>
<span v-if="status.in_reply_to_screen_name" class="faint"> &gt; <span v-if="status.in_reply_to_screen_name" class="faint reply-info">
<i class="icon-right-open"></i>
<router-link :to="{ name: 'user-profile', params: { id: status.in_reply_to_user_id } }"> <router-link :to="{ name: 'user-profile', params: { id: status.in_reply_to_user_id } }">
{{status.in_reply_to_screen_name}} {{status.in_reply_to_screen_name}}
</router-link> </router-link>
@ -212,9 +213,12 @@
flex: 1 0; flex: 1 0;
display: flex; display: flex;
flex-wrap: wrap; flex-wrap: wrap;
align-content: center;
} }
.links { .links {
display: flex;
padding-top: 1px; padding-top: 1px;
margin-left: 0.2em;
font-size: 12px; font-size: 12px;
color: $fallback--link; color: $fallback--link;
color: var(--link, $fallback--link); color: var(--link, $fallback--link);
@ -226,6 +230,9 @@
white-space: nowrap; white-space: nowrap;
} }
} }
.reply-info {
display: flex;
}
.replies { .replies {
line-height: 16px; line-height: 16px;
} }
@ -317,6 +324,13 @@
.media-body { .media-body {
font-size: 1em; font-size: 1em;
line-height: 22px; line-height: 22px;
display: flex;
align-content: center;
flex-wrap: wrap;
i {
padding: 0 0.2em;
}
a { a {
max-width: 100%; max-width: 100%;
overflow: hidden; overflow: hidden;