gancio-upstream/layouts/default.vue

<template lang='pug'>
  el-container#main(:class='{dark: $route.name==="index"}')
    el-dialog.followDialog(:visible.sync='showFollowMe')
      h4(slot='title') {{$t('common.follow_me_title')}}
      FollowMe

    el-backtop
    el-header#header
      Nav
    #content
      nuxt
    el-footer#footer
      .row
        .col.col-7
          small <a href='https://gancio.org'>Gancio {{settings.version}}</a>
        .col#links
          a(rel='me' :href='settings.baseurl' @click.prevent='showFollowMe=true') follow me
          nuxt-link(to='/about') about
          a(href='https://gancio.org') docs
          a(href='https://blog.gancio.org') blog
          a(href='https://framagit.org/les/gancio') source

</template>
<script>
import Nav from '~/components/Nav.vue'
import { mapState } from 'vuex'
import FollowMe from '../pages/event/followMe'

export default {
  components: { Nav, FollowMe },
  data () {
    return { showFollowMe: false }
  },
  computed: mapState(['settings'])
}
</script>
<style lang='less'>
#footer {
  a {
    font-size: 1.1em;
    &:hover {
      border-bottom: 1px solid yellow;
    }
  }
}
</style>