redesign: float headshot to the left of content

_layouts/about.html

@@ -0,0 +1,8 @@
+---
+layout: default
+---
+<div class="container">
+  <img src="img/andaley.jpg" class="me" alt="Noelle Daley headshot">
+  {{ content }}
+</div>
+

_layouts/default.html

@@ -6,7 +6,7 @@
     <div class="wrapper">
       {% include header.html %}
 
-      <section class="content" class="content">
+      <section class="content">
         {{ content }}
       </section>
 

_sass/_colors.scss

@@ -1,8 +1,8 @@
 $text-color:       #252A2A;
 $background-color: #f5f5f5;
-$brand-color:      #4D759D;
 
 $grey-color:       #828282;
 $grey-color-light: lighten($grey-color, 40%);
 $grey-color-dark:  darken($grey-color, 25%);
 $link-color:       #4D759D;
+$border-color: #afafaf;

css/main.scss

@@ -15,14 +15,14 @@ body {
 }
 
 .wrapper {
-  max-width: 800px;
+  max-width: 1000px;
   margin: $spacing-unit auto;
   padding: 0 0%;
 }
 
 a,
 a:visited {
-  border-bottom: 1px dotted #afafaf;
+  border-bottom: 1px dotted $border-color;
   text-decoration: none;
   color: $text-color;
 }
@@ -34,10 +34,7 @@ a:hover {
 
 .logo {
   font-family: $base-font-family;
-  font-weight: bold;
   text-align: center;
-  text-decoration: none;
-  a { color: $link-color; }
 }
 
 .site-nav {
@@ -61,21 +58,11 @@ a:hover {
   }
 }
 
-@media screen and (max-width: 600px) {
-  .logo {
-    margin-top: 80px;
-  }
-
-  .site-nav {
-    left: 0;
-  }
-}
-
 .me {
-  height: 150px;
-  border-radius: 50%;
-  margin: 0 auto 1em auto;
-  display: block;
+  height: 400px;
+  border-radius: 5%;
+  margin: 0 1.75em 0 0;
+  float: left;
 }
 
 .content {
@@ -88,3 +75,19 @@ a:hover {
   font-size: $small-font-size;
   font-style: italic;
 }
+
+@media screen and (max-width: 600px) {
+  .logo {
+    margin-top: 80px;
+  }
+
+  .site-nav {
+    left: 0;
+  }
+
+  .me {
+    display: block;
+    float: none;
+    margin: 0 auto 1em auto;
+  }
+}

index.md

@@ -1,11 +1,9 @@
 ---
-layout: default
+layout: about
 title: About
 permalink: /
 ---
 
-<img src="img/andaley.jpg" class="me" alt="Noelle Daley headshot">
-
 Hello! I'm Noelle, a staff software engineer residing in Portland, OR, where I spend my days leading a frontend engineering team at [HashiCorp](https://www.hashicorp.com/). I'm excited about thoughtful UX/UI design and get a thrill from the challenge of turning chaos into beautiful organization.
 
 My approach to building and designing software is influenced by my varied experiences working in tech over the last decade. As a staff frontend engineer I currently focus on balancing product and design needs, building an organized, reliable UI while helping my teammates grow. In previous roles in community management I advocated for better UIs and APIs and built relationships. My undergraduate degree in sociology equipped me with research methods, systems thinking and a passion for understanding human behavior.  All of these experiences led me to a love of UX.