117 lines
2.8 KiB
Vue
117 lines
2.8 KiB
Vue
<template>
|
|
<div class="site-map">
|
|
<OthersHeader :title="$t('MainFooter.SiteMap')" />
|
|
<div class="content">
|
|
<div>
|
|
<div>
|
|
<router-link to="/about-us"
|
|
><h3>{{ $t('MainHeader.AboutUs') }}</h3></router-link
|
|
>
|
|
</div>
|
|
<div>
|
|
<router-link to="/our-solutions"
|
|
><h3>{{ $t('MainHeader.OurSolutions') }}</h3></router-link
|
|
>
|
|
<router-link to="/aida">{{ $t('MainHeader.AiDA') }}</router-link>
|
|
<router-link to="/mixi">{{ $t('MainHeader.Mixi') }}</router-link>
|
|
</div>
|
|
<div>
|
|
<router-link to="#"
|
|
><h3>{{ $t('MainHeader.Communities') }}</h3></router-link
|
|
>
|
|
<router-link to="/events">{{ $t('MainHeader.Events') }}</router-link>
|
|
<router-link to="/user-stories">{{ $t('MainHeader.UserStories') }}</router-link>
|
|
<router-link to="/help-centre">{{ $t('MainHeader.HelpCentre') }}</router-link>
|
|
</div>
|
|
</div>
|
|
<div>
|
|
<div>
|
|
<router-link to="/contact-us"
|
|
><h3>{{ $t('MainHeader.ContactUs') }}</h3></router-link
|
|
>
|
|
</div>
|
|
<div>
|
|
<router-link to="/media"
|
|
><h3>{{ $t('MainHeader.Media') }}</h3></router-link
|
|
>
|
|
</div>
|
|
<div>
|
|
<router-link to="#"
|
|
><h3>{{ $t('MainFooter.Others') }}</h3></router-link
|
|
>
|
|
<router-link to="/privacy-policy">{{
|
|
$t('MainFooter.PrivacyPolicy')
|
|
}}</router-link>
|
|
<router-link to="/terms-of-use">{{ $t('MainFooter.TermsOfUse') }}</router-link>
|
|
<router-link to="/disclaimer">{{ $t('MainFooter.Disclaimer') }}</router-link>
|
|
<router-link to="/site-map">{{ $t('MainFooter.SiteMap') }}</router-link>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
<script setup lang="ts">
|
|
import { useHead } from '@unhead/vue'
|
|
import { useI18n } from 'vue-i18n'
|
|
const { t } = useI18n()
|
|
import { computed, ref } from 'vue'
|
|
import OthersHeader from './others-header.vue'
|
|
useHead({
|
|
title: t('MainFooter.SiteMap') + ' - Code-Create'
|
|
})
|
|
</script>
|
|
|
|
<style scoped lang="less">
|
|
.site-map {
|
|
border-top: var(--main-header-height) solid #000;
|
|
background-color: #f9f9f9;
|
|
> .content {
|
|
max-width: 1230px;
|
|
width: 100%;
|
|
margin: 0 auto;
|
|
padding: 25px 15px 80px;
|
|
display: flex;
|
|
> div {
|
|
flex: 1;
|
|
padding: 10px 40px;
|
|
> div {
|
|
margin-bottom: 20px;
|
|
display: flex;
|
|
flex-direction: column;
|
|
&:last-child {
|
|
margin-bottom: 0;
|
|
}
|
|
a {
|
|
color: #888;
|
|
font-size: 16px;
|
|
text-decoration: none;
|
|
padding: 8px 0;
|
|
transition: all 0.3s ease-in-out;
|
|
&:hover {
|
|
color: #222;
|
|
}
|
|
}
|
|
h3 {
|
|
padding: 2px 0;
|
|
color: #000;
|
|
font-size: 20px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
@media (max-width: 800px) {
|
|
> .content {
|
|
flex-direction: column;
|
|
padding: 70px 90px;
|
|
> div {
|
|
padding: 0;
|
|
margin-bottom: 30px;
|
|
> div {
|
|
margin-bottom: 30px;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
}
|
|
</style>
|