| | |
| | | <template> |
| | | <footer> |
| | | <footer class="pam-footer"> |
| | | <nav class="pam-footer-nav"> |
| | | <ul class="pam-footer-nav__list"> |
| | | <li |
| | | v-for="(navItem, index) in footerNavList" |
| | | :key="index" |
| | | class="pam-footer-nav__item"> |
| | | {{ navItem.label }}<span class="pl-10" v-if="index !== footerNavList.length - 1"> | </span> |
| | | <a :href="navItem.url" target="_blank"> |
| | | {{ navItem.label }} |
| | | </a> |
| | | <span class="pl-10 pam-footer-nav__item-pipe" |
| | | v-if="index !== footerNavList.length - 1"> | </span> |
| | | </li> |
| | | </ul> |
| | | </nav> |
| | |
| | | export default class UiCarousel extends Vue { |
| | | |
| | | footerNavList: FooterNavItem[] = [ |
| | | { label: '網站綜合聲明', url: '/'}, |
| | | { label: '金融友善服務專區', url: '/'}, |
| | | { label: '法令宣導', url: '/'}, |
| | | { label: '保險委外作業說明', url: '/'}, |
| | | { label: 'GDPR隱私權告知事項', url: '/'}, |
| | | { label: '網站綜合聲明', url: 'https://www.pcalife.com.tw/zh/disclaimer/'}, |
| | | { label: '金融友善服務專區', url: 'https://www.pcalife.com.tw/zh/financial-friendly/'}, |
| | | { label: '法令宣導', url: 'https://www.pcalife.com.tw/zh/law-advocacy/'}, |
| | | { label: '保險委外作業說明', url: 'https://www.pcalife.com.tw/zh/outsourcing-notice/'}, |
| | | { label: 'GDPR隱私權告知事項', url: 'https://www.pcalife.com.tw/zh/gdpr-privacy-notice/'}, |
| | | ]; |
| | | |
| | | } |
| | |
| | | </script> |
| | | |
| | | <style lang="scss" scoped> |
| | | footer { |
| | | .pam-footer { |
| | | border-top: 1px solid #CCCCCC; |
| | | background-color: $PRIMARY_WHITE; |
| | | .pam-footer-nav { |
| | |
| | | @extend .text--bold; |
| | | @extend .text--dark-blue; |
| | | @extend .cursor--pointer; |
| | | a, a:hover, a:focus, a:active { |
| | | text-decoration: none; |
| | | color: inherit; |
| | | } |
| | | &:nth-of-type(3) { |
| | | .pam-footer-nav__item-pipe { |
| | | display: none; |
| | | @include desktop() { |
| | | display: inline; |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |
| | | } |