aboutsummaryrefslogtreecommitdiff
path: root/src/components/attachment/attachment.vue
diff options
context:
space:
mode:
authorShpuld Shpuldson <shp@cock.li>2020-11-24 12:32:42 +0200
committerShpuld Shpuldson <shp@cock.li>2020-11-24 12:32:42 +0200
commit7b99d98c553f40ec4d633d0d4fdf65f275c80e77 (patch)
treeb856ab6b3682b0f1df44511d142d99ae98310416 /src/components/attachment/attachment.vue
parent14ce0c1c073e17060a7d3cbe4352a5e9881c03dd (diff)
Replace all use of <a> + href='#' with proper buttons
Diffstat (limited to 'src/components/attachment/attachment.vue')
-rw-r--r--src/components/attachment/attachment.vue28
1 files changed, 17 insertions, 11 deletions
diff --git a/src/components/attachment/attachment.vue b/src/components/attachment/attachment.vue
index f1fac2c8..b072b170 100644
--- a/src/components/attachment/attachment.vue
+++ b/src/components/attachment/attachment.vue
@@ -42,15 +42,13 @@
icon="play-circle"
/>
</a>
- <div
+ <button
v-if="nsfw && hideNsfwLocal && !hidden"
- class="hider"
+ class="button-unstyled -padded hider"
+ @click.prevent="toggleHidden"
>
- <a
- href="#"
- @click.prevent="toggleHidden"
- >Hide</a>
- </div>
+ <FAIcon icon="times" />
+ </button>
<a
v-if="type === 'image' && (!hidden || preloadImage)"
@@ -234,15 +232,23 @@
.hider {
position: absolute;
right: 0;
- white-space: nowrap;
margin: 10px;
padding: 5px;
- background: rgba(230,230,230,0.6);
- font-weight: bold;
z-index: 4;
- line-height: 1;
border-radius: $fallback--tooltipRadius;
border-radius: var(--tooltipRadius, $fallback--tooltipRadius);
+ text-align: center;
+ width: 2em;
+ height: 2em;
+ font-size: 1.25em;
+ // TODO: theming? hard to theme with unknown background image color
+ background: rgba(230, 230, 230, 0.7);
+ .svg-inline--fa {
+ color: rgba(0, 0, 0, 0.6);
+ }
+ &:hover .svg-inline--fa {
+ color: rgba(0, 0, 0, 0.9);
+ }
}
video {