Merge pull request #10218 from misskey-dev/develop

Release: 13.9.2

5 files changed, 79 insertions, 67 deletions

diff --git a/packages/frontend/src/components/MkFolder.vue b/packages/frontend/src/components/MkFolder.vue
index a54a1c2305..2748a9e491 100644
--- a/packages/frontend/src/components/MkFolder.vue
+++ b/packages/frontend/src/components/MkFolder.vue
@@ -1,41 +1,46 @@
 <template>
-<div ref="rootEl" :class="[$style.root, { [$style.opened]: opened }]">
-	<div :class="$style.header" class="_button" @click="toggle">
-		<div :class="$style.headerIcon"><slot name="icon"></slot></div>
-		<div :class="$style.headerText">
-			<div :class="$style.headerTextMain">
-				<slot name="label"></slot>
-			</div>
-			<div :class="$style.headerTextSub">
-				<slot name="caption"></slot>
+<div ref="rootEl" :class="$style.root">
+	<MkStickyContainer>
+		<template #header>
+			<div :class="[$style.header, { [$style.opened]: opened }]" class="_button" @click="toggle">
+				<div :class="$style.headerIcon"><slot name="icon"></slot></div>
+				<div :class="$style.headerText">
+					<div :class="$style.headerTextMain">
+						<slot name="label"></slot>
+					</div>
+					<div :class="$style.headerTextSub">
+						<slot name="caption"></slot>
+					</div>
+				</div>
+				<div :class="$style.headerRight">
+					<span :class="$style.headerRightText"><slot name="suffix"></slot></span>
+					<i v-if="opened" class="ti ti-chevron-up icon"></i>
+					<i v-else class="ti ti-chevron-down icon"></i>
+				</div>
 			</div>
+		</template>
+
+		<div v-if="openedAtLeastOnce" :class="[$style.body, { [$style.bgSame]: bgSame }]" :style="{ maxHeight: maxHeight ? `${maxHeight}px` : null, overflow: maxHeight ? `auto` : null }">
+			<Transition
+				:enter-active-class="$store.state.animation ? $style.transition_toggle_enterActive : ''"
+				:leave-active-class="$store.state.animation ? $style.transition_toggle_leaveActive : ''"
+				:enter-from-class="$store.state.animation ? $style.transition_toggle_enterFrom : ''"
+				:leave-to-class="$store.state.animation ? $style.transition_toggle_leaveTo : ''"
+				@enter="enter"
+				@after-enter="afterEnter"
+				@leave="leave"
+				@after-leave="afterLeave"
+			>
+				<KeepAlive>
+					<div v-show="opened">
+						<MkSpacer :margin-min="14" :margin-max="22">
+							<slot></slot>
+						</MkSpacer>
+					</div>
+				</KeepAlive>
+			</Transition>
 		</div>
-		<div :class="$style.headerRight">
-			<span :class="$style.headerRightText"><slot name="suffix"></slot></span>
-			<i v-if="opened" class="ti ti-chevron-up icon"></i>
-			<i v-else class="ti ti-chevron-down icon"></i>
-		</div>
-	</div>
-	<div v-if="openedAtLeastOnce" :class="[$style.body, { [$style.bgSame]: bgSame }]" :style="{ maxHeight: maxHeight ? `${maxHeight}px` : null }">
-		<Transition
-			:enter-active-class="$store.state.animation ? $style.transition_toggle_enterActive : ''"
-			:leave-active-class="$store.state.animation ? $style.transition_toggle_leaveActive : ''"
-			:enter-from-class="$store.state.animation ? $style.transition_toggle_enterFrom : ''"
-			:leave-to-class="$store.state.animation ? $style.transition_toggle_leaveTo : ''"
-			@enter="enter"
-			@after-enter="afterEnter"
-			@leave="leave"
-			@after-leave="afterLeave"
-		>
-			<KeepAlive>
-				<div v-show="opened">
-					<MkSpacer :margin-min="14" :margin-max="22">
-						<slot></slot>
-					</MkSpacer>
-				</div>
-			</KeepAlive>
-		</Transition>
-	</div>
+	</MkStickyContainer>
 </div>
 </template>
 
@@ -117,12 +122,6 @@ onMounted(() => {
 
 .root {
 	display: block;
-
-	&.opened {
-		> .header {
-			border-radius: 6px 6px 0 0;
-		}
-	}
 }
 
 .header {
@@ -132,6 +131,8 @@ onMounted(() => {
 	box-sizing: border-box;
 	padding: 9px 12px 9px 12px;
 	background: var(--buttonBg);
+	-webkit-backdrop-filter: var(--blur, blur(15px));
+	backdrop-filter: var(--blur, blur(15px));
 	border-radius: 6px;
 	transition: border-radius 0.3s;
 
@@ -144,6 +145,10 @@ onMounted(() => {
 		color: var(--accent);
 		background: var(--buttonHoverBg);
 	}
+
+	&.opened {
+		border-radius: 6px 6px 0 0;
+	}
 }
 
 .headerUpper {
@@ -153,7 +158,7 @@ onMounted(() => {
 
 .headerLower {
 	color: var(--fgTransparentWeak);
-    font-size: .85em;
+	font-size: .85em;
 	padding-left: 4px;
 }
 
@@ -202,7 +207,6 @@ onMounted(() => {
 	background: var(--panel);
 	border-radius: 0 0 6px 6px;
 	container-type: inline-size;
-	overflow: auto;
 
 	&.bgSame {
 		background: var(--bg);
diff --git a/packages/frontend/src/components/MkPagination.vue b/packages/frontend/src/components/MkPagination.vue
index 378d0ac020..a1a61a6fd6 100644
--- a/packages/frontend/src/components/MkPagination.vue
+++ b/packages/frontend/src/components/MkPagination.vue
@@ -21,14 +21,14 @@
 
 	<div v-else ref="rootEl">
 		<div v-show="pagination.reversed && more" key="_more_" class="_margin">
-			<MkButton v-if="!moreFetching" v-appear="(enableInfiniteScroll && !props.disableAutoLoad) ? fetchMoreAhead : null" :class="$style.more" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMoreAhead">
+			<MkButton v-if="!moreFetching" v-appear="(enableInfiniteScroll && !props.disableAutoLoad) ? fetchMoreAhead : null" :class="$style.more" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary rounded @click="fetchMoreAhead">
 				{{ i18n.ts.loadMore }}
 			</MkButton>
 			<MkLoading v-else class="loading"/>
 		</div>
 		<slot :items="items" :fetching="fetching || moreFetching"></slot>
 		<div v-show="!pagination.reversed && more" key="_more_" class="_margin">
-			<MkButton v-if="!moreFetching" v-appear="(enableInfiniteScroll && !props.disableAutoLoad) ? fetchMore : null" :class="$style.more" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary @click="fetchMore">
+			<MkButton v-if="!moreFetching" v-appear="(enableInfiniteScroll && !props.disableAutoLoad) ? fetchMore : null" :class="$style.more" :disabled="moreFetching" :style="{ cursor: moreFetching ? 'wait' : 'pointer' }" primary rounded @click="fetchMore">
 				{{ i18n.ts.loadMore }}
 			</MkButton>
 			<MkLoading v-else class="loading"/>
diff --git a/packages/frontend/src/components/MkPostForm.vue b/packages/frontend/src/components/MkPostForm.vue
index 2b3e2c8646..09f672be7b 100644
--- a/packages/frontend/src/components/MkPostForm.vue
+++ b/packages/frontend/src/components/MkPostForm.vue
@@ -658,7 +658,14 @@ async function post(ev?: MouseEvent) {
 			if ((text.includes('love') || text.includes('❤')) && text.includes('misskey')) {
 				claimAchievement('iLoveMisskey');
 			}
-			if (text.includes('Efrlqw8ytg4'.toLowerCase()) || text.includes('XVCwzwxdHuA'.toLowerCase())) {
+			if (
+				text.includes('https://youtu.be/Efrlqw8ytg4'.toLowerCase()) ||
+				text.includes('https://www.youtube.com/watch?v=Efrlqw8ytg4'.toLowerCase()) ||
+				text.includes('https://m.youtube.com/watch?v=Efrlqw8ytg4'.toLowerCase()) ||
+				text.includes('https://youtu.be/XVCwzwxdHuA'.toLowerCase()) ||
+				text.includes('https://www.youtube.com/watch?v=XVCwzwxdHuA'.toLowerCase()) ||
+				text.includes('https://m.youtube.com/watch?v=XVCwzwxdHuA'.toLowerCase())
+			) {
 				claimAchievement('brainDiver');
 			}
 
diff --git a/packages/frontend/src/components/MkSignup.vue b/packages/frontend/src/components/MkSignup.vue
index d8703a0b1b..62ada6b736 100644
--- a/packages/frontend/src/components/MkSignup.vue
+++ b/packages/frontend/src/components/MkSignup.vue
@@ -9,6 +9,7 @@
 		<template #prefix>@</template>
 		<template #suffix>@{{ host }}</template>
 		<template #caption>
+			<div><i class="ti ti-alert-triangle ti-fw"></i> {{ i18n.ts.cannotBeChangedLater }}</div>
 			<span v-if="usernameState === 'wait'" style="color:#999"><MkLoading :em="true"/> {{ i18n.ts.checking }}</span>
 			<span v-else-if="usernameState === 'ok'" style="color: var(--success)"><i class="ti ti-check ti-fw"></i> {{ i18n.ts.available }}</span>
 			<span v-else-if="usernameState === 'unavailable'" style="color: var(--error)"><i class="ti ti-alert-triangle ti-fw"></i> {{ i18n.ts.unavailable }}</span>
diff --git a/packages/frontend/src/components/form/section.vue b/packages/frontend/src/components/form/section.vue
index a838164978..55308b9c80 100644
--- a/packages/frontend/src/components/form/section.vue
+++ b/packages/frontend/src/components/form/section.vue
@@ -1,7 +1,7 @@
 <template>
-<div class="vrtktovh" :class="{ first }">
-	<div class="label"><slot name="label"></slot></div>
-	<div class="main">
+<div :class="[$style.root, { [$style.rootFirst]: first }]">
+	<div :class="[$style.label, { [$style.labelFirst]: first }]"><slot name="label"></slot></div>
+	<div :class="$style.main">
 		<slot></slot>
 	</div>
 </div>
@@ -13,31 +13,31 @@ defineProps<{
 }>();
 </script>
 
-<style lang="scss" scoped>
-.vrtktovh {
+<style lang="scss" module>
+.root {
 	border-top: solid 0.5px var(--divider);
 	//border-bottom: solid 0.5px var(--divider);
+}
 
-	> .label {
-		font-weight: bold;
-		padding: 1.5em 0 0 0;
-		margin: 0 0 16px 0;
+.rootFirst {
+	border-top: none;
+}
 
-		&:empty {
-			display: none;
-		}
-	}
+.label {
+	font-weight: bold;
+	padding: 1.5em 0 0 0;
+	margin: 0 0 16px 0;
 
-	> .main {
-		margin: 1.5em 0 0 0;
+	&:empty {
+		display: none;
 	}
+}
 
-	&.first {
-		border-top: none;
+.labelFirst {
+	padding-top: 0;
+}
 
-		> .label {
-			padding-top: 0;
-		}
-	}
+.main {
+	margin: 1.5em 0 0 0;
 }
 </style>