enhance(frontend): re-organize settings page

5 files changed, 194 insertions, 197 deletions

diff --git a/locales/index.d.ts b/locales/index.d.ts
index f579aadb5d..00d275ee43 100644
--- a/locales/index.d.ts
+++ b/locales/index.d.ts
@@ -5429,6 +5429,10 @@ export interface Locale extends ILocale {
          * クライアントで再生するサウンドの設定が行えます。
          */
         "soundsBanner": string;
+        /**
+         * タイムラインとノート
+         */
+        "timelineAndNote": string;
     };
     "_preferencesProfile": {
         /**
diff --git a/locales/ja-JP.yml b/locales/ja-JP.yml
index 2151a06611..8e787fa02f 100644
--- a/locales/ja-JP.yml
+++ b/locales/ja-JP.yml
@@ -1356,6 +1356,7 @@ _settings:
   preferencesBanner: "好みに応じた、クライアントの全体的な動作の設定が行えます。"
   appearanceBanner: "好みに応じた、クライアントの見た目・表示方法に関する設定が行えます。"
   soundsBanner: "クライアントで再生するサウンドの設定が行えます。"
+  timelineAndNote: "タイムラインとノート"
 
 _preferencesProfile:
   profileName: "プロファイル名"
diff --git a/packages/frontend/src/pages/settings/preferences.vue b/packages/frontend/src/pages/settings/preferences.vue
index 87d80602ad..9256a565c4 100644
--- a/packages/frontend/src/pages/settings/preferences.vue
+++ b/packages/frontend/src/pages/settings/preferences.vue
@@ -88,6 +88,22 @@ SPDX-License-Identifier: AGPL-3.0-only
 									</MkSwitch>
 								</MkPreferenceContainer>
 							</SearchMarker>
+
+							<SearchMarker :keywords="['mfm', 'enable', 'show', 'advanced']">
+								<MkPreferenceContainer k="advancedMfm">
+									<MkSwitch v-model="advancedMfm">
+										<template #label><SearchLabel>{{ i18n.ts.enableAdvancedMfm }}</SearchLabel></template>
+									</MkSwitch>
+								</MkPreferenceContainer>
+							</SearchMarker>
+
+							<SearchMarker :keywords="['auto', 'load', 'auto', 'more', 'scroll']">
+								<MkPreferenceContainer k="enableInfiniteScroll">
+									<MkSwitch v-model="enableInfiniteScroll">
+										<template #label><SearchLabel>{{ i18n.ts.enableInfiniteScroll }}</SearchLabel></template>
+									</MkSwitch>
+								</MkPreferenceContainer>
+							</SearchMarker>
 						</div>
 
 						<SearchMarker :keywords="['emoji', 'style', 'native', 'system', 'fluent', 'twemoji']">
@@ -116,178 +132,160 @@ SPDX-License-Identifier: AGPL-3.0-only
 				</MkFolder>
 			</SearchMarker>
 
-			<SearchMarker :keywords="['timeline']">
-				<MkFolder>
-					<template #label><SearchLabel>{{ i18n.ts.timeline }}</SearchLabel></template>
-
-					<div class="_gaps_s">
-						<SearchMarker :keywords="['post', 'form', 'timeline']">
-							<MkPreferenceContainer k="showFixedPostForm">
-								<MkSwitch v-model="showFixedPostForm">
-									<template #label><SearchLabel>{{ i18n.ts.showFixedPostForm }}</SearchLabel></template>
-								</MkSwitch>
-							</MkPreferenceContainer>
-						</SearchMarker>
-
-						<SearchMarker :keywords="['post', 'form', 'timeline', 'channel']">
-							<MkPreferenceContainer k="showFixedPostFormInChannel">
-								<MkSwitch v-model="showFixedPostFormInChannel">
-									<template #label><SearchLabel>{{ i18n.ts.showFixedPostFormInChannel }}</SearchLabel></template>
-								</MkSwitch>
-							</MkPreferenceContainer>
-						</SearchMarker>
-
-						<SearchMarker :keywords="['renote']">
-							<MkPreferenceContainer k="collapseRenotes">
-								<MkSwitch v-model="collapseRenotes">
-									<template #label><SearchLabel>{{ i18n.ts.collapseRenotes }}</SearchLabel></template>
-									<template #caption><SearchKeyword>{{ i18n.ts.collapseRenotesDescription }}</SearchKeyword></template>
-								</MkSwitch>
-							</MkPreferenceContainer>
-						</SearchMarker>
-
-						<SearchMarker :keywords="['note', 'timeline', 'gap']">
-							<MkPreferenceContainer k="showGapBetweenNotesInTimeline">
-								<MkSwitch v-model="showGapBetweenNotesInTimeline">
-									<template #label><SearchLabel>{{ i18n.ts.showGapBetweenNotesInTimeline }}</SearchLabel></template>
-								</MkSwitch>
-							</MkPreferenceContainer>
-						</SearchMarker>
-
-						<SearchMarker :keywords="['load', 'auto', 'more']">
-							<MkPreferenceContainer k="enableInfiniteScroll">
-								<MkSwitch v-model="enableInfiniteScroll">
-									<template #label><SearchLabel>{{ i18n.ts.enableInfiniteScroll }}</SearchLabel></template>
-								</MkSwitch>
-							</MkPreferenceContainer>
-						</SearchMarker>
-
-						<SearchMarker :keywords="['disable', 'streaming', 'timeline']">
-							<MkPreferenceContainer k="disableStreamingTimeline">
-								<MkSwitch v-model="disableStreamingTimeline">
-									<template #label><SearchLabel>{{ i18n.ts.disableStreamingTimeline }}</SearchLabel></template>
-								</MkSwitch>
-							</MkPreferenceContainer>
-						</SearchMarker>
-					</div>
-				</MkFolder>
-			</SearchMarker>
-
-			<SearchMarker :keywords="['note']">
+			<SearchMarker :keywords="['timeline', 'note']">
 				<MkFolder>
-					<template #label><SearchLabel>{{ i18n.ts.note }}</SearchLabel></template>
+					<template #label><SearchLabel>{{ i18n.ts._settings.timelineAndNote }}</SearchLabel></template>
 
 					<div class="_gaps_m">
 						<div class="_gaps_s">
-							<SearchMarker :keywords="['hover', 'show', 'footer', 'action']">
-								<MkPreferenceContainer k="showNoteActionsOnlyHover">
-									<MkSwitch v-model="showNoteActionsOnlyHover">
-										<template #label><SearchLabel>{{ i18n.ts.showNoteActionsOnlyHover }}</SearchLabel></template>
+							<SearchMarker :keywords="['post', 'form', 'timeline']">
+								<MkPreferenceContainer k="showFixedPostForm">
+									<MkSwitch v-model="showFixedPostForm">
+										<template #label><SearchLabel>{{ i18n.ts.showFixedPostForm }}</SearchLabel></template>
 									</MkSwitch>
 								</MkPreferenceContainer>
 							</SearchMarker>
 
-							<SearchMarker :keywords="['footer', 'action', 'clip', 'show']">
-								<MkPreferenceContainer k="showClipButtonInNoteFooter">
-									<MkSwitch v-model="showClipButtonInNoteFooter">
-										<template #label><SearchLabel>{{ i18n.ts.showClipButtonInNoteFooter }}</SearchLabel></template>
+							<SearchMarker :keywords="['post', 'form', 'timeline', 'channel']">
+								<MkPreferenceContainer k="showFixedPostFormInChannel">
+									<MkSwitch v-model="showFixedPostFormInChannel">
+										<template #label><SearchLabel>{{ i18n.ts.showFixedPostFormInChannel }}</SearchLabel></template>
 									</MkSwitch>
 								</MkPreferenceContainer>
 							</SearchMarker>
 
-							<SearchMarker :keywords="['mfm', 'enable', 'show', 'advanced']">
-								<MkPreferenceContainer k="advancedMfm">
-									<MkSwitch v-model="advancedMfm">
-										<template #label><SearchLabel>{{ i18n.ts.enableAdvancedMfm }}</SearchLabel></template>
+							<SearchMarker :keywords="['renote']">
+								<MkPreferenceContainer k="collapseRenotes">
+									<MkSwitch v-model="collapseRenotes">
+										<template #label><SearchLabel>{{ i18n.ts.collapseRenotes }}</SearchLabel></template>
+										<template #caption><SearchKeyword>{{ i18n.ts.collapseRenotesDescription }}</SearchKeyword></template>
 									</MkSwitch>
 								</MkPreferenceContainer>
 							</SearchMarker>
 
-							<SearchMarker :keywords="['reaction', 'count', 'show']">
-								<MkPreferenceContainer k="showReactionsCount">
-									<MkSwitch v-model="showReactionsCount">
-										<template #label><SearchLabel>{{ i18n.ts.showReactionsCount }}</SearchLabel></template>
+							<SearchMarker :keywords="['note', 'timeline', 'gap']">
+								<MkPreferenceContainer k="showGapBetweenNotesInTimeline">
+									<MkSwitch v-model="showGapBetweenNotesInTimeline">
+										<template #label><SearchLabel>{{ i18n.ts.showGapBetweenNotesInTimeline }}</SearchLabel></template>
 									</MkSwitch>
 								</MkPreferenceContainer>
 							</SearchMarker>
 
-							<SearchMarker :keywords="['reaction', 'confirm']">
-								<MkPreferenceContainer k="confirmOnReact">
-									<MkSwitch v-model="confirmOnReact">
-										<template #label><SearchLabel>{{ i18n.ts.confirmOnReact }}</SearchLabel></template>
+							<SearchMarker :keywords="['disable', 'streaming', 'timeline']">
+								<MkPreferenceContainer k="disableStreamingTimeline">
+									<MkSwitch v-model="disableStreamingTimeline">
+										<template #label><SearchLabel>{{ i18n.ts.disableStreamingTimeline }}</SearchLabel></template>
 									</MkSwitch>
 								</MkPreferenceContainer>
 							</SearchMarker>
+						</div>
 
-							<SearchMarker :keywords="['image', 'photo', 'picture', 'media', 'thumbnail', 'quality', 'raw', 'attachment']">
-								<MkPreferenceContainer k="loadRawImages">
-									<MkSwitch v-model="loadRawImages">
-										<template #label><SearchLabel>{{ i18n.ts.loadRawImages }}</SearchLabel></template>
-									</MkSwitch>
+						<hr>
+
+						<div class="_gaps_m">
+							<div class="_gaps_s">
+								<SearchMarker :keywords="['hover', 'show', 'footer', 'action']">
+									<MkPreferenceContainer k="showNoteActionsOnlyHover">
+										<MkSwitch v-model="showNoteActionsOnlyHover">
+											<template #label><SearchLabel>{{ i18n.ts.showNoteActionsOnlyHover }}</SearchLabel></template>
+										</MkSwitch>
+									</MkPreferenceContainer>
+								</SearchMarker>
+
+								<SearchMarker :keywords="['footer', 'action', 'clip', 'show']">
+									<MkPreferenceContainer k="showClipButtonInNoteFooter">
+										<MkSwitch v-model="showClipButtonInNoteFooter">
+											<template #label><SearchLabel>{{ i18n.ts.showClipButtonInNoteFooter }}</SearchLabel></template>
+										</MkSwitch>
+									</MkPreferenceContainer>
+								</SearchMarker>
+
+								<SearchMarker :keywords="['reaction', 'count', 'show']">
+									<MkPreferenceContainer k="showReactionsCount">
+										<MkSwitch v-model="showReactionsCount">
+											<template #label><SearchLabel>{{ i18n.ts.showReactionsCount }}</SearchLabel></template>
+										</MkSwitch>
+									</MkPreferenceContainer>
+								</SearchMarker>
+
+								<SearchMarker :keywords="['reaction', 'confirm']">
+									<MkPreferenceContainer k="confirmOnReact">
+										<MkSwitch v-model="confirmOnReact">
+											<template #label><SearchLabel>{{ i18n.ts.confirmOnReact }}</SearchLabel></template>
+										</MkSwitch>
+									</MkPreferenceContainer>
+								</SearchMarker>
+
+								<SearchMarker :keywords="['image', 'photo', 'picture', 'media', 'thumbnail', 'quality', 'raw', 'attachment']">
+									<MkPreferenceContainer k="loadRawImages">
+										<MkSwitch v-model="loadRawImages">
+											<template #label><SearchLabel>{{ i18n.ts.loadRawImages }}</SearchLabel></template>
+										</MkSwitch>
+									</MkPreferenceContainer>
+								</SearchMarker>
+
+								<SearchMarker :keywords="['reaction', 'picker', 'contextmenu', 'open']">
+									<MkPreferenceContainer k="useReactionPickerForContextMenu">
+										<MkSwitch v-model="useReactionPickerForContextMenu">
+											<template #label><SearchLabel>{{ i18n.ts.useReactionPickerForContextMenu }}</SearchLabel></template>
+										</MkSwitch>
+									</MkPreferenceContainer>
+								</SearchMarker>
+							</div>
+
+							<SearchMarker :keywords="['reaction', 'size', 'scale', 'display']">
+								<MkPreferenceContainer k="reactionsDisplaySize">
+									<MkRadios v-model="reactionsDisplaySize">
+										<template #label><SearchLabel>{{ i18n.ts.reactionsDisplaySize }}</SearchLabel></template>
+										<option value="small">{{ i18n.ts.small }}</option>
+										<option value="medium">{{ i18n.ts.medium }}</option>
+										<option value="large">{{ i18n.ts.large }}</option>
+									</MkRadios>
 								</MkPreferenceContainer>
 							</SearchMarker>
 
-							<SearchMarker :keywords="['reaction', 'picker', 'contextmenu', 'open']">
-								<MkPreferenceContainer k="useReactionPickerForContextMenu">
-									<MkSwitch v-model="useReactionPickerForContextMenu">
-										<template #label><SearchLabel>{{ i18n.ts.useReactionPickerForContextMenu }}</SearchLabel></template>
+							<SearchMarker :keywords="['reaction', 'size', 'scale', 'display', 'width', 'limit']">
+								<MkPreferenceContainer k="limitWidthOfReaction">
+									<MkSwitch v-model="limitWidthOfReaction">
+										<template #label><SearchLabel>{{ i18n.ts.limitWidthOfReaction }}</SearchLabel></template>
 									</MkSwitch>
 								</MkPreferenceContainer>
 							</SearchMarker>
-						</div>
 
-						<SearchMarker :keywords="['reaction', 'size', 'scale', 'display']">
-							<MkPreferenceContainer k="reactionsDisplaySize">
-								<MkRadios v-model="reactionsDisplaySize">
-									<template #label><SearchLabel>{{ i18n.ts.reactionsDisplaySize }}</SearchLabel></template>
-									<option value="small">{{ i18n.ts.small }}</option>
-									<option value="medium">{{ i18n.ts.medium }}</option>
-									<option value="large">{{ i18n.ts.large }}</option>
-								</MkRadios>
-							</MkPreferenceContainer>
-						</SearchMarker>
-
-						<SearchMarker :keywords="['reaction', 'size', 'scale', 'display', 'width', 'limit']">
-							<MkPreferenceContainer k="limitWidthOfReaction">
-								<MkSwitch v-model="limitWidthOfReaction">
-									<template #label><SearchLabel>{{ i18n.ts.limitWidthOfReaction }}</SearchLabel></template>
-								</MkSwitch>
-							</MkPreferenceContainer>
-						</SearchMarker>
-
-						<SearchMarker :keywords="['attachment', 'image', 'photo', 'picture', 'media', 'thumbnail', 'list', 'size', 'height']">
-							<MkPreferenceContainer k="mediaListWithOneImageAppearance">
-								<MkRadios v-model="mediaListWithOneImageAppearance">
-									<template #label><SearchLabel>{{ i18n.ts.mediaListWithOneImageAppearance }}</SearchLabel></template>
-									<option value="expand">{{ i18n.ts.default }}</option>
-									<option value="16_9">{{ i18n.tsx.limitTo({ x: '16:9' }) }}</option>
-									<option value="1_1">{{ i18n.tsx.limitTo({ x: '1:1' }) }}</option>
-									<option value="2_3">{{ i18n.tsx.limitTo({ x: '2:3' }) }}</option>
-								</MkRadios>
-							</MkPreferenceContainer>
-						</SearchMarker>
+							<SearchMarker :keywords="['attachment', 'image', 'photo', 'picture', 'media', 'thumbnail', 'list', 'size', 'height']">
+								<MkPreferenceContainer k="mediaListWithOneImageAppearance">
+									<MkRadios v-model="mediaListWithOneImageAppearance">
+										<template #label><SearchLabel>{{ i18n.ts.mediaListWithOneImageAppearance }}</SearchLabel></template>
+										<option value="expand">{{ i18n.ts.default }}</option>
+										<option value="16_9">{{ i18n.tsx.limitTo({ x: '16:9' }) }}</option>
+										<option value="1_1">{{ i18n.tsx.limitTo({ x: '1:1' }) }}</option>
+										<option value="2_3">{{ i18n.tsx.limitTo({ x: '2:3' }) }}</option>
+									</MkRadios>
+								</MkPreferenceContainer>
+							</SearchMarker>
 
-						<SearchMarker :keywords="['ticker', 'information', 'label', 'instance', 'server', 'host', 'federation']">
-							<MkPreferenceContainer k="instanceTicker">
-								<MkSelect v-if="instance.federation !== 'none'" v-model="instanceTicker">
-									<template #label><SearchLabel>{{ i18n.ts.instanceTicker }}</SearchLabel></template>
-									<option value="none">{{ i18n.ts._instanceTicker.none }}</option>
-									<option value="remote">{{ i18n.ts._instanceTicker.remote }}</option>
-									<option value="always">{{ i18n.ts._instanceTicker.always }}</option>
-								</MkSelect>
-							</MkPreferenceContainer>
-						</SearchMarker>
+							<SearchMarker :keywords="['ticker', 'information', 'label', 'instance', 'server', 'host', 'federation']">
+								<MkPreferenceContainer k="instanceTicker">
+									<MkSelect v-if="instance.federation !== 'none'" v-model="instanceTicker">
+										<template #label><SearchLabel>{{ i18n.ts.instanceTicker }}</SearchLabel></template>
+										<option value="none">{{ i18n.ts._instanceTicker.none }}</option>
+										<option value="remote">{{ i18n.ts._instanceTicker.remote }}</option>
+										<option value="always">{{ i18n.ts._instanceTicker.always }}</option>
+									</MkSelect>
+								</MkPreferenceContainer>
+							</SearchMarker>
 
-						<SearchMarker :keywords="['attachment', 'image', 'photo', 'picture', 'media', 'thumbnail', 'nsfw', 'sensitive', 'display', 'show', 'hide', 'visibility']">
-							<MkPreferenceContainer k="nsfw">
-								<MkSelect v-model="nsfw">
-									<template #label><SearchLabel>{{ i18n.ts.displayOfSensitiveMedia }}</SearchLabel></template>
-									<option value="respect">{{ i18n.ts._displayOfSensitiveMedia.respect }}</option>
-									<option value="ignore">{{ i18n.ts._displayOfSensitiveMedia.ignore }}</option>
-									<option value="force">{{ i18n.ts._displayOfSensitiveMedia.force }}</option>
-								</MkSelect>
-							</MkPreferenceContainer>
-						</SearchMarker>
+							<SearchMarker :keywords="['attachment', 'image', 'photo', 'picture', 'media', 'thumbnail', 'nsfw', 'sensitive', 'display', 'show', 'hide', 'visibility']">
+								<MkPreferenceContainer k="nsfw">
+									<MkSelect v-model="nsfw">
+										<template #label><SearchLabel>{{ i18n.ts.displayOfSensitiveMedia }}</SearchLabel></template>
+										<option value="respect">{{ i18n.ts._displayOfSensitiveMedia.respect }}</option>
+										<option value="ignore">{{ i18n.ts._displayOfSensitiveMedia.ignore }}</option>
+										<option value="force">{{ i18n.ts._displayOfSensitiveMedia.force }}</option>
+									</MkSelect>
+								</MkPreferenceContainer>
+							</SearchMarker>
+						</div>
 					</div>
 				</MkFolder>
 			</SearchMarker>
diff --git a/packages/frontend/src/style.scss b/packages/frontend/src/style.scss
index fb2c805b1b..5308c312bb 100644
--- a/packages/frontend/src/style.scss
+++ b/packages/frontend/src/style.scss
@@ -130,6 +130,7 @@ optgroup, option {
 hr {
 	margin: 0;
 	border: none;
+	border-radius: 999px;
 	height: 1px;
 	background: var(--MI_THEME-divider);
 }
diff --git a/packages/frontend/src/utility/autogen/settings-search-index.ts b/packages/frontend/src/utility/autogen/settings-search-index.ts
index e768d8a5ae..ab26d671a2 100644
--- a/packages/frontend/src/utility/autogen/settings-search-index.ts
+++ b/packages/frontend/src/utility/autogen/settings-search-index.ts
@@ -314,12 +314,22 @@ export const searchIndexes: SearchIndexItem[] = [
 						keywords: ['sensitive', 'nsfw', 'media', 'image', 'photo', 'picture', 'attachment', 'confirm'],
 					},
 					{
-						id: '4LxdiOMNh',
+						id: 'aefexW9fD',
+						label: i18n.ts.enableAdvancedMfm,
+						keywords: ['mfm', 'enable', 'show', 'advanced'],
+					},
+					{
+						id: 'lu9v5Spqg',
+						label: i18n.ts.enableInfiniteScroll,
+						keywords: ['auto', 'load', 'auto', 'more', 'scroll'],
+					},
+					{
+						id: '6kMj4HVOg',
 						label: i18n.ts.emojiStyle,
 						keywords: ['emoji', 'style', 'native', 'system', 'fluent', 'twemoji'],
 					},
 					{
-						id: '67knC3FWp',
+						id: 'DftdlLbNu',
 						label: i18n.ts.pinnedList,
 						keywords: ['pinned', 'list'],
 					},
@@ -328,129 +338,112 @@ export const searchIndexes: SearchIndexItem[] = [
 				keywords: ['general'],
 			},
 			{
-				id: 'hDdVkBFJP',
+				id: 'CQldliCSi',
 				children: [
 					{
-						id: 'igFN7RIUa',
+						id: 'kMB2hPyq3',
 						label: i18n.ts.showFixedPostForm,
 						keywords: ['post', 'form', 'timeline'],
 					},
 					{
-						id: '9uxocbLO0',
+						id: 'jC7LtTnmc',
 						label: i18n.ts.showFixedPostFormInChannel,
 						keywords: ['post', 'form', 'timeline', 'channel'],
 					},
 					{
-						id: 'eaT1O1Fao',
+						id: 'p2wlrnwLo',
 						label: i18n.ts.collapseRenotes,
 						keywords: ['renote', i18n.ts.collapseRenotesDescription],
 					},
 					{
-						id: 'jC7LtTnmc',
+						id: '6SFn3t8VS',
 						label: i18n.ts.showGapBetweenNotesInTimeline,
 						keywords: ['note', 'timeline', 'gap'],
 					},
 					{
-						id: 'p2wlrnwLo',
-						label: i18n.ts.enableInfiniteScroll,
-						keywords: ['load', 'auto', 'more'],
-					},
-					{
-						id: 'eqMBMY6LU',
+						id: 'nygexkaUk',
 						label: i18n.ts.disableStreamingTimeline,
 						keywords: ['disable', 'streaming', 'timeline'],
 					},
-				],
-				label: i18n.ts.timeline,
-				keywords: ['timeline'],
-			},
-			{
-				id: '2LNjwv1cr',
-				children: [
 					{
-						id: '6ylW3eIcD',
+						id: '7vnQgR42v',
 						label: i18n.ts.showNoteActionsOnlyHover,
 						keywords: ['hover', 'show', 'footer', 'action'],
 					},
 					{
-						id: 'lBbtAg0Hm',
+						id: 'x5q4XZ7Kv',
 						label: i18n.ts.showClipButtonInNoteFooter,
 						keywords: ['footer', 'action', 'clip', 'show'],
 					},
 					{
-						id: 'E9whefUtX',
-						label: i18n.ts.enableAdvancedMfm,
-						keywords: ['mfm', 'enable', 'show', 'advanced'],
-					},
-					{
-						id: 'iQaBbJBva',
+						id: 'x9irZWjaF',
 						label: i18n.ts.showReactionsCount,
 						keywords: ['reaction', 'count', 'show'],
 					},
 					{
-						id: 'hgEVGgJa1',
+						id: 'dHPv9mrxi',
 						label: i18n.ts.confirmOnReact,
 						keywords: ['reaction', 'confirm'],
 					},
 					{
-						id: 'yxehrHZ6x',
+						id: 'bj42W4cvN',
 						label: i18n.ts.loadRawImages,
 						keywords: ['image', 'photo', 'picture', 'media', 'thumbnail', 'quality', 'raw', 'attachment'],
 					},
 					{
-						id: 'DdoFLaSG8',
+						id: 'fzPca1Gk9',
 						label: i18n.ts.useReactionPickerForContextMenu,
 						keywords: ['reaction', 'picker', 'contextmenu', 'open'],
 					},
 					{
-						id: 'fyod6U3QX',
+						id: 'mNU5IBln7',
 						label: i18n.ts.reactionsDisplaySize,
 						keywords: ['reaction', 'size', 'scale', 'display'],
 					},
 					{
-						id: 'kmdsnVIQX',
+						id: 'kYgorbLUy',
 						label: i18n.ts.limitWidthOfReaction,
 						keywords: ['reaction', 'size', 'scale', 'display', 'width', 'limit'],
 					},
 					{
-						id: 'hacQ9br20',
+						id: 'm75VEWI3S',
 						label: i18n.ts.mediaListWithOneImageAppearance,
 						keywords: ['attachment', 'image', 'photo', 'picture', 'media', 'thumbnail', 'list', 'size', 'height'],
 					},
 					{
-						id: 'vE7KeV4U4',
+						id: 'CA42sC9Mx',
 						label: i18n.ts.instanceTicker,
 						keywords: ['ticker', 'information', 'label', 'instance', 'server', 'host', 'federation'],
 					},
 					{
-						id: '3reoOxO26',
+						id: 'knEhibyFp',
 						label: i18n.ts.displayOfSensitiveMedia,
 						keywords: ['attachment', 'image', 'photo', 'picture', 'media', 'thumbnail', 'nsfw', 'sensitive', 'display', 'show', 'hide', 'visibility'],
 					},
 				],
-				label: i18n.ts.note,
-				keywords: ['note'],
+				label: i18n.ts._settings.timelineAndNote,
+				keywords: ['timeline', 'note'],
 			},
 			{
-				id: 'eROFRMtXv',
+				id: 'yIR4YP0yU',
 				children: [
 					{
-						id: 'bezWaWd6M',
+						id: 'cBkUgQNpH',
 						label: i18n.ts.keepCw,
 						keywords: ['remember', 'keep', 'note', 'cw'],
 					},
 					{
-						id: '90ngq28Nx',
+						id: 'Bv4YywaKL',
 						label: i18n.ts.rememberNoteVisibility,
 						keywords: ['remember', 'keep', 'note', 'visibility'],
 					},
 					{
-						id: 'ERGQVw6ml',
+						id: 'F3kpUNvSQ',
 						label: i18n.ts.enableQuickAddMfmFunction,
 						keywords: ['mfm', 'enable', 'show', 'advanced', 'picker', 'form', 'function', 'fn'],
 					},
 					{
-						id: 'g0otcvWv3',
+						id: 'BBxwy4F6E',
 						label: i18n.ts.defaultNoteVisibility,
 						keywords: ['default', 'note', 'visibility'],
 					},
@@ -459,20 +452,20 @@ export const searchIndexes: SearchIndexItem[] = [
 				keywords: ['post', 'form'],
 			},
 			{
-				id: 'AWLIP02IT',
+				id: 'e5XnQWk68',
 				children: [
 					{
-						id: 'rDLJRu99',
+						id: 'rOttgccaS',
 						label: i18n.ts.useGroupedNotifications,
 						keywords: ['group'],
 					},
 					{
-						id: '70WDijfPH',
+						id: 'Ek4Cw3VPq',
 						label: i18n.ts.position,
 						keywords: ['position'],
 					},
 					{
-						id: 'xKUzsSrKy',
+						id: 'pZLzt3i0s',
 						label: i18n.ts.stackAxis,
 						keywords: ['stack', 'axis', 'direction'],
 					},
@@ -481,55 +474,55 @@ export const searchIndexes: SearchIndexItem[] = [
 				keywords: ['notification'],
 			},
 			{
-				id: '2E7vdIUQd',
+				id: 'c9mbgmHQp',
 				label: i18n.ts.dataSaver,
 				keywords: ['datasaver'],
 			},
 			{
-				id: '6ZbRRIhA6',
+				id: '5h8vhCX1S',
 				children: [
 					{
-						id: 'soNZaKfiW',
+						id: 'bDv03znUy',
 						label: i18n.ts.squareAvatars,
 						keywords: ['avatar', 'icon', 'square'],
 					},
 					{
-						id: 'nhwHJJ2tl',
+						id: 'nkR2LWURW',
 						label: i18n.ts.seasonalScreenEffect,
 						keywords: ['effect', 'show'],
 					},
 					{
-						id: 'oMAVUuxTm',
+						id: 'sCscGhMmH',
 						label: i18n.ts.openImageInNewTab,
 						keywords: ['image', 'photo', 'picture', 'media', 'thumbnail', 'new', 'tab'],
 					},
 					{
-						id: 'hSqX5JKM7',
+						id: '4yCgcFElF',
 						label: i18n.ts.withRepliesByDefaultForNewlyFollowed,
 						keywords: ['follow', 'replies'],
 					},
 					{
-						id: 'fm98eqzke',
+						id: '5iMpm5rES',
 						label: i18n.ts.whenServerDisconnected,
 						keywords: ['server', 'disconnect', 'reconnect', 'reload', 'streaming'],
 					},
 					{
-						id: '1rWDVig8Y',
+						id: 'dlQjnWBVU',
 						label: i18n.ts.numberOfPageCache,
 						keywords: ['cache', 'page'],
 					},
 					{
-						id: 'vXLtihtCp',
+						id: 'qY5xTzl35',
 						label: i18n.ts.forceShowAds,
 						keywords: ['ad', 'show'],
 					},
 					{
-						id: '77YljFpiH',
+						id: '2VSnj81vC',
 						label: i18n.ts.hemisphere,
 						keywords: [],
 					},
 					{
-						id: 'CZgDNPP1h',
+						id: 'vuG3aG3IE',
 						label: i18n.ts.additionalEmojiDictionary,
 						keywords: ['emoji', 'dictionary', 'additional', 'extra'],
 					},