added star and fork (#258)

Author: AK-007

css/style.css

@@ -246,6 +246,33 @@ header .card-underline{
 #footer{
 	height: 90px;
 }
+#star-box,#fork-box
+{ 
+  padding: 7px;
+  outline: none;
+  user-select: none;
+  border-radius: 5px 0px 0px 5px;
+  background-color: #6B6F74;
+  color: white;
+}
+#star,#fork
+{
+ 
+  padding: 7px;
+  outline: none;
+  user-select: none;
+  border-radius: 0px 5px 5px 0px;
+  background-color: #D3AD7D;
+  color: #14100C;
+}
+.st,.fo
+{
+  position: relative;
+  top: 50%;
+  transform: translate(0%,-50%);
+  margin-left: 10px;
+  left: 60%;
+}
 
 #snow{
   background-image:

index.html

@@ -101,6 +101,18 @@
           <li class="nav-item">
             <a class="nav-link js-scroll-trigger" href="#works">Projects</a>
           </li>
+          <li class="nav-item">
+            <div class="st">
+              <span id="star-box"><i class="fa fa-star" aria-hidden="true"></i>  Stars</span>
+              <span id="star"></span>
+            </div>
+          </li>
+          <li class="nav-item">
+            <div class="fo">
+              <span id="fork-box"><i class="fa fa-code-fork" aria-hidden="true"></i>  Forks</span>
+              <span id="fork"></span>
+            </div>
+          </li>
         </ul>
       </div>
     </div>
@@ -494,5 +506,6 @@ <h4 class="contact_head">Mubaris NK</h4>
 <script src="js/contestant.js"></script>
 <script src="js/projects.js"></script>
 <script src="countDown.js"></script>
+<script src="js/apicall.js"></script>
 
 </html>

js/apicall.js

@@ -0,0 +1,12 @@
+(function($) {
+  "use strict"; // Start of use strict
+   
+  var url="https://api.github.com/orgs/opencode18/repos?callback"; 
+  $.getJSON(url,function(data)
+  {
+    var stars=data[3].watchers;
+    var forks=data[3].forks;
+    $('#star').text(stars);
+    $('#fork').text(forks);
+  });
+})(jQuery);