798th Commit

Shyam-Chen · Jan 22, 2020 · 5e52abe · 5e52abe
1 parent 8e705cd
commit 5e52abe
Show file tree

Hide file tree

Showing 52 changed files with 168 additions and 159 deletions.
diff --git a/src/App.vue b/src/App.vue
@@ -224,35 +224,39 @@
       </v-app-bar>
 
       <v-content>
-        <v-fade-transition mode="out-in">
-          <router-view></router-view>
-        </v-fade-transition>
-
-        <v-footer height="auto" class="pa-3 primary darken-1 white--text">
-          <img src="/assets/images/logo.svg" alt="Logo" width="50" height="50" />
-
-          <v-layout
-            :column="isMobile"
-            fill-height
-            justify-space-between
-            align-center
-            class="ml-3 mr-3"
-          >
-            <div class="subheading">
-              <a href="https://vuejs.org/" class="subheading pa-2 white--text o-router-link"
-                >Learn Vue</a
-              >
-            </div>
-            <div class="caption">
-              Current Version: 2.6.10
-            </div>
-            <div class="caption text-xs-center">
-              Powered by Oh My Vue &copy;{{ new Date().getFullYear() }}. <br />
-              Code licensed under an MIT-style License. <br />
-              Documentation licensed under CC BY 4.0.
-            </div>
-          </v-layout>
-        </v-footer>
+        <div class="omv-content">
+          <div class="omv-view">
+            <v-fade-transition mode="out-in">
+              <router-view></router-view>
+            </v-fade-transition>
+          </div>
+
+          <v-footer height="auto" class="pa-3 primary darken-1 white--text">
+            <img src="/assets/images/logo.svg" alt="Logo" width="50" height="50" />
+
+            <v-layout
+              :column="isMobile"
+              fill-height
+              justify-space-between
+              align-center
+              class="ml-3 mr-3"
+            >
+              <div class="subheading">
+                <a href="https://vuejs.org/" class="subheading pa-2 white--text o-router-link"
+                  >Learn Vue</a
+                >
+              </div>
+              <div class="caption">
+                Current Version: 2.6.10
+              </div>
+              <div class="caption text-xs-center">
+                Powered by Oh My Vue &copy;{{ new Date().getFullYear() }}. <br />
+                Code licensed under an MIT-style License. <br />
+                Documentation licensed under CC BY 4.0.
+              </div>
+            </v-layout>
+          </v-footer>
+        </div>
       </v-content>
     </template>
 
@@ -317,6 +321,16 @@ export default {
   width: 20rem;
 }
 
+.omv-content {
+  display: flex;
+  flex-flow: column;
+  height: 100%;
+}
+
+.omv-view {
+  flex: 1 0 auto;
+}
+
 .o-router-link {
   text-decoration: none;
   cursor: pointer;

diff --git a/src/__tests__/__snapshots__/App.spec.js.snap b/src/__tests__/__snapshots__/App.spec.js.snap
@@ -133,22 +133,26 @@ exports[`App should render an initial component 1`] = `
     </v-btn-stub>
   </v-app-bar-stub>
   <v-content-stub tag="main">
-    <v-fade-transition-stub mode="out-in" origin="top center 0">
-      <router-view-stub name="default"></router-view-stub>
-    </v-fade-transition-stub>
-    <v-footer-stub height="auto" tag="div" tile="true" class="pa-3 primary darken-1 white--text"><img src="/assets/images/logo.svg" alt="Logo" width="50" height="50">
-      <v-layout-stub tag="div" fill-height="" justify-space-between="" align-center="" class="ml-3 mr-3">
-        <div class="subheading"><a href="https://vuejs.org/" class="subheading pa-2 white--text o-router-link">Learn Vue</a></div>
-        <div class="caption">
-          Current Version: 2.6.10
-        </div>
-        <div class="caption text-xs-center">
-          Powered by Oh My Vue ©2020. <br>
-          Code licensed under an MIT-style License. <br>
-          Documentation licensed under CC BY 4.0.
-        </div>
-      </v-layout-stub>
-    </v-footer-stub>
+    <div class="omv-content">
+      <div class="omv-view">
+        <v-fade-transition-stub mode="out-in" origin="top center 0">
+          <router-view-stub name="default"></router-view-stub>
+        </v-fade-transition-stub>
+      </div>
+      <v-footer-stub height="auto" tag="div" tile="true" class="pa-3 primary darken-1 white--text"><img src="/assets/images/logo.svg" alt="Logo" width="50" height="50">
+        <v-layout-stub tag="div" fill-height="" justify-space-between="" align-center="" class="ml-3 mr-3">
+          <div class="subheading"><a href="https://vuejs.org/" class="subheading pa-2 white--text o-router-link">Learn Vue</a></div>
+          <div class="caption">
+            Current Version: 2.6.10
+          </div>
+          <div class="caption text-xs-center">
+            Powered by Oh My Vue ©2020. <br>
+            Code licensed under an MIT-style License. <br>
+            Documentation licensed under CC BY 4.0.
+          </div>
+        </v-layout-stub>
+      </v-footer-stub>
+    </div>
   </v-content-stub>
 </v-app-stub>
 `;
diff --git a/src/assets/styles/global.css b/src/assets/styles/global.css
@@ -6,24 +6,17 @@ body {
   background: #006fc9;
 
   &::before {
-    content: "Loading...";
+    content: 'Loading...';
     position: absolute;
-    top: 50%;
     left: 50%;
+    top: 50%;
     transform: translate(-50%, -50%);
     z-index: -1;
     color: #66c0ff;
+    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell,
+      Helvetica, sans-serif;
     font-size: 2.5rem;
     text-transform: uppercase;
-    font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Oxygen-Sans, Ubuntu, Cantarell, Helvetica, sans-serif;
     text-shadow: 2px 2px 10px rgba(0, 0, 0, 0.2);
   }
 }
-
-.shell-container {
-  height: calc(100% - 84px);  /* calc(100% - footer) */
-
-  @media (--viewport-mobile) {
-    height: calc(100% - 128px);  /* calc(100% - footer) */
-  }
-}
diff --git a/src/index.html b/src/index.html
@@ -1,57 +1,55 @@
 <!DOCTYPE html>
 <html lang="en">
-
-<head>
-  <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width, initial-scale=1.0">
-  <title><%= process.env.APP_NAME %></title>
-  <meta name="description" content="<%= process.env.APP_DESCRIPTION %>">
-  <link rel="icon" type="image/x-icon" href="/assets/images/favicon.ico">
-
-  <!-- Load from the subdomain -->
-  <link rel="dns-prefetch" href="//www.netlify.com">
-
-  <!-- Third-party code  -->
-  <link rel="dns-prefetch" href="//fonts.googleapis.com">
-  <link rel="dns-prefetch" href="//fonts.gstatic.com">
-  <link rel="dns-prefetch" href="//www.google-analytics.com">
-  <link rel="dns-prefetch" href="//www.googletagmanager.com">
-
-  <!-- Open graph protocol -->
-  <meta property="og:title" content="<%= process.env.APP_NAME %>">
-  <meta property="og:description" content="<%= process.env.APP_DESCRIPTION %>">
-  <meta property="og:image" content="/assets/images/icon-256x256.png">
-
-  <!-- Web app manifest -->
-  <link rel="manifest" href="/assets/datas/manifest.json">
-
-  <!-- Add to homescreen for Android -->
-  <meta name="mobile-web-app-capable" content="yes">
-  <meta name="application-name" content="<%= process.env.APP_NAME %>">
-  <link rel="icon" sizes="192x192" href="/assets/images/icon-192x192.png">
-
-  <!-- Add to homescreen for iOS -->
-  <meta name="apple-mobile-web-app-capable" content="yes">
-  <meta name="apple-mobile-web-app-status-bar-style" content="black">
-  <meta name="apple-mobile-web-app-title" content="<%= process.env.APP_NAME %>">
-  <link rel="apple-touch-icon" href="/assets/images/icon-152x152.png">
-
-  <!-- Add to home screen for Windows -->
-  <meta name="msapplication-TileImage" content="/assets/images/icon-144x144.png">
-  <meta name="msapplication-TileColor" content="#2F3BA2">
-
-  <!-- Color the status bar on mobile devices -->
-  <meta name="theme-color" content="#1E88E5">
-</head>
-
-<body>
-  <div id="root">
-    <style>#root{display:flex;justify-content:center;align-items:center;height:100vh;color:#66c0ff;text-transform:uppercase;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;font-size:2.5rem;text-shadow:2px 2px 10px rgba(0,0,0,.2)}body{background:#006fc9;margin:0;padding:0}@keyframes dots{50%{transform:translateY(-.4rem)}to{transform:translateY(0)}}.d{animation:dots 1.5s ease-out infinite}.d-2{animation-delay:.5s}.d-3{animation-delay:1s}</style>
-    Loading<span class="d">.</span><span class="d d-2">.</span><span class="d d-3">.</span>
-  </div>
-
-  <noscript>This is your fallback content in case JavaScript fails to load.</noscript>
-</body>
-
+  <head>
+    <meta charset="utf-8" />
+    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title><%= process.env.APP_NAME %></title>
+    <meta name="description" content="<%= process.env.APP_DESCRIPTION %>" />
+    <link rel="icon" type="image/x-icon" href="/assets/images/favicon.ico" />
+
+    <!-- Load from the subdomain -->
+    <link rel="dns-prefetch" href="//www.netlify.com" />
+
+    <!-- Third-party code  -->
+    <link rel="dns-prefetch" href="//fonts.googleapis.com" />
+    <link rel="dns-prefetch" href="//fonts.gstatic.com" />
+    <link rel="dns-prefetch" href="//www.google-analytics.com" />
+    <link rel="dns-prefetch" href="//www.googletagmanager.com" />
+
+    <!-- Open graph protocol -->
+    <meta property="og:title" content="<%= process.env.APP_NAME %>" />
+    <meta property="og:description" content="<%= process.env.APP_DESCRIPTION %>" />
+    <meta property="og:image" content="/assets/images/icon-256x256.png" />
+
+    <!-- Web app manifest -->
+    <link rel="manifest" href="/assets/datas/manifest.json" />
+
+    <!-- Add to homescreen for Android -->
+    <meta name="mobile-web-app-capable" content="yes" />
+    <meta name="application-name" content="<%= process.env.APP_NAME %>" />
+    <link rel="icon" sizes="192x192" href="/assets/images/icon-192x192.png" />
+
+    <!-- Add to homescreen for iOS -->
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
+    <meta name="apple-mobile-web-app-title" content="<%= process.env.APP_NAME %>" />
+    <link rel="apple-touch-icon" href="/assets/images/icon-152x152.png" />
+
+    <!-- Add to home screen for Windows -->
+    <meta name="msapplication-TileImage" content="/assets/images/icon-144x144.png" />
+    <meta name="msapplication-TileColor" content="#2F3BA2" />
+
+    <!-- Color the status bar on mobile devices -->
+    <meta name="theme-color" content="#1E88E5" />
+  </head>
+
+  <body>
+    <div id="root">
+      <style>#root{display:flex;justify-content:center;align-items:center;height:100vh;color:#66c0ff;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;font-size:2.5rem;text-transform:uppercase;text-shadow:2px 2px 10px rgba(0,0,0,.2)}body{background:#006fc9;margin:0;padding:0}@keyframes dots{50%{transform:translateY(-.4rem)}to{transform:translateY(0)}}.d{animation:dots 1.5s ease-out infinite}.d-2{animation-delay:.5s}.d-3{animation-delay:1s}</style>
+      Loading<span class="d">.</span><span class="d d-2">.</span><span class="d d-3">.</span>
+    </div>
+
+    <noscript>This is your fallback content in case JavaScript fails to load.</noscript>
+  </body>
 </html>
diff --git a/src/shell/authorization/Authorization.vue b/src/shell/authorization/Authorization.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="authorization" class="shell-container" fluid>
+  <v-container id="authorization" fluid>
     <div class="headline">Authorization (TODO)</div>
 
     <v-layout row>

diff --git a/src/shell/controls/autocomplete/Autocomplete.vue b/src/shell/controls/autocomplete/Autocomplete.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="autocomplete" class="shell-container" fluid>
+  <v-container id="autocomplete" fluid>
     <v-layout column>
       <div class="headline">Controls - Autocomplete</div>
 

diff --git a/src/shell/controls/calendar/Calendar.vue b/src/shell/controls/calendar/Calendar.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="calendar" class="shell-container" fluid>
+  <v-container id="calendar" fluid>
     <v-layout column>
       <div class="headline">Controls - Calendar</div>
 

diff --git a/src/shell/controls/markdown-editor/MarkdownEditor.vue b/src/shell/controls/markdown-editor/MarkdownEditor.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="markdown-editor" class="shell-container" fluid>
+  <v-container id="markdown-editor" fluid>
     <v-layout row fill-height justify-space-between>
       <v-flex xs6>
         <textarea v-model="source" class="pa-3 markdown-editor"></textarea>

diff --git a/src/shell/controls/pickers/Pickers.vue b/src/shell/controls/pickers/Pickers.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="pickers" class="shell-container" fluid>
+  <v-container id="pickers" fluid>
     <v-layout column>
       <div class="headline">Controls - Pickers</div>
 

diff --git a/src/shell/controls/selection-controls/SelectionControls.vue b/src/shell/controls/selection-controls/SelectionControls.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="selection-controls" class="shell-container" fluid>
+  <v-container id="selection-controls" fluid>
     <v-layout column>
       <div class="headline">Controls - Selection Controls</div>
 

diff --git a/src/shell/controls/selects/Selects.vue b/src/shell/controls/selects/Selects.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="selects" class="shell-container" fluid>
+  <v-container id="selects" fluid>
     <v-layout column>
       <div class="headline">Controls - Selects</div>
 

diff --git a/src/shell/controls/stepper/Stepper.vue b/src/shell/controls/stepper/Stepper.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="stepper" class="shell-container" fluid>
+  <v-container id="stepper" fluid>
     <v-stepper v-model="step">
       <v-stepper-header>
         <v-stepper-step :complete="step > 1" step="1">Name of step 1</v-stepper-step>

diff --git a/src/shell/controls/text-fields/TextFields.vue b/src/shell/controls/text-fields/TextFields.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="text-fields" class="shell-container" fluid>
+  <v-container id="text-fields" fluid>
     <v-layout column>
       <div class="headline">Controls - Text Fields</div>
 

diff --git a/src/shell/controls/tree-view/TreeView.vue b/src/shell/controls/tree-view/TreeView.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="tree-view" class="shell-container" fluid>
+  <v-container id="tree-view" fluid>
     <v-layout column>
       <div class="headline">Controls - Tree View</div>
 

diff --git a/src/shell/crud-operations/basic/Basic.vue b/src/shell/crud-operations/basic/Basic.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="basic" class="shell-container" fluid>
+  <v-container id="basic" fluid>
     <v-layout column>
       <div class="headline">CRUD Operations - Basic</div>
 

diff --git a/src/shell/crud-operations/basic/__tests__/__snapshots__/Basic.spec.js.snap b/src/shell/crud-operations/basic/__tests__/__snapshots__/Basic.spec.js.snap
@@ -1,7 +1,7 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Basic should render an initial component 1`] = `
-<v-container-stub id="basic" tag="div" fluid="true" class="shell-container">
+<v-container-stub id="basic" tag="div" fluid="true">
   <v-layout-stub tag="div" column="">
     <div class="headline">CRUD Operations - Basic</div>
     <v-layout-stub tag="div" row="">
@@ -135,7 +135,7 @@ exports[`Basic should render an initial component 1`] = `
 `;
 
 exports[`Basic should render an initial component 2`] = `
-<v-container-stub id="basic" tag="div" fluid="true" class="shell-container">
+<v-container-stub id="basic" tag="div" fluid="true">
   <v-layout-stub tag="div" column="">
     <div class="headline">CRUD Operations - Basic</div>
     <v-layout-stub tag="div" row="">

diff --git a/src/shell/crud-operations/graphql/GraphQL.vue b/src/shell/crud-operations/graphql/GraphQL.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="graphql" class="shell-container" fluid>
+  <v-container id="graphql" fluid>
     <v-layout column>
       <div class="headline">CRUD Operations - GraphQL</div>
 

diff --git a/src/shell/crud-operations/rest/REST.vue b/src/shell/crud-operations/rest/REST.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="rest" class="shell-container" fluid>
+  <v-container id="rest" fluid>
     <v-layout column>
       <div class="headline">CRUD Operations - REST</div>
 

diff --git a/src/shell/data-table/display-rows/DisplayRows.vue b/src/shell/data-table/display-rows/DisplayRows.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="display-rows" class="shell-container" fluid>
+  <v-container id="display-rows" fluid>
     <v-card>
       <v-data-table v-model="selected" :headers="headers" :items="desserts" select-all hide-actions>
         <template slot="items" slot-scope="props">

diff --git a/src/shell/data-table/iterator/Iterator.vue b/src/shell/data-table/iterator/Iterator.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="iterator" class="shell-container" fluid grid-list-md>
+  <v-container id="iterator" fluid grid-list-md>
     <v-data-iterator
       :items="items"
       :rows-per-page-items="rowsPerPageItems"

diff --git a/src/shell/data-table/paginator/Paginator.vue b/src/shell/data-table/paginator/Paginator.vue
@@ -1,5 +1,5 @@
 <template>
-  <v-container id="paginator" class="shell-container" fluid>
+  <v-container id="paginator" fluid>
     <v-layout column>
       <div class="headline">Data Table - Paginator</div>