From 883a3250e415738af5934c31749c56f58b965ef8 Mon Sep 17 00:00:00 2001
From: Peter Bacon Darwin <pete@bacondarwin.com>
Date: Wed, 26 Apr 2017 21:51:21 +0100
Subject: [PATCH] fix(aio): ensure styling of icons is specific to usage

Previously the CSS styling for material icons was too broad and affected
all instances of icons. This commit constrains the position of copy button
icons only to copy buttons.
---
 aio/src/styles/1-layouts/_sidenav.scss | 8 --------
 aio/src/styles/2-modules/_code.scss    | 9 +++++++--
 2 files changed, 7 insertions(+), 10 deletions(-)

diff --git a/aio/src/styles/1-layouts/_sidenav.scss b/aio/src/styles/1-layouts/_sidenav.scss
index 2e0fec1cbb..3471a66651 100644
--- a/aio/src/styles/1-layouts/_sidenav.scss
+++ b/aio/src/styles/1-layouts/_sidenav.scss
@@ -96,14 +96,6 @@ md-sidenav-container div.mat-sidenav-content {
   width: 100%;
 }
 
-.mat-icon, .material-icons {
-  display: inline-block;
-  position: absolute;
-  top: 6px;
-  right: 8px;
-  color: $mediumgray;
-}
-
 .heading-children.expanded {
   visibility: visible;
   opacity: 1;
diff --git a/aio/src/styles/2-modules/_code.scss b/aio/src/styles/2-modules/_code.scss
index 2d451365ee..060969d8af 100644
--- a/aio/src/styles/2-modules/_code.scss
+++ b/aio/src/styles/2-modules/_code.scss
@@ -88,6 +88,11 @@ aio-code.headed-code {
 }
 
 .copy-button {
+  display: inline-block;
+  position: absolute;
+  top: 6px;
+  right: 8px;
+
   color: $lightgray;
   background-color: transparent;
   border: none;
@@ -95,10 +100,10 @@ aio-code.headed-code {
   &:hover {
     color: $mediumgray;
   }
-  
+
   @media (max-width: 480px) {
     top: 0;
-    bottom: 0;
+    right: 0;
   }
 }