diff options
Diffstat (limited to 'src/components/status/status.vue')
| -rw-r--r-- | src/components/status/status.vue | 26 |
1 files changed, 23 insertions, 3 deletions
diff --git a/src/components/status/status.vue b/src/components/status/status.vue index 28272b0b..999adb21 100644 --- a/src/components/status/status.vue +++ b/src/components/status/status.vue @@ -34,7 +34,7 @@ <div class="media status container"> <div class="media-left"> <a :href="status.user.statusnet_profile_url"> - <img @click.prevent="toggleUserExpanded" :class="{retweeted: retweet}" class='avatar' :src="status.user.profile_image_url_original"> + <StillImage @click.native.prevent="toggleUserExpanded" :class="{retweeted: retweet}" class='avatar' :src="status.user.profile_image_url_original"/> <img v-if="retweet" class='avatar-retweeter' :src="statusoid.user.profile_image_url_original"></img> </a> </div> @@ -84,7 +84,7 @@ </div> <div class="status-preview base00-background base03-border" v-if="showPreview && preview"> - <img class="avatar" :src="preview.user.profile_image_url_original"> + <StillImage class="avatar" :src="preview.user.profile_image_url_original"/> <div class="text"> <h4> {{ preview.user.name }} @@ -146,6 +146,7 @@ box-shadow: 2px 2px 3px rgba(0, 0, 0, 0.5); margin-top: 0.5em; margin-left: 1em; + z-index: 50; .avatar { flex-shrink: 0; @@ -266,7 +267,6 @@ margin: 0.2em 0.3em 0 0; img { float: right; - border-radius: 5px; } } @@ -330,6 +330,17 @@ .status .avatar { width: 48px; height: 48px; + border-radius: 5px; + overflow: hidden; + + img { + width: 100%; + height: 100%; + } + + &.animated::before { + display: none; + } &.retweeted { width: 40px; @@ -339,6 +350,15 @@ } } + .status:hover .animated.avatar { + canvas { + display: none; + } + img { + visibility: visible; + } + } + .status img.avatar-retweeter { width: 24px; height: 24px; |