styling wip

src/router.js

@@ -15,7 +15,7 @@ Vue.use(Router)
 
 
 export default new Router({
-
+  // https://alligator.io/vuejs/vue-router-modify-head/ to change title and metadata
   routes: [
     {
       path: '/',

src/store/modules/situation.js

@@ -5,6 +5,7 @@ export default {
         changed: false,
         disabled: false,
         spectacle: false,
+        manager: false,
         diploma: "",
         inscription_period: "",
         allocation_type: "",
@@ -25,6 +26,9 @@ export default {
         updateSpectacle(state, spectacle) {
             state.spectacle = spectacle
         },
+        updateManager(state, manager) {
+            state.manager = manager
+        },
         updateDiploma(state, diploma) {
             state.diploma = diploma
         },
@@ -145,6 +149,20 @@ export default {
             //dispatch('getUncertain') ???
             //this.$router.push('results')
         },
+        submitManager({ commit, state }, manager) {
+            if (manager != state.manager) {
+                commit('updateManager', manager)
+                commit('updateChanged', true)
+            }
+            //if (state.filters.length == 0) { put those actions in the result component when loaded.
+            // dispatch('getFilters')
+            // //}
+            // dispatch('getResults')
+            // dispatch('getEligible')
+            // dispatch('getNonEligible')
+            //dispatch('getUncertain') ???
+            //this.$router.push('results')
+        },
     },
 
     getters: {
@@ -152,6 +170,7 @@ export default {
         changed: state => state.changed,
         disabled: state => state.disabled,
         spectacle: state => state.spectacle,
+        manager: state => state.manager,
         diploma: state => state.diploma,
         inscription_period: state => state.inscription_period,
         allocation_type: state => state.allocation_type,

src/views/Questions.vue

@@ -11,4 +11,17 @@ export default {
 </script>
  
  <style>
+.v-input--selection-controls.v-input .v-label {
+  color: black;
+  font-size: 24px;
+  margin-top: 15px;
+  margin-bottom: 15px;
+}
+.v-text-field {
+  font-size: 24px;
+}
+
+v-card-title {
+  justify-content: center;
+}
 </style>
\ No newline at end of file

src/views/questions/ARE.vue

  <template>
-  <v-form @submit.prevent="submitARE" ref="formARE" v-model="validity" :lazy-validation="lazy">
-    Quel est le montant de cette allocation ?
-    <v-text-field
-      v-model.number="monthly_allocation_value"
-      autofocus
-      required
-      :rules="rules"
-      min="0"
-      type="number"
-      label="Montant par mois"
-    ></v-text-field>
-    <v-btn @click="back">Revenir</v-btn>
-    <v-btn v-bind:disabled="!validity" type="submit">Continuer</v-btn>
-  </v-form>
+  <v-card align="center">
+    <v-form @submit.prevent="submitARE" ref="formARE" v-model="validity" :lazy-validation="lazy">
+      Quel est le montant de cette allocation ?
+      <v-text-field
+        v-model.number="monthly_allocation_value"
+        autofocus
+        required
+        :rules="rules"
+        min="0"
+        type="number"
+        label="Montant par mois"
+      ></v-text-field>
+      <v-btn x-large class="ma-2" color="#96a8b2" @click="back">Revenir</v-btn>
+      <v-btn
+        x-large
+        class="ma-2"
+        color="secondary"
+        v-bind:disabled="!validity"
+        type="submit"
+      >Continuer</v-btn>
+    </v-form>
+  </v-card>
 </template>
  
  <script>

src/views/questions/Address.vue

@@ -6,7 +6,7 @@
       <v-row>
         <v-col cols="12" md="8">
           <v-autocomplete
-            max-width="200px"
+            width="200px"
             v-model="address"
             :items="items"
             :loading="isLoading"

src/views/questions/Age.vue

  <template>
-  <v-form @submit.prevent="submitAge" ref="formAge" v-model="validity" :lazy-validation="lazy">
-    Quel est votre âge ?
-    <v-text-field
-      required
-      autofocus
-      v-model.number="age"
-      type="number"
-      min="0"
-      :rules="[rules.min]"
-    ></v-text-field>
-    <v-btn @click="back">Revenir</v-btn>
-    <v-btn v-bind:disabled="!validity" type="submit">Continuer</v-btn>
-  </v-form>
+  <v-card align="center">
+    <v-card-title class="display-1">Quel est votre âge ?</v-card-title>
+
+    <v-form @submit.prevent="submitAge" ref="formAge" v-model="validity" :lazy-validation="lazy">
+      <v-text-field
+        required
+        autofocus
+        outlined
+        color="black"