15.02 Add a Show 12 hour time format Setting

src/pages/PageSettings.vue

@@ -1,11 +1,30 @@
 <template>
   <q-page padding>
-    <p>Settings Page</p>
+    <q-list bordered padding>
+      <q-item-label header>Settings</q-item-label>
+
+      <q-item tag="label" v-ripple>
+        <q-item-section>
+          <q-item-label>Show 12 hour time format</q-item-label>
+        </q-item-section>
+        <q-item-section side >
+          <q-toggle
+            color="blue"
+            v-model="show12HourTimeFormat"
+          />
+        </q-item-section>
+      </q-item>
+    </q-list>
   </q-page>
 </template>
 
 <script>
 export default {
-  name: 'PageSettings'
+  name: 'PageSettings',
+  data () {
+    return {
+      show12HourTimeFormat: false
+    }
+  }
 }
 </script>