Merge pull request #626 from 18F/new-candidate-page-styles

Styles for new Candidate pages

scss/components/_side-nav.scss

@@ -18,24 +18,24 @@
 
 .side-nav {
   display: none;
-}
 
-.side-nav__item {
-  padding: u(1rem 0);
+  .side-nav__item {
+    padding: u(1rem 0);
 
-  &:first-child {
-    padding-top: 0;
-  }
+    &:first-child {
+      padding-top: 0;
+    }
 
-  &:last-child {
-    padding-bottom: 0;
-  }
+    &:last-child {
+      padding-bottom: 0;
+    }
 
-  &.is-disabled {
-    .side-nav__link {
-      &:hover,
-      &:focus {
-        background-color: transparent;
+    &.is-disabled {
+      .side-nav__link {
+        &:hover,
+        &:focus {
+          background-color: transparent;
+        }
       }
     }
   }
@@ -58,6 +58,42 @@
   }
 }
 
+.side-nav-alt {
+  display: table-cell;
+  width: 100%;
+
+  ul {
+    margin: u(0 2rem 2rem 0);
+  }
+
+  .side-nav__item {
+    border-bottom: 1px solid $gray;
+
+    &:last-child {
+      border-bottom: none;
+    }
+  }
+
+  .side-nav__link {
+    padding: u(.85rem 1rem .85rem 1.8rem);
+
+    &:hover,
+    &.is-active:hover {
+      background-color: $gray-lightest;
+    }
+
+    &[aria-selected=true] {
+      background-color: initial;
+      border-left: 4px solid $base;
+      padding-left: 1.4rem;
+    }
+  }
+
+  @include media($med) {
+    width: 250px;
+  }
+}
+
 @include media($med) {
   .side-nav {
     display: block;

scss/layout/_layout.scss

@@ -78,6 +78,17 @@
   position: relative;
 }
 
+.main__content--right-full {
+  @include clearfix();
+  position: relative;
+  width: 100%;
+
+  @include media($med) {
+    display: table-cell;
+    width: calc(100% - 4rem);
+  }
+}
+
 .content__section {
   @include clearfix();
   padding: u(0 0 2rem 0);
@@ -120,7 +131,7 @@
   padding-bottom: u(2rem);
 }
 
-.u-padding-left {
+.u-padding--left {
   padding-left: u(2rem);
 }