✌️

locales/ja.yml

@@ -3,7 +3,9 @@ meta:
   divider: ""
 
 common:
-  misskey: "Misskeyで皆と共有しよう。"
+  misskey: "A planet of fediverse"
+  about-title: "A ⭐ of fediverse."
+  about: "Misskeyを見つけていただき、ありがとうございます。Misskeyは、地球で生まれた<b>分散マイクロブログSNS</b>です。Fediverse(様々なSNSで構成される宇宙)の中に存在するため、他のSNSと相互に繋がっています。暫し都会の喧騒から離れて、新しいインターネットにダイブしてみませんか。"
 
   time:
     unknown: "なぞのじかん"
@@ -631,6 +633,8 @@ desktop/views/components/window.vue:
   close: "閉じる"
 
 desktop/views/pages/welcome.vue:
+  about: "詳しく..."
+  gotit: "わかった"
   signin: "ログイン"
   signup: "新規登録"
   signin-button: "やってる"

src/client/app/base.pug

@@ -19,7 +19,7 @@ html
 				| Misskey
 
 		block desc
-			meta(name='description' content='A SNS')
+			meta(name='description' content='A planet of fediverse')
 
 		block meta
 

src/client/app/common/views/components/forkit.vue

@@ -13,7 +13,7 @@
 
 .a
 	display block
-	position absolute
+	position fixed
 	top 0
 	right 0
 

src/client/app/desktop/views/pages/welcome.vue

@@ -4,9 +4,20 @@
 		<template v-if="$store.state.device.darkmode">%fa:moon%</template>
 		<template v-else>%fa:R moon%</template>
 	</button>
-	<main>
+	<main v-if="about" class="about">
+		<article>
+			<h1>%i18n:common.about-title%</h1>
+			<p v-html="'%i18n:common.about%'"></p>
+			<span class="gotit" @click="about = false">%i18n:@gotit%</span>
+		</article>
+	</main>
+	<main v-else class="index">
 		<img :src="$store.state.device.darkmode ? 'assets/title-dark.svg' : 'assets/title.svg'" alt="Misskey">
-		<p><button class="signup" @click="signup">%i18n:@signup-button%</button><button class="signin" @click="signin">%i18n:@signin-button%</button></p>
+		<p class="desc"><b>%i18n:common.misskey%</b> - <span @click="about = true">%i18n:@about%</span></p>
+		<p class="account">
+			<button class="signup" @click="signup">%i18n:@signup-button%</button>
+			<button class="signin" @click="signin">%i18n:@signin-button%</button>
+		</p>
 
 		<div class="tl">
 			<header>%fa:comments R% %i18n:@timeline%<div><span></span><span></span><span></span></div></header>
@@ -33,12 +44,12 @@
 
 <script lang="ts">
 import Vue from 'vue';
-import { docsUrl, copyright, lang } from '../../../config';
+import { copyright } from '../../../config';
 
 export default Vue.extend({
 	data() {
 		return {
-			aboutUrl: `${docsUrl}/${lang}/about`,
+			about: false,
 			copyright
 		};
 	},
@@ -73,9 +84,12 @@ root(isDark)
 	display flex
 	flex-direction column
 	flex 1
+	background-image isDark ? url('/assets/welcome-bg.dark.svg') : url('/assets/welcome-bg.light.svg')
+	background-size cover
+	background-position center
 
 	> button
-		position absolute
+		position fixed
 		z-index 1
 		top 0
 		left 0
@@ -87,12 +101,50 @@ root(isDark)
 		flex 1
 		padding 64px 0 0 0
 		text-align center
+
+		&.about
+			color isDark ? #fff : #627574
+
+			> article
+				max-width 700px
+				margin 42px auto 0 auto
+				padding 64px
+				background isDark ? #282C37 : #fff
+				box-shadow 0 8px 32px rgba(#000, 0.15)
+
+				> h1
+					margin 0
+					font-variant small-caps
+
+				> p
+					margin 20px 0
+					line-height 2em
+
+				> .gotit
+					color $theme-color
+					cursor pointer
+
+					&:hover
+						text-decoration underline
+
+		&.index
 			color isDark ? #9aa4b3 : #555
 
 			> img
 				width 350px
 
-		> p
+			> .desc
+				margin -12px 0 24px 0
+				color isDark ? #fff : #555
+
+				> span
+					color $theme-color
+					cursor pointer
+
+					&:hover
+						text-decoration underline
+
+			> .account
 				margin 8px 0
 				line-height 2em
 

src/client/app/init.ts

@@ -67,14 +67,6 @@ const html = document.documentElement;
 html.setAttribute('lang', lang);
 //#endregion
 
-//#region Set description meta tag
-const head = document.getElementsByTagName('head')[0];
-const meta = document.createElement('meta');
-meta.setAttribute('name', 'description');
-meta.setAttribute('content', '%i18n:common.misskey%');
-head.appendChild(meta);
-//#endregion
-
 // iOSでプライベートモードだとlocalStorageが使えないので既存のメソッドを上書きする
 try {
 	localStorage.setItem('kyoppie', 'yuppie');