summaryrefslogtreecommitdiff
path: root/packages/frontend
diff options
context:
space:
mode:
Diffstat (limited to 'packages/frontend')
-rw-r--r--packages/frontend/src/pages/welcome.entrance.b.vue239
-rw-r--r--packages/frontend/src/pages/welcome.entrance.c.vue308
2 files changed, 0 insertions, 547 deletions
diff --git a/packages/frontend/src/pages/welcome.entrance.b.vue b/packages/frontend/src/pages/welcome.entrance.b.vue
deleted file mode 100644
index 03bf174710..0000000000
--- a/packages/frontend/src/pages/welcome.entrance.b.vue
+++ /dev/null
@@ -1,239 +0,0 @@
-<template>
-<div v-if="meta" class="rsqzvsbo">
- <div class="top">
- <MkFeaturedPhotos class="bg"/>
- <XTimeline class="tl"/>
- <div class="shape"></div>
- <div class="main">
- <h1>
- <img v-if="meta.logoImageUrl" class="logo" :src="meta.logoImageUrl"><span v-else class="text">{{ instanceName }}</span>
- </h1>
- <div class="about">
- <!-- eslint-disable-next-line vue/no-v-html -->
- <div class="desc" v-html="meta.description || i18n.ts.headlineMisskey"></div>
- </div>
- <div class="action">
- <MkButton class="signup" inline gradate @click="signup()">{{ i18n.ts.signup }}</MkButton>
- <MkButton class="signin" inline @click="signin()">{{ i18n.ts.login }}</MkButton>
- </div>
- <div v-if="onlineUsersCount && stats" class="status">
- <div>
- <I18n :src="i18n.ts.nUsers" text-tag="span" class="users">
- <template #n><b>{{ number(stats.originalUsersCount) }}</b></template>
- </I18n>
- <I18n :src="i18n.ts.nNotes" text-tag="span" class="notes">
- <template #n><b>{{ number(stats.originalNotesCount) }}</b></template>
- </I18n>
- </div>
- <I18n :src="i18n.ts.onlineUsersCount" text-tag="span" class="online">
- <template #n><b>{{ onlineUsersCount }}</b></template>
- </I18n>
- </div>
- </div>
- <img src="/client-assets/misskey.svg" class="misskey"/>
- </div>
-</div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-import { toUnicode } from 'punycode/';
-import XTimeline from './welcome.timeline.vue';
-import XSigninDialog from '@/components/MkSigninDialog.vue';
-import XSignupDialog from '@/components/MkSignupDialog.vue';
-import MkButton from '@/components/MkButton.vue';
-import MkNote from '@/components/MkNote.vue';
-import MkFeaturedPhotos from '@/components/MkFeaturedPhotos.vue';
-import { host, instanceName } from '@/config';
-import * as os from '@/os';
-import number from '@/filters/number';
-import { i18n } from '@/i18n';
-
-export default defineComponent({
- components: {
- MkButton,
- MkNote,
- XTimeline,
- MkFeaturedPhotos,
- },
-
- data() {
- return {
- host: toUnicode(host),
- instanceName,
- meta: null,
- stats: null,
- tags: [],
- onlineUsersCount: null,
- i18n,
- };
- },
-
- created() {
- os.api('meta', { detail: true }).then(meta => {
- this.meta = meta;
- });
-
- os.api('stats').then(stats => {
- this.stats = stats;
- });
-
- os.api('get-online-users-count').then(res => {
- this.onlineUsersCount = res.count;
- });
-
- os.api('hashtags/list', {
- sort: '+mentionedLocalUsers',
- limit: 8,
- }).then(tags => {
- this.tags = tags;
- });
- },
-
- methods: {
- signin() {
- os.popup(XSigninDialog, {
- autoSet: true,
- }, {}, 'closed');
- },
-
- signup() {
- os.popup(XSignupDialog, {
- autoSet: true,
- }, {}, 'closed');
- },
-
- showMenu(ev) {
- os.popupMenu([{
- text: i18n.t('aboutX', { x: instanceName }),
- icon: 'ti ti-info-circle',
- action: () => {
- os.pageWindow('/about');
- },
- }, {
- text: i18n.ts.aboutMisskey,
- icon: 'ti ti-info-circle',
- action: () => {
- os.pageWindow('/about-misskey');
- },
- }, null, {
- text: i18n.ts.help,
- icon: 'ti ti-question-circle',
- action: () => {
- window.open('https://misskey-hub.net/help.md', '_blank');
- },
- }], ev.currentTarget ?? ev.target);
- },
-
- number,
- },
-});
-</script>
-
-<style lang="scss" scoped>
-.rsqzvsbo {
- > .top {
- min-height: 100vh;
- box-sizing: border-box;
-
- > .bg {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- }
-
- > .tl {
- position: absolute;
- top: 0;
- bottom: 0;
- right: 64px;
- margin: auto;
- width: 500px;
- height: calc(100% - 128px);
- overflow: hidden;
- -webkit-mask-image: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 128px, rgba(0,0,0,1) calc(100% - 128px), rgba(0,0,0,0) 100%);
- mask-image: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 128px, rgba(0,0,0,1) calc(100% - 128px), rgba(0,0,0,0) 100%);
- }
-
- > .shape {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background: var(--accent);
- clip-path: polygon(0% 0%, 40% 0%, 22% 100%, 0% 100%);
- }
-
- > .misskey {
- position: absolute;
- bottom: 64px;
- left: 64px;
- width: 160px;
- }
-
- > .main {
- position: relative;
- width: min(450px, 100%);
- padding: 64px;
- color: #fff;
- font-size: 1.1em;
-
- @media (max-width: 1200px) {
- margin: auto;
- }
-
- > h1 {
- display: block;
- margin: 0 0 32px 0;
- padding: 0;
-
- > .logo {
- vertical-align: bottom;
- max-height: 100px;
- }
- }
-
- > .about {
- padding: 0;
- }
-
- > .action {
- margin: 32px 0;
-
- > * {
- line-height: 32px;
- }
-
- > .signup {
- background: var(--panel);
- color: var(--fg);
- }
-
- > .signin {
- background: var(--accent);
- color: inherit;
- }
- }
-
- > .status {
- margin: 32px 0;
- border-top: solid 1px rgba(255, 255, 255, 0.5);
- font-size: 90%;
-
- > div {
- padding: 16px 0;
-
- > span:not(:last-child) {
- padding-right: 1em;
- margin-right: 1em;
- border-right: solid 1px rgba(255, 255, 255, 0.5);
- }
- }
- }
- }
- }
-}
-</style>
diff --git a/packages/frontend/src/pages/welcome.entrance.c.vue b/packages/frontend/src/pages/welcome.entrance.c.vue
deleted file mode 100644
index eca4e5764d..0000000000
--- a/packages/frontend/src/pages/welcome.entrance.c.vue
+++ /dev/null
@@ -1,308 +0,0 @@
-<template>
-<div v-if="meta" class="rsqzvsbo">
- <div class="top">
- <MkFeaturedPhotos class="bg"/>
- <div class="fade"></div>
- <div class="emojis">
- <MkEmoji :normal="true" :no-style="true" emoji="👍"/>
- <MkEmoji :normal="true" :no-style="true" emoji="❤"/>
- <MkEmoji :normal="true" :no-style="true" emoji="😆"/>
- <MkEmoji :normal="true" :no-style="true" emoji="🎉"/>
- <MkEmoji :normal="true" :no-style="true" emoji="🍮"/>
- </div>
- <div class="main">
- <img src="/client-assets/misskey.svg" class="misskey"/>
- <div class="form _panel">
- <div class="bg">
- <div class="fade"></div>
- </div>
- <div class="fg">
- <h1>
- <img v-if="meta.logoImageUrl" class="logo" :src="meta.logoImageUrl"><span v-else class="text">{{ instanceName }}</span>
- </h1>
- <div class="about">
- <!-- eslint-disable-next-line vue/no-v-html -->
- <div class="desc" v-html="meta.description || i18n.ts.headlineMisskey"></div>
- </div>
- <div class="action">
- <MkButton inline gradate @click="signup()">{{ i18n.ts.signup }}</MkButton>
- <MkButton inline @click="signin()">{{ i18n.ts.login }}</MkButton>
- </div>
- <div v-if="onlineUsersCount && stats" class="status">
- <div>
- <I18n :src="i18n.ts.nUsers" text-tag="span" class="users">
- <template #n><b>{{ number(stats.originalUsersCount) }}</b></template>
- </I18n>
- <I18n :src="i18n.ts.nNotes" text-tag="span" class="notes">
- <template #n><b>{{ number(stats.originalNotesCount) }}</b></template>
- </I18n>
- </div>
- <I18n :src="i18n.ts.onlineUsersCount" text-tag="span" class="online">
- <template #n><b>{{ onlineUsersCount }}</b></template>
- </I18n>
- </div>
- <button class="_button _acrylic menu" @click="showMenu"><i class="ti ti-dots"></i></button>
- </div>
- </div>
- <nav class="nav">
- <MkA to="/announcements">{{ i18n.ts.announcements }}</MkA>
- <MkA to="/explore">{{ i18n.ts.explore }}</MkA>
- <MkA to="/channels">{{ i18n.ts.channel }}</MkA>
- <MkA to="/featured">{{ i18n.ts.featured }}</MkA>
- </nav>
- </div>
- </div>
-</div>
-</template>
-
-<script lang="ts">
-import { defineComponent } from 'vue';
-import { toUnicode } from 'punycode/';
-import XTimeline from './welcome.timeline.vue';
-import XSigninDialog from '@/components/MkSigninDialog.vue';
-import XSignupDialog from '@/components/MkSignupDialog.vue';
-import MkButton from '@/components/MkButton.vue';
-import MkNote from '@/components/MkNote.vue';
-import MkFeaturedPhotos from '@/components/MkFeaturedPhotos.vue';
-import { host, instanceName } from '@/config';
-import * as os from '@/os';
-import number from '@/filters/number';
-import { i18n } from '@/i18n';
-
-export default defineComponent({
- components: {
- MkButton,
- MkNote,
- MkFeaturedPhotos,
- XTimeline,
- },
-
- data() {
- return {
- host: toUnicode(host),
- instanceName,
- meta: null,
- stats: null,
- tags: [],
- onlineUsersCount: null,
- i18n,
- };
- },
-
- created() {
- os.api('meta', { detail: true }).then(meta => {
- this.meta = meta;
- });
-
- os.api('stats').then(stats => {
- this.stats = stats;
- });
-
- os.api('get-online-users-count').then(res => {
- this.onlineUsersCount = res.count;
- });
-
- os.api('hashtags/list', {
- sort: '+mentionedLocalUsers',
- limit: 8,
- }).then(tags => {
- this.tags = tags;
- });
- },
-
- methods: {
- signin() {
- os.popup(XSigninDialog, {
- autoSet: true,
- }, {}, 'closed');
- },
-
- signup() {
- os.popup(XSignupDialog, {
- autoSet: true,
- }, {}, 'closed');
- },
-
- showMenu(ev) {
- os.popupMenu([{
- text: i18n.t('aboutX', { x: instanceName }),
- icon: 'ti ti-info-circle',
- action: () => {
- os.pageWindow('/about');
- },
- }, {
- text: i18n.ts.aboutMisskey,
- icon: 'ti ti-info-circle',
- action: () => {
- os.pageWindow('/about-misskey');
- },
- }, null, {
- text: i18n.ts.help,
- icon: 'ti ti-question-circle',
- action: () => {
- window.open('https://misskey-hub.net/help.md', '_blank');
- },
- }], ev.currentTarget ?? ev.target);
- },
-
- number,
- },
-});
-</script>
-
-<style lang="scss" scoped>
-.rsqzvsbo {
- > .top {
- display: flex;
- text-align: center;
- min-height: 100vh;
- box-sizing: border-box;
- padding: 16px;
-
- > .bg {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- }
-
- > .fade {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 100%;
- background: rgba(0, 0, 0, 0.25);
- }
-
- > .emojis {
- position: absolute;
- bottom: 32px;
- left: 35px;
-
- > * {
- margin-right: 8px;
- }
-
- @media (max-width: 1200px) {
- display: none;
- }
- }
-
- > .main {
- position: relative;
- width: min(460px, 100%);
- margin: auto;
-
- > .misskey {
- width: 150px;
- margin-bottom: 16px;
-
- @media (max-width: 450px) {
- width: 130px;
- }
- }
-
- > .form {
- position: relative;
- box-shadow: 0 12px 32px rgb(0 0 0 / 25%);
-
- > .bg {
- position: absolute;
- top: 0;
- left: 0;
- width: 100%;
- height: 128px;
- background-position: center;
- background-size: cover;
- opacity: 0.75;
-
- > .fade {
- position: absolute;
- bottom: 0;
- left: 0;
- width: 100%;
- height: 128px;
- background: linear-gradient(0deg, var(--panel), var(--X15));
- }
- }
-
- > .fg {
- position: relative;
- z-index: 1;
-
- > h1 {
- display: block;
- margin: 0;
- padding: 32px 32px 24px 32px;
-
- > .logo {
- vertical-align: bottom;
- max-height: 120px;
- }
- }
-
- > .about {
- padding: 0 32px;
- }
-
- > .action {
- padding: 32px;
-
- > * {
- line-height: 28px;
- }
- }
-
- > .status {
- border-top: solid 0.5px var(--divider);
- padding: 32px;
- font-size: 90%;
-
- > div {
- > span:not(:last-child) {
- padding-right: 1em;
- margin-right: 1em;
- border-right: solid 0.5px var(--divider);
- }
- }
-
- > .online {
- ::v-deep(b) {
- color: #41b781;
- }
-
- ::v-deep(span) {
- opacity: 0.7;
- }
- }
- }
-
- > .menu {
- position: absolute;
- top: 16px;
- right: 16px;
- width: 32px;
- height: 32px;
- border-radius: 8px;
- }
- }
- }
-
- > .nav {
- position: relative;
- z-index: 2;
- margin-top: 20px;
- color: #fff;
- text-shadow: 0 0 8px black;
- font-size: 0.9em;
-
- > *:not(:last-child) {
- margin-right: 1.5em;
- }
- }
- }
- }
-}
-</style>