enhance(frontend): 설정 페이지의 하단 여백 디자인을 조정함

CHANGELOG_CHERRYPICK.md

@@ -75,6 +75,7 @@ Misskey의 전체 변경 사항을 확인하려면, [CHANGELOG.md#2024xx](CHANGE
 - Enhance: 갤러리를 노트로 공유할 때 노트 내용에 줄바꿈을 적용함
 - Enhance: 의도하지 않게 `검색`으로 검색할 수 있었던 부분을 개선함
 	- 이제 노트에서 검색 블록을 활성화 하려면 `[검색]`으로만 사용할 수 있습니다.
+- Enhance: 설정 페이지의 하단 여백 디자인을 조정함
 - Fix: 환경설정 백업 시 일부 설정이 누락되어 백업될 수 있음
 - Fix: 이미지 자르기를 할 때 이미지 크기 전체를 표시하지 못할 수 있음
 - Fix: 페이지에서 페이지 생성 버튼이 본문에 중복으로 표시됨

packages/frontend/src/components/global/MkFooterSpacer.vue

@@ -4,11 +4,15 @@ SPDX-License-Identifier: AGPL-3.0-only
 -->
 
 <template>
-<div :class="[$style.spacer, defaultStore.reactiveState.darkMode.value ? $style.dark : $style.light]"></div>
+<div :class="[$style.spacer, defaultStore.reactiveState.darkMode.value && !disableBackground ? $style.dark : !disableBackground ? $style.light : '']"></div>
 </template>
 
 <script lang="ts" setup>
 import { defaultStore } from '@/store.js';
+
+const props = defineProps<{
+	disableBackground?: boolean;
+}>();
 </script>
 
 <style lang="scss" module>

packages/frontend/src/pages/settings/index.vue

@@ -23,7 +23,7 @@ SPDX-License-Identifier: AGPL-3.0-only
 			</div>
 		</div>
 	</MkSpacer>
-	<MkFooterSpacer/>
+	<MkFooterSpacer disableBackground/>
 </MkStickyContainer>
 </template>