diff --git a/.storybook/config.js b/.storybook/config.js
index 1db13092..caba2e06 100644
--- a/.storybook/config.js
+++ b/.storybook/config.js
@@ -2,6 +2,8 @@ import { configure } from "@storybook/react";
 import '../src/styles/_globals.scss';
 import '../src/styles/_icon-url.scss';
 import '../src/styles/_font.scss';
+import '../src/styles/_all.scss';
+
 
 const req = require.context("../src/stories", true, /.stories.tsx$/);
 
diff --git a/package.json b/package.json
index a4eb7a3c..3ef98ad9 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "quarkify",
-  "version": "3.1.1",
+  "version": "3.2.1",
   "license": "MIT",
   "description": "An awesome lightweight React UI Component library",
   "repository": "https://github.com/Trendyol/quarkify",
@@ -37,7 +37,7 @@
   },
   "devDependencies": {
     "@storybook/addon-viewport": "^5.1.9",
-    "@storybook/react": "latest",
+    "@storybook/react": "5.3.19",
     "@types/classnames": "^2.2.8",
     "@types/enzyme-adapter-react-16": "^1.0.5",
     "@types/faker": "^4.1.5",
diff --git a/src/styles/_all.scss b/src/styles/_all.scss
index 4987e18e..0bf268b7 100644
--- a/src/styles/_all.scss
+++ b/src/styles/_all.scss
@@ -28,3 +28,6 @@
 @import './components/subheader';
 @import './components/switch';
 @import './components/typography';
+@import './components/ripple';
+@import './components/quantity-selector';
+@import './components/step-progress-bar';