161sh/jointrashposs
1
0
Fork 0
mirror of https://iceshrimp.dev/Crimekillz/jointrashposs.git synced 2024-11-22 08:53:49 +01:00
Code Issues Packages Projects Releases Wiki Activity

(add) servers: not found

Browse Source
This commit is contained in:
kakkokari-gtyih 2023-07-10 12:55:57 +09:00
parent 5a692f54e7
commit 771d74f8b6
3 changed files with 19 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
components/g/Nav.vue
View File

@ -1,5 +1,5 @@
<template> <template>
<div :class="['bg-slate-100 dark:bg-gray-900 bg-opacity-80 backdrop-blur-lg sticky top-0 z-[9900]', { 'shadow': scrollPos >= 40 }]"> <div :class="['bg-slate-100 dark:bg-gray-900 bg-opacity-80 backdrop-blur-lg sticky top-0 z-[9900] transition-[box-shadow]', { 'shadow': scrollPos <= -40 }]">
<nav class="container mx-auto max-w-screen-xl h-16 lg:h-20 grid items-center grid-cols-2 md:grid-cols-4 lg:grid-cols-6 p-4"> <nav class="container mx-auto max-w-screen-xl h-16 lg:h-20 grid items-center grid-cols-2 md:grid-cols-4 lg:grid-cols-6 p-4">
<div class=""> <div class="">
<GNuxtLink :to="localePath('/')" class="flex items-center space-x-2 hover:opacity-80"> <GNuxtLink :to="localePath('/')" class="flex items-center space-x-2 hover:opacity-80">
@ -9,7 +9,7 @@
</div> </div>
<ul class="hidden lg:col-span-4 lg:space-x-8 xl:space-x-10 lg:flex justify-center"> <ul class="hidden lg:col-span-4 lg:space-x-8 xl:space-x-10 lg:flex justify-center">
<li v-for="item in NavData.center"> <li v-for="item in NavData.center">
<GNuxtLink :to="localePath(item.to)" :class="['rounded-full px-4 py-1.5 hover:bg-slate-300 dark:hover:bg-slate-800 hover:bg-opacity-50 bg-blend-multiply', { 'bg-slate-200 dark:bg-slate-800': path.includes(item.to) }]"> <GNuxtLink :to="localePath(item.to)" :class="['rounded-full px-4 py-1.5 hover:bg-slate-300 dark:hover:bg-slate-800 hover:bg-opacity-50 bg-blend-multiply', { 'bg-slate-200 dark:bg-slate-800': path.replace(/\/$/, '') === localePath(item.to).replace(/\/$/, '') }]">
<component v-if="item.icon" :is="item.icon" class="h-5 w-5" /> <component v-if="item.icon" :is="item.icon" class="h-5 w-5" />
<template v-else> <template v-else>
{{ $t(item.i18n) }} {{ $t(item.i18n) }}
@ -79,20 +79,19 @@ function rotateColorMode() {
const scrollPos = ref(0); const scrollPos = ref(0);
function updatePos() { async function updatePos() {
scrollPos.value = window.screenY; scrollPos.value = document.body.getBoundingClientRect().y;
} }
onMounted(() => {
if (process.client) { if (process.client) {
window.addEventListener('scroll', updatePos()); window.addEventListener('scroll', updatePos);
window.addEventListener('resize', updatePos()); window.addEventListener('resize', updatePos);
} }
});
onUnmounted(() => { onUnmounted(() => {
if (process.client) { if (process.client) {
window.removeEventListener('scroll', updatePos()); window.removeEventListener('scroll', updatePos);
window.removeEventListener('resize', updatePos()); window.removeEventListener('resize', updatePos);
} }
}); });
</script> </script>

1
locales/ja-JP.yml
View File

@ -100,4 +100,5 @@ _servers:
public: "開放" public: "開放"
inviteOnly: "招待のみ" inviteOnly: "招待のみ"
_list: _list:
notFound: "指定された条件に合致するサーバーは見つかりませんでした。"
showMore: "もっと見る" showMore: "もっと見る"

8
pages/servers.vue
View File

@ -89,7 +89,13 @@
</aside> </aside>
<div> <div>
<div class="grid gap-4 grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-2"> <div class="grid gap-4 grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-2">
<ServersItem v-for="item in filteredInstances.slice(0, f_limit)" :instance="item" /> <ServersItem v-if="filteredInstances.length > 0" v-for="item in filteredInstances.slice(0, f_limit)" :instance="item" />
<div v-else class="rounded-lg p-6 min-h-[40vh] flex items-center sm:col-span-2 md:col-span-2 lg:col-span-2 bg-slate-100">
<div class="mx-auto text-center">
<img src="https://xn--931a.moe/assets/info.jpg" class="rounded mx-auto mb-4" />
<p class="max-w-xs">{{ $t('_servers._list.notFound') }}</p>
</div>
</div>
<button v-if="f_limit < filteredInstances.length" @click="f_limit += 20" class="btn btn-outline-primary btn-lg hover:!text-white block sm:col-span-2 md:col-span-2 lg:col-span-2 px-4"> <button v-if="f_limit < filteredInstances.length" @click="f_limit += 20" class="btn btn-outline-primary btn-lg hover:!text-white block sm:col-span-2 md:col-span-2 lg:col-span-2 px-4">
<ArrowIco class="mr-1" />{{ $t('_servers._list.showMore') }} <ArrowIco class="mr-1" />{{ $t('_servers._list.showMore') }}
</button> </button>