| 1 | <template lang="pug"> |
| 2 | #app |
| 3 | // modal "welcome" will be filled in the selected language |
| 4 | #modalWelcome |
| 5 | Language |
| 6 | Settings(:settings="settings") |
| 7 | ContactForm |
| 8 | .container |
| 9 | .row(v-show="$route.path == '/'") |
| 10 | // Header (on index only) |
| 11 | header |
| 12 | .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2 |
| 13 | header |
| 14 | img(src="./assets/images/index/unicorn.svg") |
| 15 | .info-container |
| 16 | p vchess.club {{ $lang }} |
| 17 | img(src="./assets/images/index/wildebeest.svg") |
| 18 | .row |
| 19 | // Menu (top of page): TODO how to organize it ? |
| 20 | nav |
| 21 | router-link(to="/") Home |
| 22 | | | |
| 23 | router-link(to="/about") About |
| 24 | | | |
| 25 | router-link(to="/test") Test |
| 26 | router-view |
| 27 | </template> |
| 28 | |
| 29 | <script> |
| 30 | // See https://stackoverflow.com/a/35417159 |
| 31 | import ContactForm from "@/components/ContactForm.vue"; |
| 32 | import Language from "@/components/Language.vue"; |
| 33 | import Settings from "@/components/Settings.vue"; |
| 34 | export default { |
| 35 | data: function() { |
| 36 | return { |
| 37 | settings: {}, //TODO |
| 38 | }; |
| 39 | }, |
| 40 | components: { |
| 41 | ContactForm, |
| 42 | Language, |
| 43 | Settings, |
| 44 | }, |
| 45 | }; |
| 46 | </script> |
| 47 | |
| 48 | <style lang="sass"> |
| 49 | #app |
| 50 | font-family: "Avenir", Helvetica, Arial, sans-serif |
| 51 | -webkit-font-smoothing: antialiased |
| 52 | -moz-osx-font-smoothing: grayscale |
| 53 | text-align: center |
| 54 | color: #2c3e50 |
| 55 | |
| 56 | #nav |
| 57 | padding: 30px |
| 58 | a |
| 59 | font-weight: bold |
| 60 | color: #2c3e50 |
| 61 | &.router-link-exact-active |
| 62 | color: #42b983 |
| 63 | </style> |