mirror of
https://git.joinsharkey.org/Sharkey/Sharkey.git
synced 2024-11-09 19:43:09 +02:00
🎨
This commit is contained in:
parent
1cae39e281
commit
225d7701a4
3 changed files with 17 additions and 17 deletions
|
@ -812,6 +812,7 @@ continueThread: "さらにスレッドを見る"
|
|||
deleteAccountConfirm: "アカウントが削除されます。よろしいですか?"
|
||||
incorrectPassword: "パスワードが間違っています。"
|
||||
voteConfirm: "「{choice}」に投票しますか?"
|
||||
hide: "隠す"
|
||||
|
||||
_emailUnavailable:
|
||||
used: "既に使用されています"
|
||||
|
|
|
@ -8,7 +8,7 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="gqnyydlz" :style="{ background: color }">
|
||||
<div v-else class="gqnyydlz">
|
||||
<a
|
||||
:href="image.url"
|
||||
:title="image.name"
|
||||
|
@ -16,15 +16,13 @@
|
|||
<ImgWithBlurhash :hash="image.blurhash" :src="url" :alt="image.comment" :title="image.comment" :cover="false"/>
|
||||
<div v-if="image.type === 'image/gif'" class="gif">GIF</div>
|
||||
</a>
|
||||
<i class="fas fa-eye-slash" @click="hide = true"></i>
|
||||
<button v-tooltip="$ts.hide" class="_button hide" @click="hide = true"><i class="fas fa-eye-slash"></i></button>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts">
|
||||
import { defineComponent } from 'vue';
|
||||
import { getStaticImageUrl } from '@/scripts/get-static-image-url';
|
||||
import { extractAvgColorFromBlurhash } from '@/scripts/extract-avg-color-from-blurhash';
|
||||
import ImageViewer from './image-viewer.vue';
|
||||
import ImgWithBlurhash from '@/components/img-with-blurhash.vue';
|
||||
import * as os from '@/os';
|
||||
|
||||
|
@ -44,7 +42,6 @@ export default defineComponent({
|
|||
data() {
|
||||
return {
|
||||
hide: true,
|
||||
color: null,
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
@ -64,9 +61,6 @@ export default defineComponent({
|
|||
// Plugin:register_note_view_interruptor を使って書き換えられる可能性があるためwatchする
|
||||
this.$watch('image', () => {
|
||||
this.hide = (this.$store.state.nsfw === 'force') ? true : this.image.isSensitive && (this.$store.state.nsfw !== 'ignore');
|
||||
if (this.image.blurhash) {
|
||||
this.color = extractAvgColorFromBlurhash(this.image.blurhash);
|
||||
}
|
||||
}, {
|
||||
deep: true,
|
||||
immediate: true,
|
||||
|
@ -109,21 +103,26 @@ export default defineComponent({
|
|||
|
||||
.gqnyydlz {
|
||||
position: relative;
|
||||
border: solid 0.5px var(--divider);
|
||||
//box-shadow: 0 0 0 1px var(--divider) inset;
|
||||
background: var(--bg);
|
||||
|
||||
> i {
|
||||
> .hide {
|
||||
display: block;
|
||||
position: absolute;
|
||||
border-radius: 6px;
|
||||
background-color: var(--fg);
|
||||
color: var(--accentLighten);
|
||||
font-size: 14px;
|
||||
opacity: .5;
|
||||
padding: 3px 6px;
|
||||
background-color: var(--accentedBg);
|
||||
-webkit-backdrop-filter: var(--blur, blur(15px));
|
||||
backdrop-filter: var(--blur, blur(15px));
|
||||
color: var(--accent);
|
||||
font-size: 0.8em;
|
||||
padding: 6px 8px;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
top: 12px;
|
||||
right: 12px;
|
||||
|
||||
> i {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
|
||||
> a {
|
||||
|
|
|
@ -130,7 +130,7 @@ export default defineComponent({
|
|||
bottom: 0;
|
||||
left: 0;
|
||||
display: grid;
|
||||
grid-gap: 4px;
|
||||
grid-gap: 8px;
|
||||
|
||||
> * {
|
||||
overflow: hidden;
|
||||
|
|
Loading…
Reference in a new issue