Saving state (broken as usual)
[vchess.git] / client / src / App.vue
CommitLineData
625022fd 1<template lang="pug">
98db2082
BA
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
ee37e2af
BA
13 img(src="./assets/images/index/unicorn.svg")
14 .info-container
15 p vchess.club {{ $lang }}
16 img(src="./assets/images/index/wildebeest.svg")
98db2082 17 .row
ee37e2af
BA
18 // Menu (top of page):
19 // shared: Home + flags, userMenu
20 // variant: hall, problems, rules, my games + settings
21 nav
22 label.drawer-toggle(for="drawerControl")
23 input#drawerControl.drawer(type="checkbox")
24 #menuBar
25 label.drawer-close(for="drawerControl")
26 router-link(v-if="$route.path != '/'" to="/")
27 | Home
28 router-link(:href="getLink('/hall')")
29 | getLink function : suffix ==> /variant + suffix
30 =translations["Hall"]
31 router-link(href="#tabGames")
32 =translations["My games"]
33 router-link(href="#rules")
34 =translations["Rules"]
35 router-link(href="#problems")
36 =translations["Problems"]
37 #userMenu.clickable.right-menu(onClick="doClick('modalUser')")
38 .info-container
39 if !user.email
40 p
41 span Login
42 span.icon-user
43 else
44 p
45 span Update
46 span.icon-user
47 #flagMenu.clickable.right-menu(onClick="doClick('modalLang')")
48 img(src="/images/flags/" + lang + ".svg")
49 #settings.clickable(v-show="display!='index'" onClick="doClick('modalSettings')")
50 i(data-feather="settings")
98db2082 51 router-view
ee37e2af
BA
52 .row
53 footer
54 .col-sm-12.col-md-10.col-md-offset-1.col-lg-8.col-lg-offset-2.text-center
55 a(href="https://github.com/yagu0/vchess") Source code
56 p.clickable(onClick="doClick('modalContact')")
57 = translations["Contact form"]
625022fd
BA
58</template>
59
98db2082
BA
60<script>
61// See https://stackoverflow.com/a/35417159
62import ContactForm from "@/components/ContactForm.vue";
63import Language from "@/components/Language.vue";
64import Settings from "@/components/Settings.vue";
65export default {
66 data: function() {
67 return {
68 settings: {}, //TODO
69 };
70 },
71 components: {
72 ContactForm,
73 Language,
74 Settings,
75 },
76};
77</script>
78
625022fd
BA
79<style lang="sass">
80#app
81 font-family: "Avenir", Helvetica, Arial, sans-serif
82 -webkit-font-smoothing: antialiased
83 -moz-osx-font-smoothing: grayscale
84 text-align: center
85 color: #2c3e50
86
87#nav
88 padding: 30px
89 a
90 font-weight: bold
91 color: #2c3e50
92 &.router-link-exact-active
93 color: #42b983
94</style>