Add top of layout

Author: Sophie Shepherd

Gemfile

@@ -1,2 +1,3 @@
 source 'https://rubygems.org'
 gem 'github-pages', group: :jekyll_plugins
+gem 'jekyll-octicons'

Gemfile.lock

@@ -125,6 +125,9 @@ GEM
       activesupport (~> 4.0)
       html-pipeline (~> 2.3)
       jekyll (~> 3.0)
+    jekyll-octicons (8.0.0)
+      jekyll (~> 3.1)
+      octicons (= 8.0.0)
     jekyll-optional-front-matter (0.3.0)
       jekyll (~> 3.0)
     jekyll-paginate (1.1.0)
@@ -209,6 +212,8 @@ GEM
     multipart-post (2.0.0)
     nokogiri (1.9.1)
       mini_portile2 (~> 2.4.0)
+    octicons (8.0.0)
+      nokogiri (>= 1.6.3.1)
     octokit (4.13.0)
       sawyer (~> 0.8.0, >= 0.5.3)
     pathutil (0.16.2)
@@ -245,6 +250,7 @@ PLATFORMS
 
 DEPENDENCIES
   github-pages
+  jekyll-octicons
 
 BUNDLED WITH
-   1.16.1
+   2.0.1

_config.yml

@@ -1,5 +1,9 @@
 title: Brandon Rosage
 description: description XYZ
+email: [email protected]
 
 sass:
   sass_dir: node_modules
+
+gems:
+  - jekyll-octicons

_layouts/stacked.html

@@ -3,13 +3,31 @@
 {% assign user = site.github.organization_members[0] %}
 
 <div class="container-lg py-6 p-responsive text-center">
-  <img src="{{ user.avatar_url }}" class="circle mb-3" style="max-width: 180px;">
-  <h1 class="h0 mb-2">{{ site.github.project_title }}</h1>
-  <p class="f4">
-    <a href="https://github.com/{{ user.login }}">
-      @{{ user.login }}
-    </a>
+  <img src="{{ user.avatar_url }}" class="circle mb-3" style="max-width: 150px;">
+  <h1 class="mb-2">{{ site.title }}</h1>
+  <p class="col-lg-8 mx-auto mb-3 f3 text-gray">
+    Hi! I'm Ben. I love two things: bridges and smiling. I'm an aspiring developer who is learning how to use GitHub to build the stuff I wish existed. I'm looking to meet other developers who can help to contribute to the projects I have started.
   </p>
+  <div class="f4 mb-3">
+    <div class="d-inline-block mr-3">
+      {% octicon mark-github height:20 class:"mr-1 v-align-middle" aria-label:GitHub %}
+      <a href="https://github.com/{{ user.login }}">
+        @{{ user.login }}
+      </a>
+    </div>
+    <div class="d-inline-block mr-3">
+      {% octicon mail height:20 class:"mr-1 v-align-middle" aria-label:Email %}
+      <a href="mailto:{{ user.email }}">
+        {{ site.email }}
+      </a>
+    </div>
+    <div class="d-inline-block">
+      {% octicon location height:20 class:"mr-1 v-align-middle" aria-label:Location %}
+      <a href="https://github.com/{{ user.login }}">
+        Austin, TX
+      </a>
+    </div>
+  </div>
 </div>
 
 {{ content }}