Merge remote-tracking branch 'origin/master'

5 files changed, 160 insertions, 250 deletions

diff --git a/assets/css/hexagon.css b/assets/css/hexagon.css
index 9384eb3..e6c57f8 100644
--- a/assets/css/hexagon.css
+++ b/assets/css/hexagon.css
@@ -1,18 +1,14 @@
-* {
-    margin: 0 ;
-    padding: 0 ;
-}
 
 .hexLink h1 {
     margin:0;
-    padding: 0 ;
-    font-size: 1.2em !important;
+    padding: 0;
+    font-size: 1.1em ;
 }
 
 .hexLink p{
     margin: 0;
-    padding: 0;
-    font-size: 1em !important;
+    padding: 10px;
+    font-size: 0.9em !important;
 }
 
 /*Only styles like a link if the link is active*/
@@ -36,14 +32,14 @@ a.text p{
 #hexGrid {
     display: flex;
     flex-wrap: wrap;
-    width: 90%;
+    width: 100%;
     margin: 0 auto;
     overflow: hidden;
     font-family: 'Raleway', sans-serif;
     font-size: 15px;
     list-style-type: none;
-    align-items: center;
-    justify-content: center;
+    /*align-items: center;*/
+    /*justify-content: center;*/
 }
 
 .hex {
@@ -111,7 +107,6 @@ a.text p{
 .hex h1 {
     bottom: 50%;
     padding-top:50%;
-    font-size: 1.5em;
     z-index: 1;
     -webkit-transform:translate3d(0,-100%,0);
     -ms-transform:translate3d(0,-100%,0);
@@ -147,10 +142,10 @@ a.text p{
 /*** HEXAGON SIZING AND EVEN ROW INDENTATION *****************************************************************/
 @media (min-width:1201px) { /* <- 5-4  hexagons per row */
     #hexGrid{
-        padding-bottom: 4.4%
+        padding-bottom: 6.4%;
     }
     .hex {
-        width: 15%; /* = 100 / 5 */
+        width: 20%; /* = 100 / 5 */
     }
     .hex:nth-child(9n+6){ /* first hexagon of even rows */
         margin-left:10%;  /* = width of .hex / 2  to indent even rows */
@@ -189,7 +184,7 @@ a.text p{
         width: 50%; /* = 100 / 3 */
     }
     .hex:nth-child(3n+3){ /* first hexagon of even rows */
-        margin-left:0;  /* = width of .hex / 2  to indent even rows */
+        margin-left:25%;  /* = width of .hex / 2  to indent even rows */
     }
 }
 
diff --git a/assets/css/index.css b/assets/css/index.css
new file mode 100644
index 0000000..ebe20be
--- /dev/null
+++ b/assets/css/index.css
@@ -0,0 +1,98 @@
+/*Stuff for icons*/
+ul.icons {
+    cursor: default;
+    list-style: none;
+    padding-left: 0;
+    margin-top: -0.675em;
+}
+
+ul.icons li {
+    display: inline-block;
+    padding: 0.675em 0.5em;
+}
+
+ul.icons li a {
+    text-decoration: none;
+    position: relative;
+    display: block;
+    width: 7em;
+    height: 7em;
+    border-radius: 100%;
+    border: solid 1px grey;
+    line-height: 6.75em;
+    overflow: hidden;
+    text-align: center;
+    white-space: nowrap;
+}
+
+ul.icons li a img{
+    width: 5em;
+    height: 5em;
+}
+
+ul.icons li a:before {
+    -moz-osx-font-smoothing: grayscale;
+    -webkit-font-smoothing: antialiased;
+    display: inline-block;
+    font-style: normal;
+    font-variant: normal;
+    text-rendering: auto;
+    line-height: 1;
+    text-transform: none !important;
+    font-weight: 400;
+}
+
+ul.icons li a:before {
+    color: #ffffff;
+    text-shadow: 1.25px 0px 0px lightgray, -1.25px 0px 0px lightgray, 0px 1.25px 0px lightgray, 0px -1.25px 0px lightgray;
+}
+
+ul.icons li a:hover:before {
+    text-shadow: 1.25px 0px 0px #454545, -1.25px 0px 0px #454545, 0px 1.25px 0px #454545, 0px -1.25px 0px #454545;
+}
+
+ul.icons li a:before {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: inherit;
+    height: inherit;
+    font-size: 4rem;
+    line-height: inherit;
+    text-align: center;
+    text-indent: 0;
+}
+
+ul.icons li a:hover {
+    border-color: #454545;
+}
+
+@media screen and (max-width: 480px) {
+
+    ul.icons li a:before {
+        font-size: 1.5rem;
+    }
+
+}
+
+/*Skills images*/
+
+img.skills{
+    width: 80px;
+    height: 80px;
+}
+
+img.experience{
+    width: 150px;
+    height: 180px;
+}
+
+a.unset{
+    all:unset
+}
+
+img.schools{
+    width: 60px;
+    height: 60px;
+}
+
diff --git a/assets/css/style.css b/assets/css/style.css
index a2dc54c..afa22db 100644
--- a/assets/css/style.css
+++ b/assets/css/style.css
@@ -97,7 +97,7 @@ h4,
 h5,
 h6 {
   color: #000;
-  font-family: Cantarell, sans-serif;
+  font-family: Roboto, sans-serif;
   line-height: 1.2;
   margin-top: 0;
 }
@@ -295,12 +295,6 @@ body {
   justify-content: center
 }
 
-ol,
-/*ul {*/
-/*  list-style-type: none;*/
-/*  margin: 0*/
-/*}*/
-
 img {
   vertical-align: middle;
   border: 0
@@ -463,10 +457,6 @@ a:hover {
   font-family: playfair display, serif !important
 }
 
-.font-tertiary {
-  font-family: bwn !important
-}
-
 .shadow {
   box-shadow: 0 18px 39.1px 6.9px rgba(224, 241, 255, .34) !important
 }
@@ -490,32 +480,6 @@ a:hover {
   color: #c8d5ef
 }
 
-.slick-dots {
-  text-align: center;
-  padding-left: 0
-}
-
-.slick-dots li {
-  display: inline-block;
-  margin: 2px
-}
-
-.slick-dots li.slick-active button {
-  background: #fff;
-  width: 25px
-}
-
-.slick-dots li button {
-  height: 6px;
-  width: 12px;
-  background: rgba(255, 255, 255, .5);
-  color: transparent;
-  border-radius: 10px;
-  overflow: hidden;
-  transition: .2s ease;
-  border: 0
-}
-
 .form-control {
   border: 0;
   border-radius: 0;
@@ -662,44 +626,6 @@ textarea.form-control {
   overflow: hidden
 }
 
-.wave {
-  position: absolute;
-  width: 100%;
-  height: 100%
-}
-
-.wave::before,
-.wave::after {
-  content: "";
-  position: absolute;
-  width: 800px;
-  height: 800px;
-  bottom: 0;
-  left: 50%;
-  background-color: rgba(255, 255, 255, .4);
-  border-radius: 45%;
-  transform: translateX(-50%) rotate(0);
-  animation: rotate 6s linear infinite;
-  z-index: 10
-}
-
-.wave::after {
-  border-radius: 47%;
-  background-color: rgba(255, 255, 255, .9);
-  transform: translateX(-50%) rotate(0);
-  animation: rotate 10s linear -5s infinite;
-  z-index: 20
-}
-
-@keyframes rotate {
-  50% {
-    transform: translateX(-50%) rotate(180deg)
-  }
-
-  100% {
-    transform: translateX(-50%) rotate(360deg)
-  }
-}
 
 .edu-bg-image {
   position: absolute;
@@ -777,53 +703,6 @@ textarea.form-control {
   text-align: center
 }
 
-.testimonial-content strong {
-  color: #2bfdff;
-  font-weight: 400
-}
-
-.testimonial-bg-shapes .container {
-  position: relative;
-  z-index: 1
-}
-
-.testimonial-bg-shapes .bg-map {
-  position: absolute;
-  left: 50%;
-  top: 50%;
-  transform: translate(-50%, -50%)
-}
-
-.testimonial-bg-shapes .bg-shape-1 {
-  position: absolute;
-  left: 100px;
-  top: -50px
-}
-
-.testimonial-bg-shapes .bg-shape-2 {
-  position: absolute;
-  right: 150px;
-  top: 50px
-}
-
-.testimonial-bg-shapes .bg-shape-3 {
-  position: absolute;
-  right: 50px;
-  top: 200px
-}
-
-.testimonial-bg-shapes .bg-shape-4 {
-  position: absolute;
-  left: 100px;
-  bottom: 200px
-}
-
-.testimonial-bg-shapes .bg-shape-5 {
-  position: absolute;
-  right: 200px;
-  bottom: -50px
-}
-
 .footer-section {
   padding-top: 0;
   background: #fafafa;
@@ -863,15 +742,6 @@ textarea.form-control {
   }
 }
 
-blockquote {
-  display: inline-block;
-  padding: 10px 20px;
-  background: #eaeaea;
-  border-left: 2px solid #41228e;
-  font-style: italic;
-  font-size: 22px
-}
-
 .content * {
   margin-bottom: 20px
 }
@@ -926,74 +796,3 @@ blockquote {
   font-weight: 700
 }
 
-/*Stuff for icons*/
-ul.icons {
-    cursor: default;
-    list-style: none;
-    padding-left: 0;
-    margin-top: -0.675em;
-}
-
-ul.icons li {
-    display: inline-block;
-    padding: 0.675em 0.5em;
-}
-
-ul.icons li a {
-    text-decoration: none;
-    position: relative;
-    display: block;
-    width: 7em;
-    height: 7em;
-    border-radius: 100%;
-    border: solid 1px grey;
-    line-height: 6.75em;
-    overflow: hidden;
-    text-align: center;
-    white-space: nowrap;
-}
-
-ul.icons li a:before {
-    -moz-osx-font-smoothing: grayscale;
-    -webkit-font-smoothing: antialiased;
-    display: inline-block;
-    font-style: normal;
-    font-variant: normal;
-    text-rendering: auto;
-    line-height: 1;
-    text-transform: none !important;
-    font-weight: 400;
-}
-
-ul.icons li a:before {
-    color: #ffffff;
-    text-shadow: 1.25px 0px 0px lightgray, -1.25px 0px 0px lightgray, 0px 1.25px 0px lightgray, 0px -1.25px 0px lightgray;
-}
-
-ul.icons li a:hover:before {
-    text-shadow: 1.25px 0px 0px #454545, -1.25px 0px 0px #454545, 0px 1.25px 0px #454545, 0px -1.25px 0px #454545;
-}
-
-ul.icons li a:before {
-    position: absolute;
-    top: 0;
-    left: 0;
-    width: inherit;
-    height: inherit;
-    font-size: 4rem;
-    line-height: inherit;
-    text-align: center;
-    text-indent: 0;
-}
-
-ul.icons li a:hover {
-    border-color: #454545;
-}
-
-@media screen and (max-width: 480px) {
-
-    ul.icons li a:before {
-        font-size: 1.5rem;
-    }
-
-}
\ No newline at end of file
diff --git a/layouts/index.html b/layouts/index.html
index b820ec9..988e7ea 100644
--- a/layouts/index.html
+++ b/layouts/index.html
@@ -1,4 +1,11 @@
 {{ define "main" }}
+{{ "<!-- Hexagon Stylesheet -->" | safeHTML }}
+{{ $hexagons := resources.Get "css/hexagon.css" | minify }}
+<link rel="stylesheet" href="{{ $hexagons.Permalink | relURL}}">
+
+{{ "<!-- Index -->" | safeHTML }}
+{{ $index := resources.Get "css/index.css" | minify }}
+<link rel="stylesheet" href="{{ $index.Permalink | relURL}}">
 <!--
   _    _
  | |  | |                             /\
@@ -38,19 +45,19 @@
       {{ end }}
       {{ end }}
       {{ if .Site.Data.homepage.social.twitter }}
-      <li><a href="https://twitter.com/{{ .Site.Data.homepage.social.twitter }}"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/twitter.svg" style="width: 5em; height: 5em"></a></li>
+      <li><a href="https://twitter.com/{{ .Site.Data.homepage.social.twitter }}"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/twitter.svg" ></a></li>
       {{ end }} {{ if .Site.Data.homepage.social.linkedin }}
-      <li><a href="https://www.linkedin.com/in/{{ .Site.Data.homepage.social.linkedin }}" aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/linkedin.svg" style="width: 5em; height: 5em"></a></li>
+      <li><a href="https://www.linkedin.com/in/{{ .Site.Data.homepage.social.linkedin }}" aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/linkedin.svg"></a></li>
       {{ end }} {{ if .Site.Data.homepage.social.github }}
-      <li><a href="https://github.com/{{ .Site.Data.homepage.social.github }}"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/github-icon.svg" style="width: 5em; height: 5em"> </a></li>
+      <li><a href="https://github.com/{{ .Site.Data.homepage.social.github }}"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/github-icon.svg"> </a></li>
       {{ end }} {{ if .Site.Data.homepage.social.gitlab }}
-      <li><a href="https://gitlab.com/{{ .Site.Data.homepage.social.gitlab }}" aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/gitlab.svg" style="width: 5em; height: 5em"></a></li>
+      <li><a href="https://gitlab.com/{{ .Site.Data.homepage.social.gitlab }}" aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/gitlab.svg"></a></li>
       {{ end }} {{ if .Site.Data.homepage.social.facebook }}
-      <li><a href="https://www.facebook.com/{{ .Site.Data.homepage.social.facebook }}"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/facebook.svg" style="width: 5em; height: 5em"></a></li>
+      <li><a href="https://www.facebook.com/{{ .Site.Data.homepage.social.facebook }}"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/facebook.svg"></a></li>
       {{ end }} {{ if .Site.Data.homepage.social.instagram }}
-      <li><a href="https://instagram.com/{{ .Site.Data.homepage.social.instagram }}"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/instagram-icon.svg" style="width: 5em; height: 5em"></a></li>
+      <li><a href="https://instagram.com/{{ .Site.Data.homepage.social.instagram }}"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/instagram-icon.svg"></a></li>
       {{ end }}{{ if .Site.Data.homepage.social.gmail }}
-      <li><a href="mailto:{{ .Site.Data.homepage.social.gmail }}@gmail.com"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/google-gmail.svg" style="width: 5em; height: 5em"></a></li>
+      <li><a href="mailto:{{ .Site.Data.homepage.social.gmail }}@gmail.com"  aria-hidden="true"></i> <img class="contain" src="https://cdn.svgporn.com/logos/google-gmail.svg"></a></li>
       {{ end }}
     </ul>
 </div>
@@ -111,7 +118,7 @@
       </div>
       <div class="modal-body">
 
-        <p style="white-space: pre-line">{{.description | safeHTML}}</p>
+        <p>{{.description | safeHTML}}</p>
 
       </div>
       <div class="modal-footer">
@@ -135,7 +142,7 @@
         <div class="row justify-content-center">
           {{ range .Site.Data.homepage.skill.item }}
           <div class="imagemargin col-lg-2 col-md-4 col-sm-6 col-6 text-center">
-            <img class="contain lazy" src="" data-src="{{.logo}}" style="width: 80px;height: 80px" alt="{{.company}}" data-toggle="modal" data-target="#{{ replace (replace .title " " "_") "." "_" }}">
+            <img class="contain lazy skills" src="" data-src="{{.logo}}" alt="{{.company}}" data-toggle="modal" data-target="#{{ replace (replace .title " " "_") "." "_" }}">
             <h4>{{.title }}</h4>
           </div>
           {{ end }}
@@ -160,6 +167,9 @@
 
 -->
 
+
+
+
   {{ if .Site.Data.homepage.experience.enable }}
   <!-- experience -->
   <section class="section">
@@ -168,16 +178,34 @@
         <div class="col-lg-12 text-center">
           <h2 class="section-title">Experience</h2>
         </div>
+
+
+        <div class="uk-child-width-1-4@l uk-child-width-1-2  uk-text-center uk-flex-between" uk-grid style="padding-left: 20px; padding-right: 20px">
+
         {{ range .Site.Data.homepage.experience.item }}
-        <div class="col-lg-3 col-md-4 col-sm-6 col-8 text-center">
-          <img class="contain lazy" src="" data-src="{{.logo}}" style="width: 110px;height: 130px" alt="{{.company}}">
-          <p class="mb-0">{{.duration}}</p>
-          <h4>{{.title }}</h4>
-          <h6 class="text-dark">{{.company }}</h6>
-        </div>
+          <div>
+            <div class="uk-card uk-card-default uk-height-large">
+              <div class="uk-card-media-top">
+                <img class="contain experience" src="{{.logo}}" alt="" style="padding: 20px">
+              </div>
+              <div class="uk-card-body" style="padding-top: 0">
+                <div style="height: 5em">
+                <h3 class="uk-card-title">{{.title}}</h3>
+                  </div>
+                <p style="height: 4em">{{.company}}</p>
+                <p>{{.duration}}</p>
+              </div>
+            </div>
+          </div>
         {{ end }}
-      </div>
-    </div>
+        </div>
+
+
+
+
+
+
+
   </section>
   <!-- ./experience -->
   {{ end }}
@@ -185,7 +213,7 @@
 
 
 <!--Hackathons-->
-<section class="section" style="margin-bottom: 0; padding-bottom: 0">
+<section class="section" >
   <div class="container">
     <div class="row justify-content-around">
       <div class="col-lg-12 text-center">
@@ -195,7 +223,7 @@
     </div>
   </div>
 </section>
-<div class="text-center">
+<div class="text-center container">
   <ul id="hexGrid">
   {{range .Site.Data.homepage.hackathons.item}}
     <li class="hex">
@@ -203,12 +231,12 @@
         <div class="hexLink">
           <img src="{{.image}}" alt="{{.title}}" />
 
-            <a href="{{.url}}" style="all:unset;" class="text">
+            <a href="{{.url}}" class="text unset">
 
           <h1>
             {{.title}}</h1></a>
 
-            <a href="{{.url}}" style="all:unset;" class="text">
+            <a href="{{.url}}" class="text unset">
               <p>
               {{.description}}</p></a>
         </div>
@@ -242,7 +270,7 @@
         <div class="col-lg-6 col-md-6 mb-80">
           <div class="d-flex">
             <div class="mr-lg-5 mr-3">
-              <i class="icon icon-light icon-bg bg-white shadow rounded-circle d-block"><img class="contain lazy" src="" data-src="{{.image}}" style="width: 60px;height: 60px" alt="{{.academy}}"></i>
+              <i class="icon icon-light icon-bg bg-white shadow rounded-circle d-block"><img class="contain lazy schools" src="" data-src="{{.image}}" alt="{{.academy}}"></i>
             </div>
             <div>
               <p class="text-dark mb-1">{{.year}}</p>
@@ -254,18 +282,11 @@
         {{ end }}
       </div>
     </div>
-    <!-- bg image -->
-<!--    <img class="img-fluid edu-bg-image w-100 lazy" src="" data-src="{{`images/backgrounds/education-bg.png`|relURL}}" alt="bg-image">-->
   </section>
   <!-- /education -->
   {{ end }}
 
-<!--<div class="container main-content">-->
-<!--  <div id = "epic">-->
-<!--  </div>-->
-<!--  <div id="grid" style="position: relative; margin-bottom: 20px;">-->
-<!--  </div>-->
-<!--</div>-->
+
 
 <!--Handle the lazy loading-->
 
diff --git a/layouts/partials/head.html b/layouts/partials/head.html
index 0428f77..857e18f 100644
--- a/layouts/partials/head.html
+++ b/layouts/partials/head.html
@@ -19,9 +19,6 @@
   {{ $styles := resources.Get "css/style.css" | minify }}
   <link rel="stylesheet" href="{{ $styles.Permalink | relURL}}" integrity="{{ $styles.Data.Integrity }}" media="screen">
 
-  {{ "<!-- Hexagon Stylesheet -->" | safeHTML }}
-  {{ $styles2 := resources.Get "css/hexagon.css" | minify }}
-  <link rel="stylesheet" href="{{ $styles2.Permalink | relURL}}">
 
 
   {{ "<!--Favicon-->" | safeHTML }}