oscar-surf/misskey
oscar-surf/misskey
0
0
Fork 0
Code Issues 1 Pull Requests Packages Releases 2 Activity

enhance(visitor): sakura effect on visitor page

Browse Source
This commit is contained in:
オスカー、 2024-11-26 21:55:37 +09:00
parent bf3914d59b
commit 9f176d2d4b
Signed by: SWREI
GPG Key ID: 139D6573F92DA9F7
1 changed files with 3 additions and 85 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

88
packages/frontend/src/ui/visitor.vue
View File

@ -15,21 +15,6 @@ SPDX-License-Identifier: AGPL-3.0-only
</div> </div>
<div class="main"> <div class="main">
<!--
<div v-if="!isRoot" class="header">
<div v-if="narrow === false" class="wide">
<MkA to="/" class="link" activeClass="active"><i class="ti ti-home icon"></i> {{ i18n.ts.home }}</MkA>
<MkA v-if="isTimelineAvailable" to="/timeline" class="link" activeClass="active"><i class="ti ti-message icon"></i> {{ i18n.ts.timeline }}</MkA>
<MkA to="/explore" class="link" activeClass="active"><i class="ti ti-hash icon"></i> {{ i18n.ts.explore }}</MkA>
<MkA to="/channels" class="link" activeClass="active"><i class="ti ti-device-tv icon"></i> {{ i18n.ts.channel }}</MkA>
</div>
<div v-else-if="narrow === true" class="narrow">
<button class="menu _button" @click="showMenu = true">
<i class="ti ti-menu-2 icon"></i>
</button>
</div>
</div>
-->
<div class="contents"> <div class="contents">
<main v-if="!isRoot" style="container-type: inline-size;"> <main v-if="!isRoot" style="container-type: inline-size;">
<RouterView/> <RouterView/>
@ -39,35 +24,6 @@ SPDX-License-Identifier: AGPL-3.0-only
</main> </main>
</div> </div>
</div> </div>
<!--
<Transition :name="'tray-back'">
<div
v-if="showMenu"
class="menu-back _modalBg"
@click="showMenu = false"
@touchstart.passive="showMenu = false"
></div>
</Transition>
<Transition :name="'tray'">
<div v-if="showMenu" class="menu">
<MkA to="/" class="link" activeClass="active"><i class="ti ti-home icon"></i>{{ i18n.ts.home }}</MkA>
<MkA v-if="isTimelineAvailable" to="/timeline" class="link" activeClass="active"><i class="ti ti-message icon"></i>{{ i18n.ts.timeline }}</MkA>
<MkA to="/explore" class="link" activeClass="active"><i class="ti ti-hash icon"></i>{{ i18n.ts.explore }}</MkA>
<MkA to="/announcements" class="link" activeClass="active"><i class="ti ti-speakerphone icon"></i>{{ i18n.ts.announcements }}</MkA>
<MkA to="/channels" class="link" activeClass="active"><i class="ti ti-device-tv icon"></i>{{ i18n.ts.channel }}</MkA>
<div class="divider"></div>
<MkA to="/pages" class="link" activeClass="active"><i class="ti ti-news icon"></i>{{ i18n.ts.pages }}</MkA>
<MkA to="/play" class="link" activeClass="active"><i class="ti ti-player-play icon"></i>Play</MkA>
<MkA to="/gallery" class="link" activeClass="active"><i class="ti ti-icons icon"></i>{{ i18n.ts.gallery }}</MkA>
<div class="action">
<button class="_buttonPrimary" @click="signup()">{{ i18n.ts.signup }}</button>
<button class="_button" @click="signin()">{{ i18n.ts.login }}</button>
</div>
</div>
</Transition>
-->
</div> </div>
<XCommon/> <XCommon/>
</template> </template>
@ -77,16 +33,10 @@ import { onMounted, provide, ref, computed } from 'vue';
import XCommon from './_common_/common.vue'; import XCommon from './_common_/common.vue';
import { instanceName } from '@/config.js'; import { instanceName } from '@/config.js';
import { instance } from '@/instance.js'; import { instance } from '@/instance.js';
/*
import * as os from '@/os.js';
import XSigninDialog from '@/components/MkSigninDialog.vue';
import XSignupDialog from '@/components/MkSignupDialog.vue';
import { ColdDeviceStorage, defaultStore } from '@/store.js';
*/
import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js'; import { PageMetadata, provideMetadataReceiver, provideReactiveMetadata } from '@/scripts/page-metadata.js';
// import { i18n } from '@/i18n.js';
import MkVisitorDashboard from '@/components/MkVisitorDashboard.vue'; import MkVisitorDashboard from '@/components/MkVisitorDashboard.vue';
import { mainRouter } from '@/router/main.js'; import { mainRouter } from '@/router/main.js';
import { SnowfallEffect } from "@/scripts/snowfall-effect.js";
const isRoot = computed(() => mainRouter.currentRoute.value.name === 'index'); const isRoot = computed(() => mainRouter.currentRoute.value.name === 'index');
@ -112,40 +62,6 @@ const showMenu = ref(false);
const isDesktop = ref(window.innerWidth >= DESKTOP_THRESHOLD); const isDesktop = ref(window.innerWidth >= DESKTOP_THRESHOLD);
const narrow = ref(window.innerWidth < 1280); const narrow = ref(window.innerWidth < 1280);
/*
const announcements = {
endpoint: 'announcements',
offsetMode: true,
limit: 10,
};
const isTimelineAvailable = ref(instance.policies?.ltlAvailable || instance.policies?.gtlAvailable);
const keymap = computed(() => {
return {
'd': () => {
if (ColdDeviceStorage.get('syncDeviceDarkMode')) return;
defaultStore.set('darkMode', !defaultStore.state.darkMode);
},
's': () => {
mainRouter.push('/search');
},
};
});
function signin() {
os.popup(XSigninDialog, {
autoSet: true,
}, {}, 'closed');
}
function signup() {
os.popup(XSignupDialog, {
autoSet: true,
}, {}, 'closed');
}
*/
onMounted(() => { onMounted(() => {
if (!isDesktop.value) { if (!isDesktop.value) {
window.addEventListener('resize', () => { window.addEventListener('resize', () => {
@ -154,6 +70,8 @@ onMounted(() => {
} }
}); });
new SnowfallEffect({ sakura: true }).render();
defineExpose({ defineExpose({
showMenu: showMenu, showMenu: showMenu,
}); });