Add keyboard shortcut doc
This commit is contained in:
		
							parent
							
								
									8414db57f0
								
							
						
					
					
						commit
						a9a2f4820b
					
				|  | @ -1,3 +1,24 @@ | |||
| <template> | ||||
| <router-view id="app"></router-view> | ||||
| <router-view id="app" v-hotkey.global="keymap"></router-view> | ||||
| </template> | ||||
| 
 | ||||
| <script lang="ts"> | ||||
| import Vue from 'vue'; | ||||
| import { url, lang } from './config'; | ||||
| 
 | ||||
| export default Vue.extend({ | ||||
| 	computed: { | ||||
| 		keymap(): any { | ||||
| 			return { | ||||
| 				'h|slash': this.help | ||||
| 			}; | ||||
| 		} | ||||
| 	}, | ||||
| 
 | ||||
| 	methods: { | ||||
| 		help() { | ||||
| 			window.open(`${url}/docs/${lang}/keyboard-shortcut`, '_blank'); | ||||
| 		} | ||||
| 	} | ||||
| }); | ||||
| </script> | ||||
|  |  | |||
|  | @ -0,0 +1,96 @@ | |||
| # Misskeyキーボードショートカットまとめ | ||||
| 
 | ||||
| ## グローバル | ||||
| これらのショートカットは基本的にどこでも使えます。 | ||||
| <table> | ||||
| 	<thead> | ||||
| 		<tr><th>ショートカット</th><th>効果</th><th>由来</th></tr> | ||||
| 	</thead> | ||||
| 	<tbody> | ||||
| 		<tr><td><kbd class="key">P</kbd>, <kbd class="key">N</kbd></td><td>新規投稿</td><td><b>P</b>ost, <b>N</b>ew, <b>N</b>ote</td></tr> | ||||
| 		<tr><td><kbd class="key">T</kbd></td><td>タイムラインの最も新しい投稿にフォーカス</td><td><b>T</b>imeline, <b>T</b>op</td></tr> | ||||
| 		<tr><td><kbd class="group"><kbd class="key">Shift</kbd> + <kbd class="key">N</kbd></kbd></td><td>通知を表示/隠す</td><td><b>N</b>otifications</td></tr> | ||||
| 		<tr><td><kbd class="key">A</kbd>, <kbd class="key">M</kbd></td><td>アカウントメニューを表示/隠す</td><td><b>A</b>ccount, <b>M</b>y, <b>M</b>e, <b>M</b>enu</td></tr> | ||||
| 		<tr><td><kbd class="key">Z</kbd></td><td>上部のバーを隠す</td><td><b>Z</b>en</td></tr> | ||||
| 		<tr><td><kbd class="key">H</kbd>, <kbd class="key">?</kbd></td><td>ヘルプを表示</td><td><b>H</b>elp</td></tr> | ||||
| 	</tbody> | ||||
| </table> | ||||
| 
 | ||||
| ## 投稿にフォーカスされた状態 | ||||
| <table> | ||||
| 	<thead> | ||||
| 		<tr><th>ショートカット</th><th>効果</th><th>由来</th></tr> | ||||
| 	</thead> | ||||
| 	<tbody> | ||||
| 		<tr><td><kbd class="key">↑</kbd>, <kbd class="key">K</kbd>, <kbd class="group"><kbd class="key">Shift</kbd> + <kbd class="key">Tab</kbd></kbd></td><td>上の投稿にフォーカスを移動</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">↓</kbd>, <kbd class="key">J</kbd>, <kbd class="key">Tab</kbd></td><td>下の投稿にフォーカスを移動</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">←</kbd>, <kbd class="key">R</kbd></td><td>返信フォームを開く</td><td><b>R</b>eply</td></tr> | ||||
| 		<tr><td><kbd class="key">→</kbd>, <kbd class="key">Q</kbd></td><td>Renoteフォームを開く</td><td><b>Q</b>uote</td></tr> | ||||
| 		<tr><td><kbd class="group"><kbd class="key">Ctrl</kbd> + <kbd class="key">→</kbd></kbd>, <kbd class="group"><kbd class="key">Ctrl</kbd> + <kbd class="key">Q</kbd></kbd></td><td>即刻Renoteする(フォームを開かずに)</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">E</kbd>, <kbd class="key">A</kbd>, <kbd class="key">+</kbd></td><td>リアクションフォームを開く</td><td><b>E</b>mote, re<b>A</b>ction</td></tr> | ||||
| 		<tr><td><kbd class="key">0</kbd>~<kbd class="key">9</kbd></td><td>数字に対応したリアクションをする(対応については後述)</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">M</kbd>, <kbd class="key">O</kbd></td><td>投稿に対するメニューを開く</td><td><b>M</b>ore, <b>O</b>ther</td></tr> | ||||
| 		<tr><td><kbd class="key">S</kbd></td><td>CWで隠された部分を表示 or 隠す</td><td><b>S</b>how, <b>S</b>ee</td></tr> | ||||
| 		<tr><td><kbd class="key">Esc</kbd></td><td>フォーカスを外す</td><td>-</td></tr> | ||||
| 	</tbody> | ||||
| </table> | ||||
| 
 | ||||
| ## Renoteフォーム | ||||
| <table> | ||||
| 	<thead> | ||||
| 		<tr><th>ショートカット</th><th>効果</th><th>由来</th></tr> | ||||
| 	</thead> | ||||
| 	<tbody> | ||||
| 		<tr><td><kbd class="key">Enter</kbd></td><td>Renoteする</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">Q</kbd></td><td>フォームを展開する</td><td><b>Q</b>uote</td></tr> | ||||
| 		<tr><td><kbd class="key">Esc</kbd></td><td>フォームを閉じる</td><td>-</td></tr> | ||||
| 	</tbody> | ||||
| </table> | ||||
| 
 | ||||
| ## リアクションフォーム | ||||
| デフォルトで「👍」にフォーカスが当たっている状態です。 | ||||
| <table> | ||||
| 	<thead> | ||||
| 		<tr><th>ショートカット</th><th>効果</th><th>由来</th></tr> | ||||
| 	</thead> | ||||
| 	<tbody> | ||||
| 		<tr><td><kbd class="key">↑</kbd>, <kbd class="key">K</kbd></td><td>上のリアクションにフォーカスを移動</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">↓</kbd>, <kbd class="key">J</kbd></td><td>下のリアクションにフォーカスを移動</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">←</kbd>, <kbd class="key">H</kbd>, <kbd class="group"><kbd class="key">Shift</kbd> + <kbd class="key">Tab</kbd></kbd></td><td>左のリアクションにフォーカスを移動</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">→</kbd>, <kbd class="key">L</kbd>, <kbd class="key">Tab</kbd></td><td>右のリアクションにフォーカスを移動</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">Enter</kbd>, <kbd class="key">Space</kbd>, <kbd class="key">+</kbd></td><td>リアクション確定</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">0</kbd>~<kbd class="key">9</kbd></td><td>数字に対応したリアクションで確定(対応については後述)</td><td>-</td></tr> | ||||
| 		<tr><td><kbd class="key">Esc</kbd></td><td>リアクションするのをやめる</td><td>-</td></tr> | ||||
| 	</tbody> | ||||
| </table> | ||||
| 
 | ||||
| ## リアクションと数字キーの対応 | ||||
| <table> | ||||
| 	<thead> | ||||
| 		<tr><th>数字キー</th><th>リアクション</th></tr> | ||||
| 	</thead> | ||||
| 	<tbody> | ||||
| 		<tr><td><kbd class="key">1</kbd></td><td>👍</td></tr> | ||||
| 		<tr><td><kbd class="key">2</kbd></td><td>❤️</td></tr> | ||||
| 		<tr><td><kbd class="key">3</kbd></td><td>😆</td></tr> | ||||
| 		<tr><td><kbd class="key">4</kbd></td><td>🤔</td></tr> | ||||
| 		<tr><td><kbd class="key">5</kbd></td><td>😮</td></tr> | ||||
| 		<tr><td><kbd class="key">6</kbd></td><td>🎉</td></tr> | ||||
| 		<tr><td><kbd class="key">7</kbd></td><td>💢</td></tr> | ||||
| 		<tr><td><kbd class="key">8</kbd></td><td>😥</td></tr> | ||||
| 		<tr><td><kbd class="key">9</kbd></td><td>😇</td></tr> | ||||
| 		<tr><td><kbd class="key">0</kbd></td><td>🍮 or 🍣</td></tr> | ||||
| 	</tbody> | ||||
| </table> | ||||
| 
 | ||||
| # 例 | ||||
| <table> | ||||
| 	<thead> | ||||
| 		<tr><th>ショートカット</th><th>動作</th></tr> | ||||
| 	</thead> | ||||
| 	<tbody> | ||||
| 		<tr><td><kbd class="key">t</kbd><kbd class="key">+</kbd><kbd class="key">+</kbd></td><td>タイムラインの最新の投稿に👍する</td></tr> | ||||
| 		<tr><td><kbd class="key">t</kbd><kbd class="key">1</kbd></td><td>タイムラインの最新の投稿に👍する</td></tr> | ||||
| 		<tr><td><kbd class="key">t</kbd><kbd class="key">0</kbd></td><td>タイムラインの最新の投稿に🍮する</td></tr> | ||||
| 	</tbody> | ||||
| </table> | ||||
|  | @ -128,3 +128,24 @@ pre | |||
| 	> code | ||||
| 		display block | ||||
| 		padding 16px | ||||
| 
 | ||||
| kbd.group | ||||
| 	display inline-block | ||||
| 	padding 4px | ||||
| 	background #fbfbfb | ||||
| 	border 1px solid #d6d6d6 | ||||
| 	border-radius 4px | ||||
| 	box-shadow 0 1px 1px rgba(0, 0, 0, 0.1) | ||||
| 
 | ||||
| kbd.key | ||||
| 	display inline-block | ||||
| 	padding 6px 8px | ||||
| 	background #fff | ||||
| 	border solid 1px #cecece | ||||
| 	border-radius 4px | ||||
| 	box-shadow 0 1px 1px rgba(0, 0, 0, 0.1) | ||||
| 
 | ||||
| td | ||||
| 	> kbd.group, | ||||
| 	> kbd.key | ||||
| 		margin 4px | ||||
|  |  | |||
		Loading…
	
		Reference in New Issue