mirror of
https://github.com/paricafe/misskey.git
synced 2024-11-24 14:06:44 -06:00
🎨
This commit is contained in:
parent
a35fe29ef4
commit
e6e5bf1da4
3 changed files with 38 additions and 2 deletions
32
packages/frontend/src/components/global/MkFooterSpacer.vue
Normal file
32
packages/frontend/src/components/global/MkFooterSpacer.vue
Normal file
|
@ -0,0 +1,32 @@
|
|||
<!--
|
||||
SPDX-FileCopyrightText: syuilo and other misskey contributors
|
||||
SPDX-License-Identifier: AGPL-3.0-only
|
||||
-->
|
||||
|
||||
<template>
|
||||
<div :class="[$style.spacer, defaultStore.reactiveState.darkMode ? $style.dark : $style.light]"></div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { defaultStore } from '@/store.js';
|
||||
</script>
|
||||
|
||||
<style lang="scss" module>
|
||||
.spacer {
|
||||
box-sizing: border-box;
|
||||
padding: 32px;
|
||||
margin: 0 auto;
|
||||
height: 300px;
|
||||
background-clip: content-box;
|
||||
background-size: auto auto;
|
||||
background-color: rgba(255, 255, 255, 0);
|
||||
|
||||
&.light {
|
||||
background-image: repeating-linear-gradient(135deg, transparent, transparent 16px, #00000026 16px, #00000026 20px );
|
||||
}
|
||||
|
||||
&.dark {
|
||||
background-image: repeating-linear-gradient(135deg, transparent, transparent 16px, #FFFFFF16 16px, #FFFFFF16 20px );
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -5,7 +5,7 @@
|
|||
|
||||
import { App } from 'vue';
|
||||
|
||||
import Mfm from './global/MkMisskeyFlavoredMarkdown.ts';
|
||||
import Mfm from './global/MkMisskeyFlavoredMarkdown.js';
|
||||
import MkA from './global/MkA.vue';
|
||||
import MkAcct from './global/MkAcct.vue';
|
||||
import MkAvatar from './global/MkAvatar.vue';
|
||||
|
@ -16,13 +16,14 @@ import MkUserName from './global/MkUserName.vue';
|
|||
import MkEllipsis from './global/MkEllipsis.vue';
|
||||
import MkTime from './global/MkTime.vue';
|
||||
import MkUrl from './global/MkUrl.vue';
|
||||
import I18n from './global/i18n';
|
||||
import I18n from './global/i18n.js';
|
||||
import RouterView from './global/RouterView.vue';
|
||||
import MkLoading from './global/MkLoading.vue';
|
||||
import MkError from './global/MkError.vue';
|
||||
import MkAd from './global/MkAd.vue';
|
||||
import MkPageHeader from './global/MkPageHeader.vue';
|
||||
import MkSpacer from './global/MkSpacer.vue';
|
||||
import MkFooterSpacer from './global/MkFooterSpacer.vue';
|
||||
import MkStickyContainer from './global/MkStickyContainer.vue';
|
||||
|
||||
export default function(app: App) {
|
||||
|
@ -50,6 +51,7 @@ export const components = {
|
|||
MkAd: MkAd,
|
||||
MkPageHeader: MkPageHeader,
|
||||
MkSpacer: MkSpacer,
|
||||
MkFooterSpacer: MkFooterSpacer,
|
||||
MkStickyContainer: MkStickyContainer,
|
||||
};
|
||||
|
||||
|
@ -73,6 +75,7 @@ declare module '@vue/runtime-core' {
|
|||
MkAd: typeof MkAd;
|
||||
MkPageHeader: typeof MkPageHeader;
|
||||
MkSpacer: typeof MkSpacer;
|
||||
MkFooterSpacer: typeof MkFooterSpacer;
|
||||
MkStickyContainer: typeof MkStickyContainer;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -23,6 +23,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
|||
</div>
|
||||
</div>
|
||||
</MkSpacer>
|
||||
<MkFooterSpacer/>
|
||||
</mkstickycontainer>
|
||||
</template>
|
||||
|
||||
|
|
Loading…
Reference in a new issue