From e366c7d71d587d4fa52253d528e914bb2659b135 Mon Sep 17 00:00:00 2001
From: "Rico Sta. Cruz" <rstacruz@users.noreply.github.com>
Date: Sun, 27 Aug 2017 22:06:35 +0800
Subject: [PATCH] Update

---
 _sass/2017/components/body-area.scss    |  8 +---
 _sass/2017/components/page-actions.scss |  8 +++-
 _sass/2017/components/top-nav.scss      | 57 +------------------------
 _sass/2017/variables.scss               |  2 +
 4 files changed, 13 insertions(+), 62 deletions(-)

diff --git a/_sass/2017/components/body-area.scss b/_sass/2017/components/body-area.scss
index d17f6e604..4b8fdaed9 100644
--- a/_sass/2017/components/body-area.scss
+++ b/_sass/2017/components/body-area.scss
@@ -1,9 +1,5 @@
 .body-area {
-  max-width: $column * 3 + 32px;
+  max-width: $area-width;
   margin: 0 auto;
-  padding: 8px;
-
-  @media (min-width: 481px) {
-    padding: 16px;
-  }
+  @include gutter(padding);
 }
diff --git a/_sass/2017/components/page-actions.scss b/_sass/2017/components/page-actions.scss
index 99a9900a9..42cbb90f2 100644
--- a/_sass/2017/components/page-actions.scss
+++ b/_sass/2017/components/page-actions.scss
@@ -9,6 +9,11 @@
     height: 32px;
     line-height: 32px;
     vertical-align: top;
+    width: auto;
+  }
+
+  & > .link.link > a {
+    padding: 0 8px;
   }
 
   &,
@@ -68,6 +73,7 @@
   & > .link.-button > a {
     box-shadow: inset 0 0 0 1px $dark-line-color;
     border-radius: 2px;
-    padding: 0 8px;
+    padding: 0 16px;
+    margin: 0 8px;
   }
 }
diff --git a/_sass/2017/components/top-nav.scss b/_sass/2017/components/top-nav.scss
index a73c7cfaa..1352a5bec 100644
--- a/_sass/2017/components/top-nav.scss
+++ b/_sass/2017/components/top-nav.scss
@@ -9,7 +9,7 @@
   >.container {
     @include gutter(padding-left);
     @include gutter(padding-right);
-    max-width: 1200px;
+    max-width: $area-width;
     margin: 0 auto;
   }
 }
@@ -51,57 +51,4 @@
   }
 }
 
-@mixin action-bar {
-  &,
-  & > li,
-  & > li > a {
-    height: 32px;
-  }
-
-  &,
-  & > li {
-    margin: 0;
-    padding: 0;
-    list-style-type: none;
-  }
-
-  & > li > a,
-  & > li > a:visited {
-    color: $base-mute;
-    text-decoration: none;
-  }
-
-  & > li > a::before {
-    font-size: 16px;
-    height: 32px;
-    width: 32px;
-    line-height: 32px;
-    text-align: center;
-  }
-
-  & > li > a > .text {
-    display: none;
-  }
-
-  & > li > a > .text.-visible {
-    display: inline;
-  }
-}
-
-.page-actions {
-  & {
-    @include action-bar;
-  }
-
-  & > .facebook > a::before {
-    @include ion-icon('logo-facebook');
-  }
-
-  & > .twitter > a::before {
-    @include ion-icon('logo-twitter');
-  }
-
-  & > .github > a::before {
-    @include ion-icon('logo-github');
-  }
-}
+// page-actions.scss
diff --git a/_sass/2017/variables.scss b/_sass/2017/variables.scss
index 1c05d8a28..03ec1ff1a 100644
--- a/_sass/2017/variables.scss
+++ b/_sass/2017/variables.scss
@@ -6,6 +6,8 @@ $gut-small: 8px; // max 480px width
 $gut: 16px;
 $column: 400px;
 
+$area-width: $column * 3 + 32px;
+
 /*
  * Fonts
  */