Add the example for loader bar ping pong

raphaelfabeni · raphaelfabeni · commit f326fc6d7655 · 2017-03-05T18:02:07.000-03:00
diff --git a/assets/js/main.js b/assets/js/main.js
@@ -93,6 +93,17 @@
         }
       ]
     },
+    {
+      button: document.getElementById('loader-bar-ping-pong'),
+      className: 'loader-bar-ping-pong'
+    },
+    {
+      button: document.getElementById('loader-bar-ping-pong-rounded'),
+      className: 'loader-bar-ping-pong',
+      attributes: [
+        { attribute: 'data-rounded' }
+      ]
+    },
     {
       button: document.getElementById('loader-border'),
       className: 'loader-border'
diff --git a/dist/main.min.js b/dist/main.min.js
diff --git a/index.html b/index.html
@@ -26,7 +26,7 @@
   <link rel="shortcut icon" href="/favicon.ico" type="image/x-icon" />
 
   <link rel="stylesheet" href="dist/main.min.css">
-  <link rel="stylesheet" href="https://cdn.rawgit.com/raphaelfabeni/css-loader/f0827e4f95cbb54efa00b0da6ee9fed475dfff5c/dist/css-loader.css">
+  <link rel="stylesheet" href="https://cdn.rawgit.com/raphaelfabeni/css-loader/2156b771d4eb452ce8a40ef04bfd41778ccb4003/dist/css-loader.css">
 </head>
 <body>
   <!-- Loader -->
@@ -95,6 +95,16 @@ <h3 class="box__title">Bar</h3>
         </div>
       </div>
 
+      <div class="box">
+        <h3 class="box__title">Bar ping pong</h3>
+        <div class="box__item">
+          <button id="loader-bar-ping-pong" class="button">default</button>
+        </div>
+        <div class="box__item">
+          <button id="loader-bar-ping-pong-rounded" class="button">rounded</button>
+        </div>
+      </div>
+
       <div class="box">
         <h3 class="box__title">Border</h3>
         <div class="box__item">

Original file line number	Diff line number	Diff line change
`@@ -93,6 +93,17 @@`
`93`	`93`	`}`
`94`	`94`	`]`
`95`	`95`	`},`
	`96`	`+ {`
	`97`	`+ button: document.getElementById('loader-bar-ping-pong'),`
	`98`	`+ className: 'loader-bar-ping-pong'`
	`99`	`+ },`
	`100`	`+ {`
	`101`	`+ button: document.getElementById('loader-bar-ping-pong-rounded'),`
	`102`	`+ className: 'loader-bar-ping-pong',`
	`103`	`+ attributes: [`
	`104`	`+ { attribute: 'data-rounded' }`
	`105`	`+ ]`
	`106`	`+ },`
`96`	`107`	`{`
`97`	`108`	`button: document.getElementById('loader-border'),`
`98`	`109`	`className: 'loader-border'`