diff --git a/packages/fe/README.md b/packages/fe/README.md
index 8a09d42..0c1b782 100644
--- a/packages/fe/README.md
+++ b/packages/fe/README.md
@@ -1,8 +1,11 @@
 # Open Panda Frontend
 
+See the main repo readme for the most up-to-date documentation on running this project as a static site.
 
 ## Storybook
 
+### _Note: (Storybook is deprecated)_
+
 To better display the components available on the site, their properties, and the states they might appear in, a Storybook app is included in this repo.
 
 - Each component that's developed must have its own story
diff --git a/packages/fe/components/blocks/category-slider-block.vue b/packages/fe/components/blocks/category-slider-block.vue
index 4c657f5..9840691 100644
--- a/packages/fe/components/blocks/category-slider-block.vue
+++ b/packages/fe/components/blocks/category-slider-block.vue
@@ -40,7 +40,7 @@
             <div class="inner-content">
               <div
                 class="background-image"
-                :style="{ 'background-image': `url('/images/categories/${slide.id}.jpg')` }">
+                :style="{ 'background-image': `url('/images/categories/${$GetKebab(slide.name)}.jpg')` }">
               </div>
               <div class="category">
                 <div class="text">
diff --git a/packages/fe/package.json b/packages/fe/package.json
index 4da4918..4c68af2 100644
--- a/packages/fe/package.json
+++ b/packages/fe/package.json
@@ -7,7 +7,7 @@
     "dev": "../../node_modules/.bin/nuxt",
     "start": "../../node_modules/.bin/nuxt start",
     "build": "../../node_modules/.bin/nuxt build",
-    "generate": "../../node_modules/.bin/nuxt generate",
+    "generate": "NODE_OPTIONS=--openssl-legacy-provider ../../node_modules/.bin/nuxt generate",
     "serve": "../../node_modules/.bin/nuxt serve",
     "launch": "../../node_modules/.bin/nuxt build && pm2 restart op-fe",
     "launch-stable": "../../node_modules/.bin/nuxt build && pm2 restart op-ST-fe",
diff --git a/packages/fe/plugins/helpers.js b/packages/fe/plugins/helpers.js
index 6073adc..2c55532 100644
--- a/packages/fe/plugins/helpers.js
+++ b/packages/fe/plugins/helpers.js
@@ -397,6 +397,12 @@ const ConnectWebsocket = config => (instance, next) => {
   })
 }
 
+// //////////////////////////////////////////////////////// getKebab
+// makes any string kebab-lowercase
+const GetKebab = (str) => {
+  return str.toLowerCase().replace(/[.,/#!$%^&*;:{}=_`~()]/g, '').replace(/\s+/g, '-').trim()
+}
+
 // //////////////////////////////////////////////////////// getPrettyNameFromUrl
 // replace '-' to ' '
 // remove extension
@@ -461,6 +467,7 @@ export default ({ $config, app }, inject) => {
   inject('connectWebsocket', ConnectWebsocket($config))
   inject('GetTagBasedOnUrl', GetTagBasedOnUrl)
   inject('GetTargetBasedOnUrl', GetTargetBasedOnUrl)
+  inject('GetKebab', GetKebab)
   inject('GetPrettyNameFromUrl', GetPrettyNameFromUrl)
   inject('scrollToHash', (route, element) => ScrollToHash(app, route, element))
 }
diff --git a/packages/fe/static/images/categories/Civil.jpg b/packages/fe/static/images/categories/civil-engineering.jpg
similarity index 100%
rename from packages/fe/static/images/categories/Civil.jpg
rename to packages/fe/static/images/categories/civil-engineering.jpg
diff --git a/packages/fe/static/images/categories/Natural.jpg b/packages/fe/static/images/categories/natural-language.jpg
similarity index 100%
rename from packages/fe/static/images/categories/Natural.jpg
rename to packages/fe/static/images/categories/natural-language.jpg
diff --git a/packages/fe/static/images/categories/Popular.jpg b/packages/fe/static/images/categories/popular-culture.jpg
similarity index 100%
rename from packages/fe/static/images/categories/Popular.jpg
rename to packages/fe/static/images/categories/popular-culture.jpg