updates storybook theme (#1436)

* updates storybook theme

Author: jobala

.storybook/manager-head.html

@@ -48,6 +48,10 @@
     color: #323232;
   }
 
+  .sidebar-subheading.css-ulso1l {
+    color: #717171 !important;
+  }
+
   @media (max-width: 768px) {
     #root > div:first-of-type {
       height: calc(100% - 50px);

.storybook/theme.js

@@ -3,33 +3,33 @@ import { create } from '@storybook/theming/create';
 export default create({
   base: 'light',
 
-  //   colorPrimary: 'hotpink',
-  //   colorSecondary: 'deepskyblue',
+  // colorPrimary: 'hotpink',
+  colorSecondary: '#0360B9',
 
   // UI
-  //   appBg: 'white',
-  //   appContentBg: 'silver',
-  //   appBorderColor: 'grey',
-  //   appBorderRadius: 4,
+  // appBg: 'white',
+  // appContentBg: 'silver',
+  // appBorderColor: 'grey',
+  // appBorderRadius: 4,
 
   // Typography
-  //   fontBase: '"Open Sans", sans-serif',
-  //   fontCode: 'monospace',
+  // fontBase: '"Open Sans", sans-serif',
+  // fontCode: 'monospace',
 
   // Text colors
-  //   textColor: 'black',
-  //   textInverseColor: 'rgba(255,255,255,0.9)',
+  textColor: '#1A1A1A',
+  textInverseColor: 'rgba(255,255,255,0.9)',
 
   // Toolbar default and active colors
-  //   barTextColor: 'silver',
-  //   barSelectedColor: 'black',
-  //   barBg: 'hotpink',
+  barTextColor: '#717171',
+  // barSelectedColor: '#0360B9',
+  // barBg: 'hotpink',
 
   // Form colors
-  //   inputBg: 'white',
-  //   inputBorder: 'silver',
-  //   inputTextColor: 'black',
-  //   inputBorderRadius: 4,
+  // inputBg: 'white',
+  // inputBorder: 'silver',
+  // inputTextColor: 'black',
+  // inputBorderRadius: 4,
 
   brandTitle: 'Microsoft Graph Toolkit Playground',
   brandUrl: 'https://aka.ms/mgt'

package.json

@@ -93,6 +93,7 @@
     "lit-element": "2.5.0",
     "monaco-editor": "^0.19.3",
     "monaco-editor-webpack-plugin": "^1.8.2",
+    "node-sass": "npm:sass@^1.44.0",
     "npm-run-all": "^4.1.5",
     "prettier": "2.2.1",
     "react": "^17.0.1",
@@ -116,8 +117,7 @@
     "tslint-microsoft-contrib": "^6.2.0",
     "typescript": "^3.7.5",
     "web-component-analyzer": "^1.1.6",
-    "whatwg-fetch": "^3.5.0",
-    "node-sass": "npm:sass@^1.44.0"
+    "whatwg-fetch": "^3.5.0"
   },
   "husky": {
     "hooks": {