enhance(ServerFinder): 使用する背景画像の優先順位を変更

This commit is contained in:
kakkokari-gtyih 2024-03-12 10:50:24 +09:00
parent f9dac8ba37
commit b6d3a4fff3
3 changed files with 11 additions and 11 deletions

View File

@ -1,4 +1,4 @@
import type { FunctionalComponent } from "nuxt/dist/app/compat/capi"; import type { Component } from "#app/compat/capi";
import GHIcon from "bi/github.svg"; import GHIcon from "bi/github.svg";
export type NavSection = { export type NavSection = {
@ -18,7 +18,7 @@ export type NavItem = {
to: string; to: string;
} | { } | {
/** アイコンsvgをインポートして貼り付け */ /** アイコンsvgをインポートして貼り付け */
icon: FunctionalComponent | string; icon: Component | string;
/** リンク先 */ /** リンク先 */
to: string; to: string;
}; };

View File

@ -3,8 +3,8 @@
<GNuxtLink :to="`https://${instance.url}`" target="_blank" class="relative"> <GNuxtLink :to="`https://${instance.url}`" target="_blank" class="relative">
<template v-if="view === 'grid'"> <template v-if="view === 'grid'">
<div class="relative aspect-video bg-gray-200 dark:bg-gray-600"> <div class="relative aspect-video bg-gray-200 dark:bg-gray-600">
<img v-if="instance.banner" loading="lazy" :src="`https://instanceapp.misskey.page/instance-banners/${instance.url}.webp`" class="w-full h-full object-cover" /> <img v-if="instance.background" loading="lazy" :src="`https://instanceapp.misskey.page/instance-backgrounds/${instance.url}.webp`" class="w-full h-full object-cover" />
<img v-else-if="instance.background" loading="lazy" :src="`https://instanceapp.misskey.page/instance-backgrounds/${instance.url}.webp`" class="w-full h-full object-cover" /> <img v-else-if="instance.banner" loading="lazy" :src="`https://instanceapp.misskey.page/instance-banners/${instance.url}.webp`" class="w-full h-full object-cover" />
<div class="absolute h-1/2 bottom-0 left-0 w-full bg-gradient-to-b from-transparent to-black text-white p-4 flex items-end"> <div class="absolute h-1/2 bottom-0 left-0 w-full bg-gradient-to-b from-transparent to-black text-white p-4 flex items-end">
<div class="h-14 w-14 min-w-0 flex-shrink-0 mr-4"> <div class="h-14 w-14 min-w-0 flex-shrink-0 mr-4">
<img v-if="instance.icon" :src="`https://instanceapp.misskey.page/instance-icons/${instance.url}.webp`" class="w-full h-full rounded" /> <img v-if="instance.icon" :src="`https://instanceapp.misskey.page/instance-icons/${instance.url}.webp`" class="w-full h-full rounded" />
@ -35,8 +35,8 @@
</template> </template>
<template v-else-if="view === 'list'"> <template v-else-if="view === 'list'">
<div class="absolute h-full w-4/5 top-0 left-0 overflow-hidden"> <div class="absolute h-full w-4/5 top-0 left-0 overflow-hidden">
<img v-if="instance.banner" loading="lazy" :src="`https://instanceapp.misskey.page/instance-banners/${instance.url}.webp`" class="h-full w-full object-cover object-center opacity-40 blur-md" /> <img v-if="instance.background" loading="lazy" :src="`https://instanceapp.misskey.page/instance-backgrounds/${instance.url}.webp`" class="h-full w-full object-cover object-center opacity-40 blur-md" />
<img v-else-if="instance.background" loading="lazy" :src="`https://instanceapp.misskey.page/instance-backgrounds/${instance.url}.webp`" class="h-full w-full object-cover object-center opacity-40 blur-md" /> <img v-else-if="instance.banner" loading="lazy" :src="`https://instanceapp.misskey.page/instance-banners/${instance.url}.webp`" class="h-full w-full object-cover object-center opacity-40 blur-md" />
<div class="absolute top-0 left-0 h-full w-full bg-gradient-to-r from-transparent to-white dark:to-slate-800"></div> <div class="absolute top-0 left-0 h-full w-full bg-gradient-to-r from-transparent to-white dark:to-slate-800"></div>
</div> </div>
<div class="relative flex w-full items-center p-2"> <div class="relative flex w-full items-center p-2">

10
types/misc.d.ts vendored
View File

@ -1,11 +1,13 @@
import type { LocaleCodes } from './../nuxt.config'; import type { LocaleCodes } from './../nuxt.config';
import type { ComputedRef } from 'vue-demi'; import type { ComputedRef } from 'vue-demi';
import type { LocaleObject } from '@nuxtjs/i18n'; import type { LocaleObject } from '@nuxtjs/i18n';
import { FunctionalComponent, SVGAttributes } from '#app/compat/capi';
export { };
declare module '*.svg' { declare module '*.svg' {
import { FunctionalComponent, SVGAttributes } from 'vue' const src: FunctionalComponent<SVGAttributes>;
const src: FunctionalComponent<SVGAttributes> export default src;
export default src
} }
declare module 'nuxt/schema' { declare module 'nuxt/schema' {
@ -52,5 +54,3 @@ declare module 'vue-i18n' {
locales: ComputedRef<LocaleObject[]> locales: ComputedRef<LocaleObject[]>
} }
} }
export { };