53 lines
956 B
Vue
53 lines
956 B
Vue
<template>
|
|
<footer class="my-footer">
|
|
<nuxt-link
|
|
v-for="item in $options.items"
|
|
class="my-footer__link underlined-link"
|
|
:key="item.label"
|
|
:to="item.to"
|
|
@click.native.passive="open = false"
|
|
>
|
|
{{ item.label }}
|
|
</nuxt-link>
|
|
</footer>
|
|
</template>
|
|
|
|
<style lang="scss">
|
|
@use "~@/assets/styles/screenSize";
|
|
@use "~@/assets/styles/colors";
|
|
|
|
.my-footer {
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
|
|
width: 100vw;
|
|
height: 100px;
|
|
}
|
|
|
|
.my-footer__link:not(:last-child) {
|
|
margin-right: 20px;
|
|
}
|
|
|
|
@include screenSize.mobile {
|
|
|
|
.my-footer {
|
|
flex-direction: column;
|
|
margin-bottom: 10px;
|
|
}
|
|
|
|
.my-footer__link:not(:last-child) {
|
|
margin-right: 0;
|
|
margin-bottom: 10px;
|
|
}
|
|
}
|
|
</style>
|
|
|
|
<script>
|
|
import { footerItems } from "@/assets/js/footerItems";
|
|
|
|
export default {
|
|
name: "MyFooter",
|
|
items: footerItems
|
|
};
|
|
</script>
|