Fix image size in landscape and version in panel (#24)

Closes #22 and also fixes unlisted issue with the display of the placeholder image on the detect screen when in landscape mode.

Signed-off-by: Justin Georgi <justin.georgi@gmail.com>

Reviewed-on: Georgi_Lab/ALVINN_f7#24

src/components/app.vue

@@ -10,6 +10,9 @@
           <f7-list-item link="/settings/" view=".view-main" panel-close=".panel-left">Settings</f7-list-item>
           <f7-list-item link="/about/">About ALVINN</f7-list-item>
         </f7-list>
+        <f7-toolbar class="panel-bar" position="bottom">
+          <span>version 0.1.1</span>
+        </f7-toolbar>
       </f7-page>
     </f7-view>
   </f7-panel>
@@ -37,6 +40,13 @@
 
   </f7-app>
 </template>
+
+<style>
+  .panel-bar > .toolbar-inner {
+    justify-content: center;
+  }
+</style>
+
 <script>
   import { ref, onMounted } from 'vue';
   import { f7, f7ready } from 'framework7-vue';

src/pages/detect.vue

@@ -25,7 +25,7 @@
         <f7-button @click="setData" :class="(imageLoaded) ? '' : 'disabled'">
           <img src="../assets/icons/visibility.svg" />
         </f7-button>
-        <f7-button @click="setData">
+        <f7-button class="disabled" @click="setData">
           <img src="../assets/icons/videocam.svg" />
         </f7-button>
       </f7-segmented>
@@ -121,7 +121,7 @@
       grid-template-rows: calc(100vh - var(--f7-navbar-height) - var(--f7-safe-area-top) - var(--f7-safe-area-bottom) - 64px);
       grid-template-areas: 
         "image-view result-view menu-view";
-      justify-items: center;
+      justify-items: stretch;
       align-items: stretch;
       height: calc(100% - var(--f7-navbar-height) - var(--f7-safe-area-top) - var(--f7-safe-area-bottom));
       max-height: calc(100% - var(--f7-navbar-height) - var(--f7-safe-area-top) - var(--f7-safe-area-bottom));