Added github cards to about me

static/src/less/homepage.less

@@ -5,11 +5,11 @@
     background-size: cover;
     background-position: fixed;
     .jumbotron {
-      margin-top: 15vh; 
-      text-align: center; 
-      background-color: transparent; 
-      color: white; 
-      padding-bottom: 0; 
+      margin-top: 15vh;
+      text-align: center;
+      background-color: transparent;
+      color: white;
+      padding-bottom: 0;
       margin-bottom: 0;
       h1 {
         margin-bottom: 15px;
@@ -34,10 +34,10 @@
   #intro-text {
     background-color: #333;
     .container {
-      text-align: center; 
-      margin-top: 35px; 
-      margin-bottom: 35px; 
-      color: white; 
+      text-align: center;
+      margin-top: 35px;
+      margin-bottom: 35px;
+      color: white;
       font-size: 18px;
     }
   }
@@ -50,8 +50,8 @@
       background-attachment: initial;
     }
     .container {
-      text-align: center; 
-      margin-top: 27px; 
+      text-align: center;
+      margin-top: 27px;
       margin-bottom: 35px;
       h1 {
         margin-top: 0;
@@ -111,8 +111,8 @@
       background-attachment: initial;
     }
     .container {
-      text-align: center; 
-      margin-top: 27px; 
+      text-align: center;
+      margin-top: 27px;
       margin-bottom: 35px;
       h1 {
         margin-top: 0;
@@ -146,7 +146,7 @@
         height: 240px;
         width: 240px;
         margin-bottom: 15px;
-      }          
+      }
     }
     @media screen and (min-width: @screen-sm-min) {
       &, & .project {

static/src/less/style.less

@@ -1,30 +1,13 @@
 @import "node_modules/bootstrap/less/bootstrap";
 @import "node_modules/bootstrap/less/theme";
 @import "node_modules/ionicons/less/ionicons";
+@import "node_modules/less-mixins/index.less";
 // @import url(https://fonts.googleapis.com/css?family=Roboto:400,300,400italic,700);
 @import (inline) "node_modules/animate.css/animate.css";
 @import (inline) "node_modules/normalize.css/normalize.css";
 @import 'homepage';
 @import 'variables';
 
-
-/* @group Mixins */
-.transition(@value) {
-    -webkit-transition: @value;
-    -moz-transition: @value;
-    -o-transition: @value;
-    -ms-transition: @value;
-    transition: @value;
-}
-
-.box-shadow(@value) {
-  -webkit-box-shadow: @value;
-  -moz-box-shadow: @value;
-  box-shadow: @value;
-}
-/* @end Mixins */
-
-
 /* @group Global */
 .btn {
   .transition(~"ease-in-out .4s background-color");
@@ -141,3 +124,11 @@ footer {
   .box-shadow(0px 4px 4px 3px rgba(0,0,0,0.6));
   margin-bottom: 40px;
 }
+
+.row {
+  width: 100%;
+}
+
+.gh-card iframe {
+  .box-shadow(0px 4px 4px 3px rgba(0,0,0,0.6));
+}

templates/about/me.html

@@ -12,4 +12,16 @@
   </div>
 </div>
 
+<div class="container">
+  <div class="row">
+    <div class="col-sm-8">
+      <p>Stuff</p>
+    </div>
+    <div class="col-sm-4 gh-card">
+      <div data-theme="medium" data-github="RealOrangeOne" class="github-card"></div>
+    </div>
+  </div>
+</div>
+
+<script async defer src="//cdn.jsdelivr.net/github-cards/latest/widget.js"></script>
 {% endblock %}