MD User Manager: Removes external style sheets in Polymer components

chrome/browser/resources/md_user_manager/user_manager_tutorial.html

Index: chrome/browser/resources/md_user_manager/user_manager_tutorial.html
diff --git a/chrome/browser/resources/md_user_manager/user_manager_tutorial.html b/chrome/browser/resources/md_user_manager/user_manager_tutorial.html
index c0716b82ca0a50b520c25738534cbfdc12348b9c..b5540beb8c1c1e654721bceeb6cc403d5d7c1c1b 100644
--- a/chrome/browser/resources/md_user_manager/user_manager_tutorial.html
+++ b/chrome/browser/resources/md_user_manager/user_manager_tutorial.html
@@ -5,11 +5,166 @@
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-button/paper-button.html">
 
 <dom-module id="user-manager-tutorial">
-  <link rel="import" type="css"
-      href="chrome://md-user-manager/user_manager_tutorial.css">
   <link rel="import" type="css" href="chrome://resources/css/action_link.css">
   <template>
-    <style include="shared-styles"></style>
+    <style include="shared-styles">
+      .tutorial-slide {
+        -webkit-transition: opacity 200ms ease-in-out;
+        background-color: white;
+        border-radius: 2px;
+        bottom: 0;
+        box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25);
+        height: 408px;
+        left: 0;
+        margin: auto;
+        position: absolute;
+        right: 0;
+        top: 0;
+        width: 320px;
+        z-index: 100;
+      }
+
+      :host.single-pod #yourChrome,
+      :host.single-pod #complete {
+        -webkit-margin-start: 30px;
+      }
+
+      #guests {
+        bottom: 20px;
+        left: auto;
+        margin: 0;
+        right: 100px;
+        top: auto;
+      }
+
+      :host-context([dir='rtl']) #guests {
+        left: 100px;
+        right: auto;
+      }
+
+      #friends,
+      #notYou {
+        bottom: 20px;
+        left: auto;
+        margin: 0;
+        right: 20px;
+        top: auto;
+      }
+
+      :host-context([dir='rtl']) #friends,
+      :host-context([dir='rtl']) #notYou {
+        left: 20px;
+        right: auto;
+      }
+
+      #notYou {
+        height: 100px;
+        width: 240px;
+      }
+
+      .slide-contents {
+        padding: 0 20px;
+        text-align: center;
+      }
+
+      .slide-title {
+        color: black;
+        font-size: 20px;
+        line-height: 20px;
+        margin: 30px 0;
+      }
+
+      .slide-text {
+        color: var(--google-grey-600);

[Dan Beam, 2016/05/26 23:41:03]

google-grey-600 doesn't exist, did you mean paper-grey-600?

+        font-size: 15px;
+        line-height: 20px;
+      }
+
+      .slide-buttons {
+        bottom: 20px;
+        position: absolute;
+        text-align: center;
+        width: 100%;
+      }
+
+      .slide-buttons [is='action-link'] {
+        width: 100%;
+      }
+
+      .slide-buttons button {
+        bottom: 0;
+        height: 35px;
+        padding: 0 15px;
+        width: 138px;
+      }
+
+      .arrow-down {
+        border-left: 15px solid transparent;
+        border-right: 15px solid transparent;
+        border-top: 15px solid white;
+        bottom: -15px;
+        height: 0;
+        position: absolute;
+        right: 40px;
+        width: 0;
+      }
+
+      :host-context([dir='rtl']) .arrow-down {
+        left: 40px;
+        right: auto;
+      }
+
+      #guests .arrow-down {
+        right: 110px;
+      }
+
+      :host-context([dir='rtl']) #guests .arrow-down {
+        left: 110px;
+        right: auto;
+      }
+
+      .slide-image {
+        height: 182px;
+      }
+
+      #yourChrome .slide-image {
+        background-color: rgb(241, 202, 58);
+        background-image:
+            url(chrome://theme/IDR_ICON_USER_MANAGER_TUTORIAL_YOUR_CHROME);
+      }
+
+      #guests .slide-image {
+        background-color: rgb(90, 196, 144);
+        background-image: url(chrome://theme/IDR_ICON_USER_MANAGER_TUTORIAL_GUESTS);
+      }
+
+      #friends .slide-image {
+        background-color: var(--paper-light-blue-100);
+        background-image:
+            url(chrome://theme/IDR_ICON_USER_MANAGER_TUTORIAL_FRIENDS);
+      }
+
+      #complete .slide-image {
+        background-color: white;
+        background-image:
+            url(chrome://theme/IDR_ICON_USER_MANAGER_TUTORIAL_COMPLETE);
+      }
+
+      #notYou #dismiss {
+        position: absolute;
+        right: 5px;
+        top: 5px;
+      }
+
+      #notYou #slide-add-user {
+        margin-top: 10px;
+      }
+
+      :host-context([dir='rtl']) #notYou #dismiss {
+        left: 5px;
+        right: auto;
+      }
+    </style>
     <template is="dom-if" if="[[!hidden_]]">
       <template is="dom-if"
           if="[[!isStepHidden_(currentStep_, steps_.YOUR_CHROME)]]">