aboutsummaryrefslogtreecommitdiffstatshomepage
path: root/docs/components/app/AppFooter.vue
diff options
context:
space:
mode:
Diffstat (limited to 'docs/components/app/AppFooter.vue')
-rw-r--r--docs/components/app/AppFooter.vue163
1 files changed, 0 insertions, 163 deletions
diff --git a/docs/components/app/AppFooter.vue b/docs/components/app/AppFooter.vue
deleted file mode 100644
index 84266eb..0000000
--- a/docs/components/app/AppFooter.vue
+++ /dev/null
@@ -1,163 +0,0 @@
-<script setup lang="ts">
-const { config } = useDocus()
-const socialIcons = ref(null)
-const icons = computed(() => config.value?.footer?.iconLinks || [])
-const textLinks = computed(() => config.value?.footer?.textLinks || [])
-const socialIconsCount = computed(() => Object.entries(config.value?.socials || {}).filter(([_, v]) => v).length)
-const nbSocialIcons = computed(() => (socialIcons.value ? socialIconsCount.value : 0))
-</script>
-
-<template>
- <footer>
- <Container :fluid="config?.footer?.fluid" padded class="footer-container">
- <!-- Left -->
- <div class="left">
- <a v-if="config?.footer?.credits" :href="config?.footer?.credits?.href || '#'" rel="noopener" target="_blank">
- <Component :is="config?.footer?.credits?.icon" v-if="config?.footer?.credits?.icon" class="left-icon" />
- <p v-if="config?.footer?.credits?.text">{{ config.footer.credits.text }}</p>
- </a>
- </div>
-
- <!-- Center -->
- <div class="center">
- <NuxtLink
- v-for="link in textLinks"
- :key="link.href"
- class="text-link"
- :aria-label="link.text"
- :href="link.href"
- :target="link.target || '_self'"
- >
- {{ link.text }}
- </NuxtLink>
- </div>
-
- <div class="right">
- <a
- v-for="icon in icons.slice(0, 6 - nbSocialIcons)"
- :key="icon.label"
- class="icon-link"
- rel="noopener"
- :aria-label="icon.label"
- :href="icon.href"
- target="_blank"
- >
- <Icon :name="icon.icon" />
- </a>
- <AppSocialIcons ref="socialIcons" />
- </div>
- </Container>
- </footer>
-</template>
-
-<style lang="ts" scoped>
-css({
- footer: {
- display: 'flex',
- minHeight: '{docus.footer.height}',
- borderTopWidth: '1px',
- borderTopStyle: 'solid',
- borderTopColor: '{elements.border.primary.static}',
- padding: '{docus.footer.padding}',
-
- '.footer-container': {
- display: 'grid',
- gridTemplateColumns: 'repeat(12, minmax(0, 1fr))',
- justifyItems: 'center',
- gap: '{space.2}',
- '@sm': {
- justifyItems: 'legacy',
-
- },
-
- ':deep(.icon)': {
- width: '{space.4}',
- height: '{space.4}'
- },
-
- a: {
- color: '{color.gray.500}',
- '@dark': {
- color: '{color.gray.400}'
- },
- '&:hover': {
- color: '{color.gray.700}',
- '@dark': {
- color: '{color.gray.200}',
- }
- },
- },
-
- '.left': {
- gridColumn: 'span 12 / span 12',
- display: 'flex',
- py: '{space.4}',
- order: 1,
-
- '@sm': {
- gridColumn: 'span 3 / span 3',
- order: 0,
- },
-
- a: {
- display: 'flex',
- alignItems: 'center',
- },
-
- p: {
- fontSize: '{text.xs.fontSize}',
- lineHeight: '{text.xs.lineHeight}',
- fontWeight: '{fontWeight.medium}'
- },
-
- '&-icon': {
- flexShrink: 0,
- width: '{space.4}',
- height: '{space.4}',
- fill: 'currentcolor',
- marginRight: '{space.2}',
- },
- },
-
- '.center': {
- gridColumn: 'span 12 / span 12',
- display: 'flex',
- flexDirection: 'column',
- alignItems: 'center',
-
- '@sm': {
- gridColumn: 'span 6 / span 6',
- flexDirection: 'row',
- justifyContent: 'center',
- },
-
- '.text-link': {
- padding: '{space.2}',
- fontSize: '{text.sm.fontSize}',
- lineHeight: '{text.sm.lineHeight}',
- fontWeight: '{fontWeight.medium}'
- }
-
- },
-
- '.right': {
- gridColumn: 'span 12 / span 12',
- display: 'flex',
- alignItems: 'center',
- justifyContent: 'flex-end',
- // marginLeft: 'calc(0px - {space.4})',
-
- '@sm': {
- gridColumn: 'span 3 / span 3',
- marginRight: 'calc(0px - {space.4})',
- },
-
- '.icon-link': {
- display: 'flex',
- padding: '{space.4}'
- }
- },
- },
- }
-})
-</style>