From da71d8f4afb83d62891388ab6900c297a60f51cb Mon Sep 17 00:00:00 2001
From: syuilo <Syuilotan@yahoo.co.jp>
Date: Sun, 26 Sep 2021 01:53:56 +0900
Subject: [PATCH] fix(client): fix tabs of page header behaviour

---
 CHANGELOG.md                      | 4 +++-
 src/client/ui/_common_/header.vue | 4 ++++
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 7d412fb7d1..fcf2f369f5 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -10,11 +10,13 @@
 ## 12.x.x (unreleased)
 
 ### Improvements
-- アニメーションを減らす設定をメニューのアニメーションにも適用するように
+- クライアント: アニメーションを減らす設定をメニューのアニメーションにも適用するように
 
 ### Bugfixes
 - Fix createDeleteAccountJob
 - admin inbox queue does not show individual jobs
+- クライアント: ヘッダーのタブが折り返される問題を修正
+- クライアント: ヘッダーにタブが表示されている状態でタイトルをクリックしたときにタブ選択が表示されるのを修正
 
 ## 12.91.0 (2021/09/22)
 
diff --git a/src/client/ui/_common_/header.vue b/src/client/ui/_common_/header.vue
index 1e0db9a3a1..f21be2f9cd 100644
--- a/src/client/ui/_common_/header.vue
+++ b/src/client/ui/_common_/header.vue
@@ -141,6 +141,7 @@ export default defineComponent({
 
 		showTabsPopup(ev) {
 			if (!this.hasTabs) return;
+			if (!this.narrow) return;
 			ev.preventDefault();
 			ev.stopPropagation();
 			const menu = this.info.tabs.map(tab => ({
@@ -218,6 +219,7 @@ export default defineComponent({
 		white-space: nowrap;
 		text-align: left;
 		font-weight: bold;
+		flex-shrink: 0;
 
 		> .avatar {
 			$size: 32px;
@@ -263,6 +265,8 @@ export default defineComponent({
 	> .tabs {
 		margin-left: 16px;
 		font-size: 0.8em;
+		overflow: auto;
+		white-space: nowrap;
 
 		> .tab {
 			display: inline-block;