/
index.html
150 lines (127 loc) · 8.65 KB
/
index.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" type="image/png" href="./img/favicon.png">
<title>SocialDig.js | Query data from your social profiles with ease.</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.5.0/css/font-awesome.min.css">
<link href="./css/style.css" rel="stylesheet">
<script src="./js/head.min.js"></script>
<!-- SEO -->
<meta name="description" content="Query data from your social profiles with ease.">
<meta name="author" content="Kyle Brumm">
<!-- Facebook -->
<meta property="og:type" content="website">
<meta property="og:title" content="SocialDig.js | Query data from your social profiles with ease.">
<meta property="og:description" content="Query data from your social profiles with ease.">
<meta property="og:url" content="/">
<meta property="og:image" content="./img/social-dig.png">
<!-- Twitter -->
<meta name="twitter:card" content="summary_large_image">
<meta name="twitter:title" content="SocialDig.js | Query data from your social profiles with ease.">
<meta name="twitter:description" content="Query data from your social profiles with ease.">
<meta name="twitter:url" content="/">
<meta name="twitter:image" content="./img/social-dig.png">
<!-- Google Analytics -->
<!-- Add GA code here -->
</head>
<body>
<!-- Github badge -->
<a href="https://github.com/kjbrum/SocialDig.js" target="_blank" class="github-corner"><svg width="100" height="100" viewBox="0 0 250 250" style="fill:#74728C; color:#ffffff; position: absolute; top: 0; border: 0; right: 0;"><path d="M0,0 L115,115 L130,115 L142,142 L250,250 L250,0 Z"></path><path d="M128.3,109.0 C113.8,99.7 119.0,89.6 119.0,89.6 C122.0,82.7 120.5,78.6 120.5,78.6 C119.2,72.0 123.4,76.3 123.4,76.3 C127.3,80.9 125.5,87.3 125.5,87.3 C122.9,97.6 130.6,101.9 134.4,103.2" fill="currentColor" style="transform-origin: 130px 106px;" class="octo-arm"></path><path d="M115.0,115.0 C114.9,115.1 118.7,116.5 119.8,115.4 L133.7,101.6 C136.9,99.2 139.9,98.4 142.2,98.6 C133.8,88.0 127.5,74.4 143.8,58.0 C148.5,53.4 154.0,51.2 159.7,51.0 C160.3,49.4 163.2,43.6 171.4,40.1 C171.4,40.1 176.1,42.5 178.8,56.2 C183.1,58.6 187.2,61.8 190.9,65.4 C194.5,69.0 197.7,73.2 200.1,77.6 C213.8,80.2 216.3,84.9 216.3,84.9 C212.7,93.1 206.9,96.0 205.4,96.6 C205.1,102.4 203.0,107.8 198.3,112.5 C181.9,128.9 168.3,122.5 157.7,114.1 C157.9,116.9 156.7,120.9 152.7,124.9 L141.0,136.5 C139.8,137.7 141.6,141.9 141.8,141.8 Z" fill="currentColor" class="octo-body"></path></svg></a><style>.github-corner:hover .octo-arm{animation:octocat-wave 560ms ease-in-out}@keyframes octocat-wave{0%,100%{transform:rotate(0)}20%,60%{transform:rotate(-25deg)}40%,80%{transform:rotate(10deg)}}@media (max-width:500px){.github-corner:hover .octo-arm{animation:none}.github-corner .octo-arm{animation:octocat-wave 560ms ease-in-out}}</style>
<!-- Hero Section -->
<section class="section section--hero">
<div class="container">
<h1><img src="./img/social-dig-icon.svg" alt="SocialDig.js Icon"> SocialDig.js</h1>
<h2>Query data from your social profiles with ease.</h2>
</div>
</section>
<!-- Install Section -->
<section class="section section--install">
<div class="container">
<div class="section-heading">
<h3>Install</h3>
<small class="subheading">Feel free to use whichever method is easiest for your project.</small>
<hr>
</div>
<h4>Bower:</h4>
<pre>$ bower install SocialDig.js</pre>
<h4>npm:</h4>
<pre>$ npm install SocialDig.js</pre>
<h4>CDN:</h4>
<pre><script src="https://unpkg.com/SocialDig.js/dist/SocialDig.min.js"></script></pre>
<hr>
<a class="btn btn-secondary btn-outline" href="https://github.com/kjbrum/SocialDig.js/" target="_blank">View on Github</a>
<a class="btn btn-secondary btn-outline" href="https://github.com/kjbrum/SocialDig.js/archive/master.zip">Download Repo</a>
</div>
</section>
<!-- Demo Section -->
<section class="section section--demo">
<div class="container">
<div class="section-heading">
<h3>Let's See Some Demos</h3>
<small class="subheading">Click an icon to view the demo.</small>
<hr>
</div>
<div class="g g-center g-xxs-4 g-s-3 g-m-5 g-l-7">
<div class="gi"><a href="./demos/500px.html"><i class="fa fa-500px"></i></a></div>
<div class="gi"><a href="./demos/behance.html"><i class="fa fa-behance"></i></a></div>
<div class="gi"><a href="./demos/codepen.html"><i class="fa fa-codepen"></i></a></div>
<div class="gi"><a href="./demos/dribbble.html"><i class="fa fa-dribbble"></i></a></div>
<div class="gi"><a href="./demos/flickr.html"><i class="fa fa-flickr"></i></a></div>
<div class="gi"><a href="./demos/github.html"><i class="fa fa-github"></i></a></div>
<div class="gi"><a href="./demos/google-plus.html"><i class="fa fa-google-plus"></i></a></div>
<div class="gi"><a href="./demos/instagram.html"><i class="fa fa-instagram"></i></a></div>
<div class="gi"><a href="./demos/lastfm.html"><i class="fa fa-lastfm"></i></a></div>
<div class="gi"><a href="./demos/pinterest.html"><i class="fa fa-pinterest"></i></a></div>
<div class="gi"><a href="./demos/spotify.html"><i class="fa fa-spotify"></i></a></div>
<div class="gi"><a href="./demos/trello.html"><i class="fa fa-trello"></i></a></div>
<div class="gi"><a href="./demos/tumblr.html"><i class="fa fa-tumblr"></i></a></div>
<div class="gi"><a href="./demos/vimeo.html"><i class="fa fa-vimeo"></i></a></div>
</div>
<div class="g">
<div class="gi">
<p>More coming soon...</p>
</div>
</div>
</div>
</section>
<!-- Documentation Section -->
<section class="section section--documentation">
<div class="container">
<div class="section-heading">
<h3>Documentation</h3>
<small class="subheading">Let's figure out how to work this thing.</small>
<hr>
</div>
<p>Coming soon...</p>
</div>
</section>
<!-- Share Section -->
<section class="section section--share">
<div class="container">
<div class="section-heading">
<h3>Spread the <i class="fa fa-heart"></i></h3>
<small class="subheading">Things are better when shared with friends.</small>
<hr>
</div>
<ul class="social-share">
<li><a href="https://twitter.com/intent/tweet?text=Query+data+from+your+social+profiles+with+ease.&url=http://kylebrumm.com/SocialDig.js"><i class="fa fa-twitter-square"></i></a></li>
<li><a href="http://www.facebook.com/sharer/sharer.php?u=http://kylebrumm.com/SocialDig.js"><i class="fa fa-facebook-square"></i></a></li>
<li><a href="https://plus.google.com/share?url=http://kylebrumm.com/SocialDig.js"><i class="fa fa-google-plus-square"></i></a></li>
<li><a href="http://pinterest.com/pin/create/button/?url=http://kylebrumm.com/SocialDig.js&description=Query+data+from+your+social+profiles+with+ease.&media=http://kylebrumm.com/SocialDig.js/img/social-dig.png"><i class="fa fa-pinterest-square"></i></a></li>
</ul>
</div>
</section>
<!-- Footer -->
<footer class="footer">
<div class="container">
<p>Built with <i class="shake shake-constant fa fa-heart"></i> by <a href="http://kylebrumm.com" target="_blank">Kyle Brumm</a></p>
</div>
</footer>
<!-- JavaScript -->
<script src="./dist/SocialDig.js"></script>
<script src="./js/main.min.js"></script>
</body>
</html>