Create gh-pages branch via GitHub

cezarsmpio · Jun 3, 2016 · 7e96c8d · 7e96c8d
commit 7e96c8d
Show file tree

Hide file tree

Showing 5 changed files with 1,168 additions and 0 deletions.
diff --git a/index.html b/index.html
@@ -0,0 +1,369 @@
+<!DOCTYPE html>
+<html lang="en-us">
+  <head>
+    <meta charset="UTF-8">
+    <title>ShareIt by cezarlz</title>
+    <meta name="viewport" content="width=device-width, initial-scale=1">
+    <link rel="stylesheet" type="text/css" href="stylesheets/normalize.css" media="screen">
+    <link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
+    <link rel="stylesheet" type="text/css" href="stylesheets/stylesheet.css" media="screen">
+    <link rel="stylesheet" type="text/css" href="stylesheets/github-light.css" media="screen">
+  </head>
+  <body>
+    <section class="page-header">
+      <h1 class="project-name">ShareIt</h1>
+      <h2 class="project-tagline">Modern share. No dependencies. Just JS. Just 4kb.</h2>
+      <a href="https://github.com/cezarlz/share" class="btn">View on GitHub</a>
+      <a href="https://github.com/cezarlz/share/zipball/master" class="btn">Download .zip</a>
+      <a href="https://github.com/cezarlz/share/tarball/master" class="btn">Download .tar.gz</a>
+    </section>
+
+    <section class="main-content">
+      <h1>
+<a id="share-it" class="anchor" href="#share-it" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>share-it</h1>
+
+<blockquote>
+<p>Modern share. No dependencies. Just JS. Just 4kb.</p>
+</blockquote>
+
+<p>Use share-it with one click and share your data easily!</p>
+
+<h2>
+<a id="supported-social-networks" class="anchor" href="#supported-social-networks" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Supported Social Networks</h2>
+
+<ul>
+<li><a href="#facebook">Facebook</a></li>
+<li><a href="#twitter">Twitter</a></li>
+<li><a href="#google">Google+</a></li>
+<li><a href="#pinterest">Pinterest</a></li>
+<li><a href="#linked-in">Linked In</a></li>
+<li><a href="#buffer">Buffer</a></li>
+<li><a href="#digg">Digg</a></li>
+<li><a href="#stumbleupon">StumbleUpon</a></li>
+<li><a href="#tumblr">Tumblr</a></li>
+<li><a href="#reddit">Reddit</a></li>
+<li><a href="#evernote">Evernote</a></li>
+<li><a href="#wordpress">Wordpress</a></li>
+<li><a href="#pocket">Pocket</a></li>
+<li><strong><a href="#whatsapp">Whatsapp</a></strong></li>
+</ul>
+
+<h2>
+<a id="install" class="anchor" href="#install" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Install</h2>
+
+<p>Using bower:</p>
+
+<pre><code>bower install --save share-it
+</code></pre>
+
+<h2>
+<a id="usage" class="anchor" href="#usage" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Usage</h2>
+
+<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> share <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">ShareIt</span>({
+  specs<span class="pl-k">:</span> {
+    width<span class="pl-k">:</span> <span class="pl-c1">720</span>,
+    height<span class="pl-k">:</span> <span class="pl-c1">300</span>
+  }
+});
+
+<span class="pl-smi">share</span>.<span class="pl-en">init</span>();</pre></div>
+
+<p>After initialization, just put <code>data-share</code> attribute in your target button or whatever element.</p>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">class</span>=<span class="pl-s"><span class="pl-pds">"</span>btn<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-facebook</span>
+  <span class="pl-e">data-share-facebook-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+&gt;
+  Share on Facebook
+&lt;/<span class="pl-ent">button</span>&gt;
+
+&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">class</span>=<span class="pl-s"><span class="pl-pds">"</span>btn<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-whatsapp</span>
+  <span class="pl-e">data-share-whatsapp-text</span>=<span class="pl-s"><span class="pl-pds">"</span>Hi guys, like share-it!<span class="pl-pds">"</span></span>
+&gt;
+  Share on Whatsapp (only mobile)
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h2>
+<a id="api" class="anchor" href="#api" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>API</h2>
+
+<h3>
+<a id="init-params" class="anchor" href="#init-params" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Init params</h3>
+
+<table>
+<thead>
+<tr>
+<th>Property</th>
+<th>Type</th>
+<th>Default</th>
+<th>Required?</th>
+</tr>
+</thead>
+<tbody>
+<tr>
+<td>specs.width</td>
+<td><code>number</code></td>
+<td><code>550</code></td>
+<td>No</td>
+</tr>
+<tr>
+<td>specs.height</td>
+<td><code>number</code></td>
+<td><code>350</code></td>
+<td>No</td>
+</tr>
+<tr>
+<td>target</td>
+<td><code>string</code></td>
+<td><code>'_blank'</code></td>
+<td>No</td>
+</tr>
+<tr>
+<td>newTab</td>
+<td><code>boolean</code></td>
+<td><code>false</code></td>
+<td>No</td>
+</tr>
+</tbody>
+</table>
+
+<p><em>In <code>specs</code>, you can use another values. <a href="http://www.w3schools.com/jsref/met_win_open.asp">See more here</a>.</em></p>
+
+<p>For example:</p>
+
+<div class="highlight highlight-source-js"><pre><span class="pl-k">var</span> share <span class="pl-k">=</span> <span class="pl-k">new</span> <span class="pl-en">ShareIt</span>({
+  specs<span class="pl-k">:</span> {
+    left<span class="pl-k">:</span> <span class="pl-c1">20</span>,
+    top<span class="pl-k">:</span> <span class="pl-c1">20</span>,
+    menubar<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>no<span class="pl-pds">'</span></span>,
+    titlebar<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>yes<span class="pl-pds">'</span></span>,
+    resizable<span class="pl-k">:</span> <span class="pl-s"><span class="pl-pds">'</span>no<span class="pl-pds">'</span></span>
+  }
+});
+
+<span class="pl-smi">share</span>.<span class="pl-en">init</span>();</pre></div>
+
+<h3>
+<a id="facebook" class="anchor" href="#facebook" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Facebook</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-facebook</span>
+  <span class="pl-e">data-share-facebook-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="twitter" class="anchor" href="#twitter" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Twitter</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-twitter</span>
+  <span class="pl-e">data-share-twitter-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-twitter-title</span>=<span class="pl-s"><span class="pl-pds">"</span>May the force be with you!<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-twitter-via</span>=<span class="pl-s"><span class="pl-pds">"</span>cezar_luiz<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-twitter-hashtags</span>=<span class="pl-s"><span class="pl-pds">"</span>one,two,thre<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="google" class="anchor" href="#google" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Google+</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-google</span>
+  <span class="pl-e">data-share-google-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="pinterest" class="anchor" href="#pinterest" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Pinterest</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-pinterest</span>
+  <span class="pl-e">data-share-pinterest-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-pinterest-img</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com/image.jpg<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-pinterest-is-video</span>=<span class="pl-s"><span class="pl-pds">"</span>1<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-pinterest-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Awesome JS library!<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="linked-in" class="anchor" href="#linked-in" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Linked In</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-linkedin</span>
+  <span class="pl-e">data-share-linkedin-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-linkedin-title</span>=<span class="pl-s"><span class="pl-pds">"</span>My awesome article!<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-linkedin-summary</span>=<span class="pl-s"><span class="pl-pds">"</span>Description here<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-linkedin-source</span>=<span class="pl-s"><span class="pl-pds">"</span>The New York Times<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="buffer" class="anchor" href="#buffer" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Buffer</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-buffer</span>
+  <span class="pl-e">data-share-buffer-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-buffer-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Share It on Buffer!<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="tumblr" class="anchor" href="#tumblr" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Tumblr</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-tumblr</span>
+  <span class="pl-e">data-share-tumblr-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-tumblr-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Share It on Tumblr!<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-tumblr-desc</span>=<span class="pl-s"><span class="pl-pds">"</span>Description of my Tumblr!<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="digg" class="anchor" href="#digg" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Digg</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-digg</span>
+  <span class="pl-e">data-share-digg-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-digg-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Share It on Digg!<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="stumbleupon" class="anchor" href="#stumbleupon" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>StumbleUpon</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-su</span>
+  <span class="pl-e">data-share-su-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-su-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Share It on StumbleUpon!<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="delicious" class="anchor" href="#delicious" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Delicious</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-delicious</span>
+  <span class="pl-e">data-share-delicious-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-delicious-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Save my link on Delicious!<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="reddit" class="anchor" href="#reddit" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Reddit</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-reddit</span>
+  <span class="pl-e">data-share-reddit-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-reddit-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Share on Reddit!<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="evernote" class="anchor" href="#evernote" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Evernote</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-evernote</span>
+  <span class="pl-e">data-share-evernote-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-evernote-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Save my link on Evernote!<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="wordpress" class="anchor" href="#wordpress" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Wordpress</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-wp</span>
+  <span class="pl-e">data-share-wp-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-wp-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Share on Wordpress!<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-wp-desc</span>=<span class="pl-s"><span class="pl-pds">"</span>Description of my link!<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-wp-img</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com/image.jpg<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="pocket" class="anchor" href="#pocket" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Pocket</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-pocket</span>
+  <span class="pl-e">data-share-pocket-url</span>=<span class="pl-s"><span class="pl-pds">"</span>http://example.com<span class="pl-pds">"</span></span>
+  <span class="pl-e">data-share-pocket-title</span>=<span class="pl-s"><span class="pl-pds">"</span>Read later on Pocket!<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<h3>
+<a id="whatsapp" class="anchor" href="#whatsapp" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>Whatsapp</h3>
+
+<div class="highlight highlight-text-html-basic"><pre>&lt;<span class="pl-ent">button</span>
+  <span class="pl-e">data-share</span>
+  <span class="pl-e">data-share-whatsapp</span>
+  <span class="pl-e">data-share-whatsapp-text</span>=<span class="pl-s"><span class="pl-pds">"</span>Share any text on Whatsapp like a message! PS: Works only in smartphones.<span class="pl-pds">"</span></span>
+&gt;
+  Share me!
+&lt;/<span class="pl-ent">button</span>&gt;</pre></div>
+
+<p>&lt;button
+  data-share
+  data-share-whatsapp
+  data-share-whatsapp-text="Share any text on Whatsapp like a message! PS: Works only in smartphones."</p>
+
+<blockquote>
+<p>Share me!
+</p>
+</blockquote>
+
+<h2>
+<a id="license" class="anchor" href="#license" aria-hidden="true"><span aria-hidden="true" class="octicon octicon-link"></span></a>License</h2>
+
+<p>MIT.</p>
+
+<p>Do you like? Fork and contribute :D</p>
+
+<p>Made with <g-emoji alias="heart" fallback-src="https://assets-cdn.github.com/images/icons/emoji/unicode/2764.png">❤️</g-emoji></p>
+
+
+
+
+
+      <footer class="site-footer">
+        <span class="site-footer-owner"><a href="https://github.com/cezarlz/share">ShareIt</a> is maintained by <a href="https://github.com/cezarlz">cezarlz</a>.</span>
+
+        <span class="site-footer-credits">This page was generated by <a href="https://pages.github.com">GitHub Pages</a> using the <a href="https://github.com/jasonlong/cayman-theme">Cayman theme</a> by <a href="https://twitter.com/jasonlong">Jason Long</a>.</span>
+      </footer>
+
+    </section>
+
+
+  </body>
+</html>