Merge pull request #4 from one-react/dev

docs: fix image url issue
one-react · Nov 5, 2018 · ebba60b · ebba60b
2 parents d4a0c6c + f36f0e5
commit ebba60b
Show file tree

Hide file tree

Showing 9 changed files with 20 additions and 20 deletions.
diff --git a/examples/.storybook/webpack.config.js b/examples/.storybook/webpack.config.js
@@ -16,6 +16,10 @@ module.exports = (baseConfig, env, defaultConfig) => {
     ]
   })
 
+  if (env === 'production'.toUpperCase()) {
+    defaultConfig.output.publicPath = '/menu/'
+  }
+
   defaultConfig.resolve.alias['or-menu'] = path.resolve(__dirname, '../../src')
 
   defaultConfig.resolve.extensions.push('.ts', '.tsx')

diff --git a/examples/public/.DS_Store b/examples/public/.DS_Store
diff --git a/examples/public/images/.DS_Store b/examples/public/images/.DS_Store
diff --git a/examples/stories/example.tsx b/examples/stories/example.tsx
@@ -48,7 +48,10 @@ const subNav1 = (
       <div>Sunset Collection</div>
     </div>
     <div className="item-wrapper">
-      <div className="image image-1" />
+      <div
+        className="image"
+        style={{ backgroundImage: `url(${require('./images/face.png')})` }}
+      />
     </div>
   </div>
 )
@@ -79,7 +82,10 @@ const subNav2 = (
       <div>Grapefruit Candle</div>
     </div>
     <div className="item-wrapper">
-      <div className="image image-2" />
+      <div
+        className="image"
+        style={{ backgroundImage: `url(${require('./images/perfume.png')})` }}
+      />
     </div>
   </div>
 )
@@ -112,7 +118,10 @@ const subNav3 = (
       <div>Sunset Collection</div>
     </div>
     <div className="item-wrapper">
-      <div className="image image-3" />
+      <div
+        className="image"
+        style={{ backgroundImage: `url(${require('./images/lip.png')})` }}
+      />
     </div>
   </div>
 )
@@ -143,7 +152,10 @@ const subNav4 = (
       <div>Grapefruit Candle</div>
     </div>
     <div className="item-wrapper">
-      <div className="image image-4" />
+      <div
+        className="image"
+        style={{ backgroundImage: `url(${require('./images/ear.png')})` }}
+      />
     </div>
   </div>
 )
diff --git a/examples/public/images/ear.png → examples/stories/images/ear.png b/examples/public/images/ear.png → examples/stories/images/ear.png
diff --git a/examples/public/images/face.png → examples/stories/images/face.png b/examples/public/images/face.png → examples/stories/images/face.png
diff --git a/examples/public/images/lip.png → examples/stories/images/lip.png b/examples/public/images/lip.png → examples/stories/images/lip.png
diff --git a/examples/public/images/perfume.png → examples/stories/images/perfume.png b/examples/public/images/perfume.png → examples/stories/images/perfume.png
diff --git a/examples/stories/styles.scss b/examples/stories/styles.scss
@@ -19,22 +19,6 @@
         width: 144px;
         height: 144px;
         background-size: contain;
-
-        &.image-1 {
-          background-image: url('../public/images/face.png');
-        }
-
-        &.image-2 {
-          background-image: url('../public/images/perfume.png');
-        }
-
-        &.image-3 {
-          background-image: url('../public/images/lip.png');
-        }
-
-        &.image-4 {
-          background-image: url('../public/images/ear.png');
-        }
       }
     }
   }