From 2154354a4f4442c03c48936872eadba76335ab8d Mon Sep 17 00:00:00 2001
From: tamaina <tamaina@hotmail.co.jp>
Date: Tue, 2 Mar 2021 22:57:16 +0900
Subject: Revert "perf: use overflow: clip instead of hidden" (#7273)

This reverts commit 06e817af597e7ee621bdeb370c72d7555482d943.
---
 src/client/pages/about-misskey.vue                 |  2 +-
 src/client/pages/follow-requests.vue               |  6 ++----
 src/client/pages/instance/emojis.vue               | 18 ++++++----------
 src/client/pages/messaging/index.vue               |  9 +++-----
 .../pages/messaging/messaging-room.message.vue     |  9 +++-----
 .../pages/page-editor/page-editor.container.vue    |  3 +--
 src/client/pages/reversi/game.board.vue            |  3 +--
 src/client/pages/reversi/game.setting.vue          |  3 +--
 src/client/pages/settings/drive.vue                |  3 +--
 src/client/pages/settings/security.vue             |  3 +--
 src/client/pages/settings/theme.vue                |  3 +--
 src/client/pages/user/index.vue                    | 24 ++++++++--------------
 src/client/pages/welcome.entrance.a.vue            |  3 +--
 src/client/pages/welcome.entrance.b.vue            |  3 +--
 src/client/pages/welcome.setup.vue                 |  3 +--
 15 files changed, 32 insertions(+), 63 deletions(-)

(limited to 'src/client/pages')

diff --git a/src/client/pages/about-misskey.vue b/src/client/pages/about-misskey.vue
index fa47a80492..7022a924b0 100644
--- a/src/client/pages/about-misskey.vue
+++ b/src/client/pages/about-misskey.vue
@@ -1,5 +1,5 @@
 <template>
-<div style="overflow: hidden; overflow: clip;">
+<div style="overflow: hidden;">
 	<FormBase class="znqjceqz">
 		<div id="debug"></div>
 		<section class="_formItem about">
diff --git a/src/client/pages/follow-requests.vue b/src/client/pages/follow-requests.vue
index 18f39642e4..04d739088f 100644
--- a/src/client/pages/follow-requests.vue
+++ b/src/client/pages/follow-requests.vue
@@ -104,8 +104,7 @@ export default defineComponent({
 					display: block;
 					white-space: nowrap;
 					text-overflow: ellipsis;
-					overflow: hidden; // overflow: clip; をSafariが対応したら消す
-					overflow: clip;
+					overflow: hidden;
 					margin: 0;
 				}
 
@@ -125,8 +124,7 @@ export default defineComponent({
 				width: 55%;
 				line-height: 42px;
 				white-space: nowrap;
-				overflow: hidden; // overflow: clip; をSafariが対応したら消す
-				overflow: clip;
+				overflow: hidden;
 				text-overflow: ellipsis;
 				opacity: 0.7;
 				font-size: 14px;
diff --git a/src/client/pages/instance/emojis.vue b/src/client/pages/instance/emojis.vue
index 71b6c11b2d..6a51813bb2 100644
--- a/src/client/pages/instance/emojis.vue
+++ b/src/client/pages/instance/emojis.vue
@@ -178,20 +178,17 @@ export default defineComponent({
 					> .body {
 						padding: 0 0 0 8px;
 						white-space: nowrap;
-						overflow: hidden; // overflow: clip; をSafariが対応したら消す
-						overflow: clip;
+						overflow: hidden;
 
 						> .name {
 							text-overflow: ellipsis;
-							overflow: hidden; // overflow: clip; をSafariが対応したら消す
-							overflow: clip;
+							overflow: hidden;
 						}
 
 						> .info {
 							opacity: 0.5;
 							text-overflow: ellipsis;
-							overflow: hidden; // overflow: clip; をSafariが対応したら消す
-							overflow: clip;
+							overflow: hidden;
 						}
 					}
 				}
@@ -222,20 +219,17 @@ export default defineComponent({
 					> .body {
 						padding: 0 0 0 8px;
 						white-space: nowrap;
-						overflow: hidden; // overflow: clip; をSafariが対応したら消す
-						overflow: clip;
+						overflow: hidden;
 
 						> .name {
 							text-overflow: ellipsis;
-							overflow: hidden; // overflow: clip; をSafariが対応したら消す
-							overflow: clip;
+							overflow: hidden;
 						}
 
 						> .info {
 							opacity: 0.5;
 							text-overflow: ellipsis;
-							overflow: hidden; // overflow: clip; をSafariが対応したら消す
-							overflow: clip;
+							overflow: hidden;
 						}
 					}
 				}
diff --git a/src/client/pages/messaging/index.vue b/src/client/pages/messaging/index.vue
index 8e7fe5134a..aefc31f3bc 100644
--- a/src/client/pages/messaging/index.vue
+++ b/src/client/pages/messaging/index.vue
@@ -226,14 +226,12 @@ export default defineComponent({
 					align-items: center;
 					margin-bottom: 2px;
 					white-space: nowrap;
-					overflow: hidden; // overflow: clip; をSafariが対応したら消す
-					overflow: clip;
+					overflow: hidden;
 
 					> .name {
 						margin: 0;
 						padding: 0;
-						overflow: hidden; // overflow: clip; をSafariが対応したら消す
-						overflow: clip;
+						overflow: hidden;
 						text-overflow: ellipsis;
 						font-size: 1em;
 						font-weight: bold;
@@ -264,8 +262,7 @@ export default defineComponent({
 						display: block;
 						margin: 0 0 0 0;
 						padding: 0;
-						overflow: hidden; // overflow: clip; をSafariが対応したら消す
-						overflow: clip;
+						overflow: hidden;
 						overflow-wrap: break-word;
 						font-size: 1.1em;
 						color: var(--faceText);
diff --git a/src/client/pages/messaging/messaging-room.message.vue b/src/client/pages/messaging/messaging-room.message.vue
index 3d994c2666..d379c0c3c0 100644
--- a/src/client/pages/messaging/messaging-room.message.vue
+++ b/src/client/pages/messaging/messaging-room.message.vue
@@ -154,8 +154,7 @@ export default defineComponent({
 					display: block;
 					margin: 0;
 					padding: 0;
-					overflow: hidden; // overflow: clip; をSafariが対応したら消す
-					overflow: clip;
+					overflow: hidden;
 					overflow-wrap: break-word;
 					font-size: 1em;
 					color: rgba(#000, 0.5);
@@ -165,8 +164,7 @@ export default defineComponent({
 					display: block;
 					margin: 0;
 					padding: 12px 18px;
-					overflow: hidden; // overflow: clip; をSafariが対応したら消す
-					overflow: clip;
+					overflow: hidden;
 					overflow-wrap: break-word;
 					word-break: break-word;
 					font-size: 1em;
@@ -184,8 +182,7 @@ export default defineComponent({
 						display: block;
 						max-width: 100%;
 						border-radius: 16px;
-						overflow: hidden; // overflow: clip; をSafariが対応したら消す
-						overflow: clip;
+						overflow: hidden;
 						text-decoration: none;
 
 						&:hover {
diff --git a/src/client/pages/page-editor/page-editor.container.vue b/src/client/pages/page-editor/page-editor.container.vue
index 5e89b8c2bf..46e2dca157 100644
--- a/src/client/pages/page-editor/page-editor.container.vue
+++ b/src/client/pages/page-editor/page-editor.container.vue
@@ -74,8 +74,7 @@ export default defineComponent({
 <style lang="scss" scoped>
 .cpjygsrt {
 	position: relative;
-	overflow: hidden; // overflow: clip; をSafariが対応したら消す
-	overflow: clip;
+	overflow: hidden;
 	background: var(--panel);
 	border: solid 2px var(--X12);
 	border-radius: 6px;
diff --git a/src/client/pages/reversi/game.board.vue b/src/client/pages/reversi/game.board.vue
index a3c7900d20..8ce232af07 100644
--- a/src/client/pages/reversi/game.board.vue
+++ b/src/client/pages/reversi/game.board.vue
@@ -434,8 +434,7 @@ export default defineComponent({
 				> div {
 					background: transparent;
 					border-radius: 6px;
-					overflow: hidden; // overflow: clip; をSafariが対応したら消す
-					overflow: clip;
+					overflow: hidden;
 
 					* {
 						pointer-events: none;
diff --git a/src/client/pages/reversi/game.setting.vue b/src/client/pages/reversi/game.setting.vue
index 3ed4d2c67b..404e560a06 100644
--- a/src/client/pages/reversi/game.setting.vue
+++ b/src/client/pages/reversi/game.setting.vue
@@ -333,8 +333,7 @@ export default defineComponent({
 							background: transparent;
 							border: solid 2px var(--divider);
 							border-radius: 6px;
-							overflow: hidden; // overflow: clip; をSafariが対応したら消す
-							overflow: clip;
+							overflow: hidden;
 							cursor: pointer;
 
 							* {
diff --git a/src/client/pages/settings/drive.vue b/src/client/pages/settings/drive.vue
index 869af77f37..8ca8bc9eec 100644
--- a/src/client/pages/settings/drive.vue
+++ b/src/client/pages/settings/drive.vue
@@ -230,8 +230,7 @@ export default defineComponent({
 			$size: 12px;
 			background: rgba(0, 0, 0, 0.1);
 			border-radius: ($size / 2);
-			overflow: hidden; // overflow: clip; をSafariが対応したら消す
-			overflow: clip;
+			overflow: hidden;
 
 			> div {
 				height: $size;
diff --git a/src/client/pages/settings/security.vue b/src/client/pages/settings/security.vue
index 913e0e64bf..cdb5705c0b 100644
--- a/src/client/pages/settings/security.vue
+++ b/src/client/pages/settings/security.vue
@@ -144,8 +144,7 @@ export default defineComponent({
 			flex: 1;
 			min-width: 0;
 			white-space: nowrap;
-			overflow: hidden; // overflow: clip; をSafariが対応したら消す
-			overflow: clip;
+			overflow: hidden;
 			text-overflow: ellipsis;
 			margin-right: 12px;
 		}
diff --git a/src/client/pages/settings/theme.vue b/src/client/pages/settings/theme.vue
index e230a2276b..ac57c51df4 100644
--- a/src/client/pages/settings/theme.vue
+++ b/src/client/pages/settings/theme.vue
@@ -184,8 +184,7 @@ export default defineComponent({
 			position: absolute;
 			top: 50%;
 			left: 50%;
-			overflow: hidden; // overflow: clip; をSafariが対応したら消す
-			overflow: clip;
+			overflow: hidden;
 			padding: 0 100px;
 			transform: translate3d(-50%, -50%, 0);
 
diff --git a/src/client/pages/user/index.vue b/src/client/pages/user/index.vue
index 959170f526..5229db9ee3 100644
--- a/src/client/pages/user/index.vue
+++ b/src/client/pages/user/index.vue
@@ -369,8 +369,7 @@ export default defineComponent({
 		position: relative;
 		height: 450px;
 		border-radius: 16px;
-		overflow: hidden; // overflow: clip; をSafariが対応したら消す
-		overflow: clip;
+		overflow: hidden;
 		background-size: cover;
 		background-position: center;
 
@@ -473,8 +472,7 @@ export default defineComponent({
 
 					> .name {
 						width: 30%;
-						overflow: hidden; // overflow: clip; をSafariが対応したら消す
-						overflow: clip;
+						overflow: hidden;
 						white-space: nowrap;
 						text-overflow: ellipsis;
 						font-weight: bold;
@@ -482,8 +480,7 @@ export default defineComponent({
 
 					> .value {
 						width: 70%;
-						overflow: hidden; // overflow: clip; をSafariが対応したら消す
-						overflow: clip;
+						overflow: hidden;
 						white-space: nowrap;
 						text-overflow: ellipsis;
 						margin: 0;
@@ -545,8 +542,7 @@ export default defineComponent({
 .ftskorzw.narrow {
 	max-width: 100vw;
 	box-sizing: border-box;
-	overflow: hidden; // overflow: clip; をSafariが対応したら消す
-	overflow: clip;
+	overflow: hidden;
 
 	> .punished {
 		font-size: 0.8em;
@@ -557,14 +553,12 @@ export default defineComponent({
 
 		> .main {
 			position: relative;
-			overflow: hidden; // overflow: clip; をSafariが対応したら消す
-			overflow: clip;
+			overflow: hidden;
 
 			> .banner-container {
 				position: relative;
 				height: 250px;
-				overflow: hidden; // overflow: clip; をSafariが対応したら消す
-				overflow: clip;
+				overflow: hidden;
 				background-size: cover;
 				background-position: center;
 
@@ -709,8 +703,7 @@ export default defineComponent({
 
 					> .name {
 						width: 30%;
-						overflow: hidden; // overflow: clip; をSafariが対応したら消す
-						overflow: clip;
+						overflow: hidden;
 						white-space: nowrap;
 						text-overflow: ellipsis;
 						font-weight: bold;
@@ -719,8 +712,7 @@ export default defineComponent({
 
 					> .value {
 						width: 70%;
-						overflow: hidden; // overflow: clip; をSafariが対応したら消す
-						overflow: clip;
+						overflow: hidden;
 						white-space: nowrap;
 						text-overflow: ellipsis;
 						margin: 0;
diff --git a/src/client/pages/welcome.entrance.a.vue b/src/client/pages/welcome.entrance.a.vue
index 46a52f4189..4d356774eb 100644
--- a/src/client/pages/welcome.entrance.a.vue
+++ b/src/client/pages/welcome.entrance.a.vue
@@ -167,8 +167,7 @@ export default defineComponent({
 			margin: auto;
 			width: 500px;
 			height: calc(100% - 128px);
-			overflow: hidden; // overflow: clip; をSafariが対応したら消す
-			overflow: clip;
+			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%);
 
diff --git a/src/client/pages/welcome.entrance.b.vue b/src/client/pages/welcome.entrance.b.vue
index 0dc91359d0..8a6f60e726 100644
--- a/src/client/pages/welcome.entrance.b.vue
+++ b/src/client/pages/welcome.entrance.b.vue
@@ -151,8 +151,7 @@ export default defineComponent({
 			margin: auto;
 			width: 500px;
 			height: calc(100% - 128px);
-			overflow: hidden; // overflow: clip; をSafariが対応したら消す
-			overflow: clip;
+			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%);
 		}
diff --git a/src/client/pages/welcome.setup.vue b/src/client/pages/welcome.setup.vue
index 9c1315cc40..bc994099ac 100644
--- a/src/client/pages/welcome.setup.vue
+++ b/src/client/pages/welcome.setup.vue
@@ -71,8 +71,7 @@ export default defineComponent({
 .mk-setup {
 	border-radius: var(--radius);
 	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.1);
-	overflow: hidden; // overflow: clip; をSafariが対応したら消す
-	overflow: clip;
+	overflow: hidden;
 
 	> h1 {
 		margin: 0;
-- 
cgit v1.3.1-freya


From 5e9cc09fcb6cb88cc4d2c3040bf085e9e278d22e Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Wed, 3 Mar 2021 01:03:29 +0900
Subject: Bios (#7286)

* wip

* wip

* wip
---
 gulpfile.ts                         |  4 +-
 src/client/components/form/link.vue |  6 ++-
 src/client/components/global/a.vue  |  5 +++
 src/client/pages/settings/other.vue |  7 ++-
 src/server/web/bios.css             | 40 +++++++++++++++++
 src/server/web/bios.js              | 87 +++++++++++++++++++++++++++++++++++++
 src/server/web/cli.css              | 19 ++++++++
 src/server/web/cli.js               | 55 +++++++++++++++++++++++
 src/server/web/index.ts             | 12 +++++
 src/server/web/views/bios.pug       | 20 +++++++++
 src/server/web/views/cli.pug        | 21 +++++++++
 11 files changed, 271 insertions(+), 5 deletions(-)
 create mode 100644 src/server/web/bios.css
 create mode 100644 src/server/web/bios.js
 create mode 100644 src/server/web/cli.css
 create mode 100644 src/server/web/cli.js
 create mode 100644 src/server/web/views/bios.pug
 create mode 100644 src/server/web/views/cli.pug

(limited to 'src/client/pages')

diff --git a/gulpfile.ts b/gulpfile.ts
index bdc20089cd..b394e4f44c 100644
--- a/gulpfile.ts
+++ b/gulpfile.ts
@@ -45,7 +45,7 @@ gulp.task('build:copy:locales', cb => {
 });
 
 gulp.task('build:client:script', () => {
-	return gulp.src(['./src/server/web/boot.js'])
+	return gulp.src(['./src/server/web/boot.js', './src/server/web/bios.js', './src/server/web/cli.js'])
 		.pipe(replace('VERSION', JSON.stringify(meta.version)))
 		.pipe(replace('LANGS', JSON.stringify(Object.keys(locales))))
 		.pipe(terser({
@@ -55,7 +55,7 @@ gulp.task('build:client:script', () => {
 });
 
 gulp.task('build:client:style', () => {
-	return gulp.src(['./src/server/web/style.css'])
+	return gulp.src(['./src/server/web/style.css', './src/server/web/bios.css', './src/server/web/cli.css'])
 		.pipe(cssnano())
 		.pipe(gulp.dest('./built/server/web/'));
 });
diff --git a/src/client/components/form/link.vue b/src/client/components/form/link.vue
index 7093f50397..2efc6b58c9 100644
--- a/src/client/components/form/link.vue
+++ b/src/client/components/form/link.vue
@@ -8,7 +8,7 @@
 			<Fa :icon="faExternalLinkAlt" class="icon"/>
 		</span>
 	</a>
-	<MkA class="main _button _formPanel _formClickable" :class="{ active }" :to="to" v-else>
+	<MkA class="main _button _formPanel _formClickable" :class="{ active }" :to="to" :behavior="behavior" v-else>
 		<span class="icon"><slot name="icon"></slot></span>
 		<span class="text"><slot></slot></span>
 		<span class="right">
@@ -38,6 +38,10 @@ export default defineComponent({
 			type: Boolean,
 			required: false
 		},
+		behavior: {
+			type: String,
+			required: false,
+		},
 	},
 	data() {
 		return {
diff --git a/src/client/components/global/a.vue b/src/client/components/global/a.vue
index cf894deaba..d293cb571f 100644
--- a/src/client/components/global/a.vue
+++ b/src/client/components/global/a.vue
@@ -98,6 +98,11 @@ export default defineComponent({
 		},
 
 		nav() {
+			if (this.behavior === 'browser') {
+				location.href = this.to;
+				return;
+			}
+
 			if (this.to.startsWith('/my/messaging')) {
 				if (ColdDeviceStorage.get('chatOpenBehavior') === 'window') return this.window();
 				if (ColdDeviceStorage.get('chatOpenBehavior') === 'popout') return this.popout();
diff --git a/src/client/pages/settings/other.vue b/src/client/pages/settings/other.vue
index c0b9625098..a14e101328 100644
--- a/src/client/pages/settings/other.vue
+++ b/src/client/pages/settings/other.vue
@@ -23,13 +23,16 @@
 
 	<FormLink to="/settings/registry"><template #icon><Fa :icon="faCogs"/></template>{{ $ts.registry }}</FormLink>
 
+	<FormLink to="/bios" behavior="browser"><template #icon><Fa :icon="faDoorOpen"/></template>BIOS</FormLink>
+	<FormLink to="/cli" behavior="browser"><template #icon><Fa :icon="faDoorOpen"/></template>CLI</FormLink>
+
 	<FormButton @click="closeAccount" danger>{{ $ts.closeAccount }}</FormButton>
 </FormBase>
 </template>
 
 <script lang="ts">
 import { defineAsyncComponent, defineComponent } from 'vue';
-import { faEllipsisH, faCogs } from '@fortawesome/free-solid-svg-icons';
+import { faEllipsisH, faCogs, faDoorOpen } from '@fortawesome/free-solid-svg-icons';
 import FormSwitch from '@/components/form/switch.vue';
 import FormSelect from '@/components/form/select.vue';
 import FormLink from '@/components/form/link.vue';
@@ -61,7 +64,7 @@ export default defineComponent({
 				icon: faEllipsisH
 			},
 			debug,
-			faCogs
+			faCogs, faDoorOpen,
 		}
 	},
 
diff --git a/src/server/web/bios.css b/src/server/web/bios.css
new file mode 100644
index 0000000000..b0da3ee39b
--- /dev/null
+++ b/src/server/web/bios.css
@@ -0,0 +1,40 @@
+* {
+	font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
+}
+
+html {
+	background: #ffb4e1;
+}
+
+main {
+	background: #dedede;
+}
+main > .tabs {
+	padding: 16px;
+	border-bottom: solid 4px #c3c3c3;
+}
+
+#lsEditor > .adder {
+	margin: 16px;
+	padding: 16px;
+	border: solid 2px #c3c3c3;
+}
+#lsEditor > .adder > textarea {
+	display: block;
+	width: 100%;
+	min-height: 5em;
+	box-sizing: border-box;
+}
+#lsEditor > .record {
+	padding: 16px;
+	border-bottom: solid 1px #c3c3c3;
+}
+#lsEditor > .record > header {
+	font-weight: bold;
+}
+#lsEditor > .record > textarea {
+	display: block;
+	width: 100%;
+	min-height: 5em;
+	box-sizing: border-box;
+}
diff --git a/src/server/web/bios.js b/src/server/web/bios.js
new file mode 100644
index 0000000000..d06dee801a
--- /dev/null
+++ b/src/server/web/bios.js
@@ -0,0 +1,87 @@
+'use strict';
+
+window.onload = async () => {
+	const account = JSON.parse(localStorage.getItem('account'));
+	const i = account.token;
+
+	const api = (endpoint, data = {}) => {
+		const promise = new Promise((resolve, reject) => {
+			// Append a credential
+			if (i) data.i = i;
+	
+			// Send request
+			fetch(endpoint.indexOf('://') > -1 ? endpoint : `/api/${endpoint}`, {
+				method: 'POST',
+				body: JSON.stringify(data),
+				credentials: 'omit',
+				cache: 'no-cache'
+			}).then(async (res) => {
+				const body = res.status === 204 ? null : await res.json();
+	
+				if (res.status === 200) {
+					resolve(body);
+				} else if (res.status === 204) {
+					resolve();
+				} else {
+					reject(body.error);
+				}
+			}).catch(reject);
+		});
+		
+		return promise;
+	};
+
+	const content = document.getElementById('content');
+
+	document.getElementById('ls').addEventListener('click', () => {
+		content.innerHTML = '';
+
+		const lsEditor = document.createElement('div');
+		lsEditor.id = 'lsEditor';
+
+		const adder = document.createElement('div');
+		adder.classList.add('adder');
+		const addKeyInput = document.createElement('input');
+		const addValueTextarea = document.createElement('textarea');
+		const addButton = document.createElement('button');
+		addButton.textContent = 'add';
+		addButton.addEventListener('click', () => {
+			localStorage.setItem(addKeyInput.value, addValueTextarea.value);
+			location.reload();
+		});
+
+		adder.appendChild(addKeyInput);
+		adder.appendChild(addValueTextarea);
+		adder.appendChild(addButton);
+		lsEditor.appendChild(adder);
+
+		for (let i = 0; i < localStorage.length; i++) {
+			const k = localStorage.key(i);
+			const record = document.createElement('div');
+			record.classList.add('record');
+			const header = document.createElement('header');
+			header.textContent = k;
+			const textarea = document.createElement('textarea');
+			textarea.textContent = localStorage.getItem(k);
+			const saveButton = document.createElement('button');
+			saveButton.textContent = 'save';
+			saveButton.addEventListener('click', () => {
+				localStorage.setItem(k, textarea.value);
+				location.reload();
+			});
+			const removeButton = document.createElement('button');
+			removeButton.textContent = 'remove';
+			removeButton.addEventListener('click', () => {
+				localStorage.removeItem(k);
+				location.reload();
+			});
+			record.appendChild(header);
+			record.appendChild(textarea);
+			record.appendChild(saveButton);
+			record.appendChild(removeButton);
+			lsEditor.appendChild(record);
+		}
+
+		content.appendChild(lsEditor);
+	});
+};
diff --git a/src/server/web/cli.css b/src/server/web/cli.css
new file mode 100644
index 0000000000..07cd27830b
--- /dev/null
+++ b/src/server/web/cli.css
@@ -0,0 +1,19 @@
+* {
+	font-family: Fira code, Fira Mono, Consolas, Menlo, Courier, monospace;
+}
+
+html {
+	background: #ffb4e1;
+}
+
+main {
+	background: #dedede;
+}
+
+#tl > div {
+	padding: 16px;
+	border-bottom: solid 1px #c3c3c3;
+}
+#tl > div > header {
+	font-weight: bold;
+}
diff --git a/src/server/web/cli.js b/src/server/web/cli.js
new file mode 100644
index 0000000000..3dff1d4860
--- /dev/null
+++ b/src/server/web/cli.js
@@ -0,0 +1,55 @@
+'use strict';
+
+window.onload = async () => {
+	const account = JSON.parse(localStorage.getItem('account'));
+	const i = account.token;
+
+	const api = (endpoint, data = {}) => {
+		const promise = new Promise((resolve, reject) => {
+			// Append a credential
+			if (i) data.i = i;
+	
+			// Send request
+			fetch(endpoint.indexOf('://') > -1 ? endpoint : `/api/${endpoint}`, {
+				method: 'POST',
+				body: JSON.stringify(data),
+				credentials: 'omit',
+				cache: 'no-cache'
+			}).then(async (res) => {
+				const body = res.status === 204 ? null : await res.json();
+	
+				if (res.status === 200) {
+					resolve(body);
+				} else if (res.status === 204) {
+					resolve();
+				} else {
+					reject(body.error);
+				}
+			}).catch(reject);
+		});
+		
+		return promise;
+	};
+
+	document.getElementById('submit').addEventListener('click', () => {
+		api('notes/create', {
+			text: document.getElementById('text').value
+		}).then(() => {
+			location.reload();
+		});
+	});
+
+	api('notes/timeline').then(notes => {
+		const tl = document.getElementById('tl');
+		for (const note of notes) {
+			const el = document.createElement('div');
+			const name = document.createElement('header');
+			name.textContent = `${note.user.name} @${note.user.username}`;
+			const text = document.createElement('div');
+			text.textContent = `${note.text}`;
+			el.appendChild(name);
+			el.appendChild(text);
+			tl.appendChild(el);
+		}
+	});
+};
diff --git a/src/server/web/index.ts b/src/server/web/index.ts
index 8ea7e15751..a1d79100a6 100644
--- a/src/server/web/index.ts
+++ b/src/server/web/index.ts
@@ -376,6 +376,18 @@ router.get('/info', async ctx => {
 	});
 });
 
+router.get('/bios', async ctx => {
+	await ctx.render('bios', {
+		version: config.version,
+	});
+});
+
+router.get('/cli', async ctx => {
+	await ctx.render('cli', {
+		version: config.version,
+	});
+});
+
 const override = (source: string, target: string, depth: number = 0) =>
 	[, ...target.split('/').filter(x => x), ...source.split('/').filter(x => x).splice(depth)].join('/');
 
diff --git a/src/server/web/views/bios.pug b/src/server/web/views/bios.pug
new file mode 100644
index 0000000000..d81a3ee67f
--- /dev/null
+++ b/src/server/web/views/bios.pug
@@ -0,0 +1,20 @@
+doctype html
+
+html
+
+	head
+		meta(charset='utf-8')
+		meta(name='application-name' content='Misskey')
+		title Misskey BIOS
+		style
+			include ../bios.css
+		script
+			include ../bios.js
+
+	body
+		header
+			h1 Misskey BIOS #{version}
+		main
+			div.tabs
+				button#ls edit local storage
+			div#content
diff --git a/src/server/web/views/cli.pug b/src/server/web/views/cli.pug
new file mode 100644
index 0000000000..d2cf7c4335
--- /dev/null
+++ b/src/server/web/views/cli.pug
@@ -0,0 +1,21 @@
+doctype html
+
+html
+
+	head
+		meta(charset='utf-8')
+		meta(name='application-name' content='Misskey')
+		title Misskey Cli
+		style
+			include ../cli.css
+		script
+			include ../cli.js
+
+	body
+		header
+			h1 Misskey Cli #{version}
+		main
+			div#form
+				textarea#text
+				button#submit submit
+			div#tl
-- 
cgit v1.3.1-freya