mirror of
https://iceshrimp.dev/limepotato/jormungandr-bite.git
synced 2024-11-29 13:27:31 -07:00
chore(client): rendering performance tweak a bit
This commit is contained in:
parent
fc6074494b
commit
6b871b367d
2 changed files with 8 additions and 8 deletions
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<div class="jmgmzlwq _block"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>{{ $ts.remoteUserCaution }}<a :href="href" rel="nofollow noopener" target="_blank">{{ $ts.showOnRemote }}</a></div>
|
<div class="jmgmzlwq _block"><i class="fas fa-exclamation-triangle" style="margin-right: 8px;"></i>{{ $ts.remoteUserCaution }}<a class="link" :href="href" rel="nofollow noopener" target="_blank">{{ $ts.showOnRemote }}</a></div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
|
@ -15,7 +15,7 @@ defineProps<{
|
||||||
background: var(--infoWarnBg);
|
background: var(--infoWarnBg);
|
||||||
color: var(--infoWarnFg);
|
color: var(--infoWarnFg);
|
||||||
|
|
||||||
> a {
|
> .link {
|
||||||
margin-left: 4px;
|
margin-left: 4px;
|
||||||
color: var(--accent);
|
color: var(--accent);
|
||||||
}
|
}
|
||||||
|
|
|
@ -8,7 +8,7 @@
|
||||||
</div>
|
</div>
|
||||||
<div v-else v-size="{ max: [400, 350] }" class="mk-url-preview">
|
<div v-else v-size="{ max: [400, 350] }" class="mk-url-preview">
|
||||||
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
|
<transition :name="$store.state.animation ? 'zoom' : ''" mode="out-in">
|
||||||
<component :is="self ? 'MkA' : 'a'" v-if="!fetching" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url">
|
<component :is="self ? 'MkA' : 'a'" v-if="!fetching" class="link" :class="{ compact }" :[attr]="self ? url.substr(local.length) : url" rel="nofollow noopener" :target="target" :title="url">
|
||||||
<div v-if="thumbnail" class="thumbnail" :style="`background-image: url('${thumbnail}')`">
|
<div v-if="thumbnail" class="thumbnail" :style="`background-image: url('${thumbnail}')`">
|
||||||
<button v-if="!playerEnabled && player.url" class="_button" :title="$ts.enablePlayer" @click.prevent="playerEnabled = true"><i class="fas fa-play-circle"></i></button>
|
<button v-if="!playerEnabled && player.url" class="_button" :title="$ts.enablePlayer" @click.prevent="playerEnabled = true"><i class="fas fa-play-circle"></i></button>
|
||||||
</div>
|
</div>
|
||||||
|
@ -57,7 +57,7 @@ let sitename = $ref<string | null>(null);
|
||||||
let player = $ref({
|
let player = $ref({
|
||||||
url: null,
|
url: null,
|
||||||
width: null,
|
width: null,
|
||||||
height: null
|
height: null,
|
||||||
});
|
});
|
||||||
let playerEnabled = $ref(false);
|
let playerEnabled = $ref(false);
|
||||||
let tweetId = $ref<string | null>(null);
|
let tweetId = $ref<string | null>(null);
|
||||||
|
@ -143,7 +143,7 @@ onUnmounted(() => {
|
||||||
|
|
||||||
.mk-url-preview {
|
.mk-url-preview {
|
||||||
&.max-width_400px {
|
&.max-width_400px {
|
||||||
> a {
|
> .link {
|
||||||
font-size: 12px;
|
font-size: 12px;
|
||||||
|
|
||||||
> .thumbnail {
|
> .thumbnail {
|
||||||
|
@ -157,7 +157,7 @@ onUnmounted(() => {
|
||||||
}
|
}
|
||||||
|
|
||||||
&.max-width_350px {
|
&.max-width_350px {
|
||||||
> a {
|
> .link {
|
||||||
font-size: 10px;
|
font-size: 10px;
|
||||||
|
|
||||||
> .thumbnail {
|
> .thumbnail {
|
||||||
|
@ -205,7 +205,7 @@ onUnmounted(() => {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
> a {
|
> .link {
|
||||||
position: relative;
|
position: relative;
|
||||||
display: block;
|
display: block;
|
||||||
font-size: 14px;
|
font-size: 14px;
|
||||||
|
|
Loading…
Reference in a new issue