trying to do a bit of fancy styling

src/css/custom.scss

@@ -104,9 +104,13 @@ li {
 #trains {
   overflow-y: auto;
   transition: all 0.5s;
+  -webkit-transition: all 0.5s;
 
 }
 
+.unsliced {
+  height:455px;
+}
 .sliced {
   height:300px;
 

src/index.html

@@ -32,7 +32,7 @@
 <div class="mui--appbar-height"></div>
 <div class="mui-container">
     <div class="app"></div>
-    <div id="trains"></div>
+    <div id="trains" class="unsliced"></div>
 
     <div id='trainResults' class="mui--hide"></div>
 </div>

src/js/route.js

@@ -238,8 +238,11 @@ ${nrMessages}
     this.$traintext.empty().html(ws);
     this.$traintext.removeClass('mui--hide').addClass('mui--show');
 
-    if (!this.$trains.hasClass('sliced'))
-      this.$trains.addClass('sliced');
+    if (this.$trains.hasClass('unsliced')) 
+      this.$trains.addClass('sliced').removeClass('unsliced');
+    
+    // this.$trains.css("background-color", "yellow");
+    // this.$trains.css("height", "300px");
   },
   'initView': function () {
 

src/service-worker.js

@@ -11,7 +11,7 @@
 // WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 // See the License for the specific language governing permissions and
 // limitations under the License.
-const CACHE_VERSION = 3;
+const CACHE_VERSION = 4;
 const dataCacheName = 'traintimesData-v1';
 const cacheName = 'traintimePWA-final-1';
 const filesToCache = [