mirror of
https://activitypub.software/TransFem-org/Sharkey
synced 2024-11-25 15:35:12 +00: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 { App } from 'vue';
|
||||||
|
|
||||||
import Mfm from './global/MkMisskeyFlavoredMarkdown.ts';
|
import Mfm from './global/MkMisskeyFlavoredMarkdown.js';
|
||||||
import MkA from './global/MkA.vue';
|
import MkA from './global/MkA.vue';
|
||||||
import MkAcct from './global/MkAcct.vue';
|
import MkAcct from './global/MkAcct.vue';
|
||||||
import MkAvatar from './global/MkAvatar.vue';
|
import MkAvatar from './global/MkAvatar.vue';
|
||||||
|
@ -16,13 +16,14 @@ import MkUserName from './global/MkUserName.vue';
|
||||||
import MkEllipsis from './global/MkEllipsis.vue';
|
import MkEllipsis from './global/MkEllipsis.vue';
|
||||||
import MkTime from './global/MkTime.vue';
|
import MkTime from './global/MkTime.vue';
|
||||||
import MkUrl from './global/MkUrl.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 RouterView from './global/RouterView.vue';
|
||||||
import MkLoading from './global/MkLoading.vue';
|
import MkLoading from './global/MkLoading.vue';
|
||||||
import MkError from './global/MkError.vue';
|
import MkError from './global/MkError.vue';
|
||||||
import MkAd from './global/MkAd.vue';
|
import MkAd from './global/MkAd.vue';
|
||||||
import MkPageHeader from './global/MkPageHeader.vue';
|
import MkPageHeader from './global/MkPageHeader.vue';
|
||||||
import MkSpacer from './global/MkSpacer.vue';
|
import MkSpacer from './global/MkSpacer.vue';
|
||||||
|
import MkFooterSpacer from './global/MkFooterSpacer.vue';
|
||||||
import MkStickyContainer from './global/MkStickyContainer.vue';
|
import MkStickyContainer from './global/MkStickyContainer.vue';
|
||||||
|
|
||||||
export default function(app: App) {
|
export default function(app: App) {
|
||||||
|
@ -50,6 +51,7 @@ export const components = {
|
||||||
MkAd: MkAd,
|
MkAd: MkAd,
|
||||||
MkPageHeader: MkPageHeader,
|
MkPageHeader: MkPageHeader,
|
||||||
MkSpacer: MkSpacer,
|
MkSpacer: MkSpacer,
|
||||||
|
MkFooterSpacer: MkFooterSpacer,
|
||||||
MkStickyContainer: MkStickyContainer,
|
MkStickyContainer: MkStickyContainer,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
@ -73,6 +75,7 @@ declare module '@vue/runtime-core' {
|
||||||
MkAd: typeof MkAd;
|
MkAd: typeof MkAd;
|
||||||
MkPageHeader: typeof MkPageHeader;
|
MkPageHeader: typeof MkPageHeader;
|
||||||
MkSpacer: typeof MkSpacer;
|
MkSpacer: typeof MkSpacer;
|
||||||
|
MkFooterSpacer: typeof MkFooterSpacer;
|
||||||
MkStickyContainer: typeof MkStickyContainer;
|
MkStickyContainer: typeof MkStickyContainer;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -23,6 +23,7 @@ SPDX-License-Identifier: AGPL-3.0-only
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</MkSpacer>
|
</MkSpacer>
|
||||||
|
<MkFooterSpacer/>
|
||||||
</mkstickycontainer>
|
</mkstickycontainer>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
|
|
Loading…
Reference in a new issue