Loads of fixes: notifs, autoload setting, overflow, faint text, reply form, status fadein.

This commit is contained in:
shpuld 2018-04-11 19:34:40 +03:00
parent 82ee24ec31
commit a1f6ef1dca
12 changed files with 50 additions and 41 deletions

View file

@ -1,5 +1,5 @@
<template>
<div class="status-el status-fadein" :class="[{ 'status-el_focused': isFocused }, { 'status-conversation': inlineExpanded }]">
<div class="status-el" :class="[{ 'status-el_focused': isFocused }, { 'status-conversation': inlineExpanded }]">
<template v-if="muted && !noReplyLinks">
<div class="media status container muted">
<small><router-link :to="{ name: 'user-profile', params: { id: status.user.id } }">{{status.user.screen_name}}</router-link></small>
@ -33,7 +33,7 @@
<h4 class="user-name">{{status.user.name}}</h4>
<span class="links">
<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"> &gt;
<span v-if="status.in_reply_to_screen_name" class="faint"> &gt;
<router-link :to="{ name: 'user-profile', params: { id: status.in_reply_to_user_id } }">
{{status.in_reply_to_screen_name}}
</router-link>
@ -167,6 +167,9 @@
border-color: $fallback--border;
border-color: var(--border, $fallback--border);
border-left: 4px $fallback--cRed;
border-left: 4px var(--cRed, $fallback--cRed);
&_focused {
background-color: $fallback--lightBg;
background-color: var(--lightBg, $fallback--lightBg);
@ -307,7 +310,7 @@
}
.status-fadein {
animation-duration: 0.3s;
animation-duration: 0.4s;
animation-name: fadein;
}
@ -389,9 +392,6 @@
.status {
display: flex;
padding: 0.6em;
border-left: 4px $fallback--cRed;
border-left: 4px var(--cRed, $fallback--cRed);
border-left-style: inherit;
}
.status-conversation:last-child {
@ -399,7 +399,7 @@
}
.timeline .panel.timeline {
overflow: hidden;
//overflow: hidden;
}
.muted {
@ -427,6 +427,13 @@ a.unmute {
flex: 1;
}
.timeline > {
.status-el:last-child {
border-bottom-radius: 0 0 $fallback--panelRadius $fallback--panelRadius;;
border-radius: 0 0 var(--panelRadius, $fallback--panelRadius) var(--panelRadius, $fallback--panelRadius);
}
}
@media all and (max-width: 960px) {
.status-el {
.retweet-info {