Spaces:

aletrn
/

driver.js

Running

kamrify commited on Mar 10, 2018

Commit

8a554f1

1 Parent(s): a47eab3

Rearrange and update dev build script

Files changed (13) hide show

{assets/styles/scss → demo}/base.scss RENAMED Viewed

File without changes

demo/demo.scss ADDED Viewed

+@import "base";
+@import "../src/sholo";
+$container-width: 500px !default;
+$logo-font-size: 55px !default;
+$button-font-size: 13px !default;
+$dark-button-bg: #2d2d2d !default;
+$dark-button-text: #ffffff !default;
+$light-button-bg: #f5f5f5 !default;
+$light-button-text: #2d2d2d !default;
+.page-wrap {
+  padding-top: 1px;
+  width: $container-width;
+  margin: auto;
+}
+.btn {
+  font-size: $button-font-size;
+  padding: 7px 10px;
+  border-radius: 3px;
+  &.btn__dark {
+    background: $dark-button-bg;
+    color: $dark-button-text;
+  }
+  &.btn__light {
+    background: $light-button-bg;
+    color: $light-button-text;
+  }
+}
+section {
+  margin-bottom: 35px;
+}
+.section__header {
+  margin: 80px 0 50px;
+  text-align: center;
+  display: block;
+  padding: 10px 10px 20px;
+  h1 {
+    font-size: $logo-font-size;
+  }
+}

index.html CHANGED Viewed

@@ -6,7 +6,7 @@
         content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <title>Sholo</title>
-  <link rel="stylesheet" href="./assets/styles/css/demo.css">
 </head>
 <body>
 <div class="page-wrap">
@@ -55,7 +55,7 @@
   </section>
 </div>
-<script src="./assets/scripts/dist/sholo.js"></script>
 <script>
   const sholo = new Sholo({
     animate: true,
@@ -85,7 +85,7 @@
       popover: {
         title: 'Adding Introductions',
         description: 'You can use it to add popovers on top of the website',
-        position: 'right',
       },
     },
     {

         content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
   <meta http-equiv="X-UA-Compatible" content="ie=edge">
   <title>Sholo</title>
+  <link rel="stylesheet" href="./dist/demo.css">
 </head>
 <body>
 <div class="page-wrap">
   </section>
 </div>
+<script src="./dist/sholo.js"></script>
 <script>
   const sholo = new Sholo({
     animate: true,
       popover: {
         title: 'Adding Introductions',
         description: 'You can use it to add popovers on top of the website',
+        position: 'rig',
       },
     },
     {

postcss.config.js DELETED Viewed

@@ -1,5 +0,0 @@
-module.exports = {
-  plugins: {
-    autoprefixer: {},
-  },
-};

{assets/scripts/src → src/common}/constants.js RENAMED Viewed

File without changes

{assets/scripts/src → src/common}/polyfill.js RENAMED Viewed

File without changes

{assets/scripts/src → src/core}/element.js RENAMED Viewed

@@ -7,7 +7,7 @@ import Position from './position';
 export default class Element {
   /**
    * DOM element object
-   * @param {Node} node
    * @param {Object} options
    * @param {Popover} popover
    * @param {Overlay} overlay

 export default class Element {
   /**
    * DOM element object
+   * @param {Node|HTMLElement} node
    * @param {Object} options
    * @param {Popover} popover
    * @param {Overlay} overlay

{assets/scripts/src → src/core}/overlay.js RENAMED Viewed

@@ -1,5 +1,5 @@
 import Position from './position';
-import { ID_OVERLAY, OVERLAY_ZINDEX } from './constants';
 /**
  * Responsible for overlay creation and manipulation i.e.

 import Position from './position';
+import { ID_OVERLAY, OVERLAY_ZINDEX } from '../common/constants';
 /**
  * Responsible for overlay creation and manipulation i.e.

{assets/scripts/src → src/core}/popover.js RENAMED Viewed

@@ -8,7 +8,7 @@ import {
   CLASS_POPOVER_TITLE, CLASS_PREV_STEP_BTN,
   ID_POPOVER,
   POPOVER_HTML,
-} from './constants';
 /**
  * Popover that is displayed on top of the highlighted element

   CLASS_POPOVER_TITLE, CLASS_PREV_STEP_BTN,
   ID_POPOVER,
   POPOVER_HTML,
+} from '../common/constants';
 /**
  * Popover that is displayed on top of the highlighted element

{assets/scripts/src → src/core}/position.js RENAMED Viewed

File without changes

assets/scripts/src/sholo.js → src/index.js RENAMED Viewed

@@ -1,7 +1,7 @@
-import Overlay from './overlay';
-import Element from './element';
-import './polyfill';
-import Popover from './popover';
 import {
   CLASS_CLOSE_BTN,
   CLASS_NEXT_STEP_BTN,
@@ -11,7 +11,7 @@ import {
   OVERLAY_ANIMATE,
   OVERLAY_OPACITY,
   OVERLAY_PADDING, RIGHT_KEY_CODE,
-} from './constants';
 /**
  * Plugin class that drives the plugin

+import Overlay from './core/overlay';
+import Element from './core/element';
+import Popover from './core/popover';
+import './common/polyfill';
 import {
   CLASS_CLOSE_BTN,
   CLASS_NEXT_STEP_BTN,
   OVERLAY_ANIMATE,
   OVERLAY_OPACITY,
   OVERLAY_PADDING, RIGHT_KEY_CODE,
+} from './common/constants';
 /**
  * Plugin class that drives the plugin

assets/styles/scss/demo.scss → src/sholo.scss RENAMED Viewed

@@ -1,51 +1,3 @@
-@import "base";
-$container-width: 500px !default;
-$logo-font-size: 55px !default;
-$button-font-size: 13px !default;
-$dark-button-bg: #2d2d2d !default;
-$dark-button-text: #ffffff !default;
-$light-button-bg: #f5f5f5 !default;
-$light-button-text: #2d2d2d !default;
-.page-wrap {
-  padding-top: 1px;
-  width: $container-width;
-  margin: auto;
-}
-.btn {
-  font-size: $button-font-size;
-  padding: 7px 10px;
-  border-radius: 3px;
-  &.btn__dark {
-    background: $dark-button-bg;
-    color: $dark-button-text;
-  }
-  &.btn__light {
-    background: $light-button-bg;
-    color: $light-button-text;
-  }
-}
-section {
-  margin-bottom: 35px;
-}
-.section__header {
-  margin: 80px 0 50px;
-  text-align: center;
-  display: block;
-  padding: 10px 10px 20px;
-  h1 {
-    font-size: $logo-font-size;
-  }
-}
-/////////////////////////////////////////
 div#sholo-popover-item {
   display: none;
   position: absolute;

 div#sholo-popover-item {
   display: none;
   position: absolute;

webpack.config.dev.js CHANGED Viewed

@@ -5,13 +5,13 @@ module.exports = {
   mode: 'development',
   entry: [
     'webpack-dev-server/client?http://localhost:3000',
-    './assets/styles/scss/demo.scss',
-    './assets/scripts/src/sholo.js',
   ],
   output: {
-    path: path.join(__dirname, '/assets'),
-    publicPath: '/assets/',
-    filename: 'scripts/dist/sholo.js',
     libraryTarget: 'umd',
     library: 'Sholo',
   },
@@ -44,7 +44,7 @@ module.exports = {
   },
   plugins: [
     new ExtractTextPlugin({
-      filename: 'styles/css/demo.css',
       allChunks: true,
     }),
   ],

   mode: 'development',
   entry: [
     'webpack-dev-server/client?http://localhost:3000',
+    './demo/demo.scss',
+    './src/index.js',
   ],
   output: {
+    path: path.join(__dirname, '/dist'),
+    publicPath: '/dist/',
+    filename: 'sholo.js',
     libraryTarget: 'umd',
     library: 'Sholo',
   },
   },
   plugins: [
     new ExtractTextPlugin({
+      filename: 'demo.css',
       allChunks: true,
     }),
   ],