diff --git a/src/renderer/components/ft-element-list/ft-element-list.vue b/src/renderer/components/ft-element-list/ft-element-list.vue
index c615b3e7..b4b000ec 100644
--- a/src/renderer/components/ft-element-list/ft-element-list.vue
+++ b/src/renderer/components/ft-element-list/ft-element-list.vue
@@ -8,6 +8,7 @@
       appearance="result"
       :data="result"
       :first-screen="index < 16"
+      :layout="listType"
     />
   </ft-auto-grid>
 </template>
diff --git a/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.css b/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.css
index d58d0725..95b1c7c7 100644
--- a/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.css
+++ b/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.css
@@ -1,3 +1,7 @@
-.lazyWrapper {
+.grid {
   min-height: 264px;
 }
+
+.list {
+  min-height: 131px;
+}
diff --git a/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.js b/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.js
index 67c1fdb1..5ff6c2f7 100644
--- a/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.js
+++ b/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.js
@@ -22,6 +22,10 @@ export default Vue.extend({
     firstScreen: {
       type: Boolean,
       required: true
+    },
+    layout: {
+      type: String,
+      default: 'grid'
     }
   },
   data: function () {
diff --git a/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.vue b/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.vue
index 40fc33d2..e49915e2 100644
--- a/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.vue
+++ b/src/renderer/components/ft-list-lazy-wrapper/ft-list-lazy-wrapper.vue
@@ -4,7 +4,10 @@
       callback: onVisibilityChanged,
       once: true,
     }"
-    class="lazyWrapper"
+    :class="{
+      grid: layout === 'grid',
+      list: layout === 'list'
+    }"
   >
     <ft-list-channel
       v-if="data.type === 'channel' && visible"
diff --git a/src/renderer/views/Watch/Watch.js b/src/renderer/views/Watch/Watch.js
index d966ffae..d95a6817 100644
--- a/src/renderer/views/Watch/Watch.js
+++ b/src/renderer/views/Watch/Watch.js
@@ -653,11 +653,14 @@ export default Vue.extend({
         if (this.isDev) {
           fileLocation = `storyboards/${this.videoId}.vtt`
           uriSchema = fileLocation
+          // if the location does not exist, writeFileSync will not create the directory, so we have to do that manually
+          if (!fs.existsSync('storyboards/')) {
+            fs.mkdirSync('storyboards/')
+          }
         } else {
           fileLocation = `${userData}/storyboards/${this.videoId}.vtt`
           uriSchema = `file://${fileLocation}`
         }
-
         fs.writeFileSync(fileLocation, results)
 
         this.videoStoryboardSrc = uriSchema