summaryrefslogtreecommitdiff
path: root/src/client/components/launch-pad.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/client/components/launch-pad.vue')
-rw-r--r--src/client/components/launch-pad.vue152
1 files changed, 0 insertions, 152 deletions
diff --git a/src/client/components/launch-pad.vue b/src/client/components/launch-pad.vue
deleted file mode 100644
index 9da62f1e0b..0000000000
--- a/src/client/components/launch-pad.vue
+++ /dev/null
@@ -1,152 +0,0 @@
-<template>
-<MkModal ref="modal" @click="$refs.modal.close()" @closed="$emit('closed')">
- <div class="szkkfdyq _popup">
- <div class="main">
- <template v-for="item in items">
- <button v-if="item.action" class="_button" @click="$event => { item.action($event); close(); }" v-click-anime>
- <i class="icon" :class="item.icon"></i>
- <div class="text">{{ item.text }}</div>
- <span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
- </button>
- <MkA v-else :to="item.to" @click.passive="close()" v-click-anime>
- <i class="icon" :class="item.icon"></i>
- <div class="text">{{ item.text }}</div>
- <span v-if="item.indicate" class="indicator"><i class="fas fa-circle"></i></span>
- </MkA>
- </template>
- </div>
- <div class="sub">
- <a href="https://misskey-hub.net/help.html" target="_blank" @click.passive="close()" v-click-anime>
- <i class="fas fa-question-circle icon"></i>
- <div class="text">{{ $ts.help }}</div>
- </a>
- <MkA to="/about" @click.passive="close()" v-click-anime>
- <i class="fas fa-info-circle icon"></i>
- <div class="text">{{ $t('aboutX', { x: instanceName }) }}</div>
- </MkA>
- <MkA to="/about-misskey" @click.passive="close()" v-click-anime>
- <img src="/static-assets/favicon.png" class="icon"/>
- <div class="text">{{ $ts.aboutMisskey }}</div>
- </MkA>
- </div>
- </div>
-</MkModal>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-import MkModal from '@client/components/ui/modal.vue';
-import { menuDef } from '@client/menu';
-import { instanceName } from '@client/config';
-
-export default defineComponent({
- components: {
- MkModal,
- },
-
- emits: ['closed'],
-
- data() {
- return {
- menuDef: menuDef,
- items: [],
- instanceName,
- };
- },
-
- computed: {
- menu(): string[] {
- return this.$store.state.menu;
- },
- },
-
- created() {
- this.items = Object.keys(this.menuDef).filter(k => !this.menu.includes(k)).map(k => this.menuDef[k]).filter(def => def.show == null ? true : def.show).map(def => ({
- type: def.to ? 'link' : 'button',
- text: this.$ts[def.title],
- icon: def.icon,
- to: def.to,
- action: def.action,
- indicate: def.indicated,
- }));
- },
-
- methods: {
- close() {
- this.$refs.modal.close();
- }
- }
-});
-</script>
-
-<style lang="scss" scoped>
-.szkkfdyq {
- width: 100%;
- max-height: 100%;
- max-width: 800px;
- padding: 32px;
- box-sizing: border-box;
- overflow: auto;
- text-align: center;
- border-radius: 16px;
-
- @media (max-width: 500px) {
- padding: 16px;
- }
-
- > .main, > .sub {
- > * {
- position: relative;
- display: inline-flex;
- flex-direction: column;
- align-items: center;
- justify-content: center;
- vertical-align: bottom;
- width: 128px;
- height: 128px;
- border-radius: var(--radius);
-
- @media (max-width: 500px) {
- width: 100px;
- height: 100px;
- }
-
- &:hover {
- background: rgba(0, 0, 0, 0.05);
- text-decoration: none;
- }
-
- > .icon {
- font-size: 26px;
- height: 32px;
- }
-
- > .text {
- margin-top: 8px;
- font-size: 0.9em;
- line-height: 1.5em;
- }
-
- > .indicator {
- position: absolute;
- top: 32px;
- left: 32px;
- color: var(--indicator);
- font-size: 8px;
- animation: blink 1s infinite;
-
- @media (max-width: 500px) {
- top: 16px;
- left: 16px;
- }
- }
- }
- }
-
- > .sub {
- margin-top: 8px;
- padding-top: 8px;
- border-top: solid 0.5px var(--divider);
- }
-}
-</style>