
<template>
  <div id="app">
    <header>
<a class="simple" href="/"><img width="80px" src="./assets/juneland.svg" alt="infojune"></a><h2>Infojune</h2>
</header>
       <router-view></router-view>
       <footer><a class="button" href="/don">DONNER AU SITE INFOJUNE.FR</a> Crée et hébergé par <a class="link" href="https://lelibreauquotidien.fr">llaq</a> - <a class="link" href="https://git.p2p.legal/llaq/infojune">Disponible sous CC-BY-NC-SA</a></footer>
  </div>
</template>

<script>
export default {
  name: 'app',
  components: {
  },
  data: function(){
    return{
    }
  }
}
</script>

<style>
body{
  height:100%;
  position: relative;
}
footer{
position: absolute;
bottom: 0;
height:1px;
}
header{
display: flex;
flex-direction: row;
align-items:center;
justify-content: center;

}
#app {
  display:flex;
  flex-direction: column;
  min-height: 100%;
}
.col{
  display: flex;
  flex-direction: row;
}
@media only screen and (max-width: 460px) {
footer{
  display: flex;
  flex-direction: row;
  align-items:center;
  justify-content: center;
  flex-wrap: wrap;

  }
}

</style>
