121 lines
2.0 KiB
Vue
121 lines
2.0 KiB
Vue
<template>
|
|
<div id="footer-container">
|
|
<IntegratedLayout>
|
|
<div class="container">
|
|
<div class="left-container">
|
|
<img src="/logo/logo-rect.png" alt="" />
|
|
<span>AIProdLaunch</span>
|
|
</div>
|
|
<div class="right-container">
|
|
<div>
|
|
<img src="/logo/bottom-logo.png" alt="" />
|
|
</div>
|
|
<div class="navigation-bottom">
|
|
<span v-for="item in first">
|
|
{{item.name}}
|
|
</span>
|
|
</div>
|
|
<div class="navigation-bottom">
|
|
<span v-for="item in two" @click="goto(item.path)">
|
|
{{item.name}}
|
|
</span>
|
|
</div>
|
|
<div class="bottom-span">
|
|
All rights reserved ©2025 AIToolsFinder.
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</IntegratedLayout>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: "Footer",
|
|
data() {
|
|
return {
|
|
first: [{
|
|
name: 'Home'
|
|
},
|
|
{
|
|
name: 'AI Daily News'
|
|
},
|
|
{
|
|
name: 'AI Hub'
|
|
},
|
|
{
|
|
name: 'Learn'
|
|
},
|
|
{
|
|
name: 'About Us'
|
|
}
|
|
],
|
|
two: [{
|
|
name: 'Privacy Policy',
|
|
path: '/privacy'
|
|
},
|
|
{
|
|
name: 'Terms Of Service',
|
|
path: '/service'
|
|
},
|
|
]
|
|
}
|
|
},
|
|
methods: {
|
|
goto(path) {
|
|
this.$router.push(path)
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
#footer-container {
|
|
width: 100%;
|
|
height: $footerBarHeight;
|
|
|
|
.container {
|
|
height: $footerBarHeight;
|
|
width: 100%;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
|
|
}
|
|
}
|
|
|
|
.left-container {
|
|
@include flex-center;
|
|
flex-direction: column;
|
|
|
|
span {
|
|
font-size: $larg-font-size;
|
|
color: $main-color;
|
|
font-weight: bold;
|
|
font-family: 'Poppins-Bold', serif;
|
|
}
|
|
}
|
|
|
|
.right-container {
|
|
text-align: right;
|
|
}
|
|
|
|
.bottom-span {
|
|
color: $grey-color;
|
|
font-family: 'Poppins-Regular', serif;
|
|
}
|
|
|
|
.navigation-bottom {
|
|
span {
|
|
display: inline-block;
|
|
padding: 14px;
|
|
font-family: 'Poppins-Medium', serif;
|
|
cursor: pointer;
|
|
}
|
|
|
|
span:last-child {
|
|
padding-right: 0;
|
|
}
|
|
}
|
|
</style>
|