MD User Manager: Display error message when all profiles are locked.

chrome/browser/resources/md_user_manager/error_dialog.html

Index: chrome/browser/resources/md_user_manager/error_dialog.html
diff --git a/chrome/browser/resources/md_user_manager/error_dialog.html b/chrome/browser/resources/md_user_manager/error_dialog.html
new file mode 100644
index 0000000000000000000000000000000000000000..08cc7c78b2b47d7d4d4e473105925cda69aac43d
--- /dev/null
+++ b/chrome/browser/resources/md_user_manager/error_dialog.html
@@ -0,0 +1,61 @@
+<link rel="import" href="chrome://md-user-manager/shared_styles.html">
+<link rel="import" href="chrome://resources/cr_elements/icons.html">
+<link rel="import" href="chrome://resources/html/polymer.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/iron-flex-layout/classes/iron-flex-layout.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-icon-button/paper-icon-button.html">
+
+<dom-module id="error-dialog">
+  <template>
+    <style include="shared-styles">
+      #backdrop {
+        align-items: center;
+        background: rgba(255, 255, 255, 0.6);
+        bottom: 0;
+        display: flex;
+        justify-content: center;
+        left: 0;
+        position: absolute;
+        right: 0;
+        top: 0;
+      }
+
+      #dialog {
+        background: white;
+        border-radius: 2px;
+        box-shadow: 0 16px 24px 2px rgba(0, 0, 0, 0.14),
+                    0 6px 30px 5px rgba(0, 0, 0, 0.12),
+                    0 8px 10px -5px rgba(0, 0, 0, 0.4);
+        color: var(--primary-text-color);
+        width: 512px;
+      }
+
+      #title-bar {
+        padding: 6px;
+      }
+
+      #title-bar paper-icon-button {
+        --paper-icon-button: {
+          padding: 10px;
+        };
+      }
+
+      #message {
+        padding: 10px 16px 62px;
+        white-space: pre-wrap;
+        word-wrap: break-word;
+      }
+    </style>
+    <template is="dom-if" if="[[!popupHidden_]]">
+      <div id="backdrop">

[dpapad, 2016/05/27 23:59:42]

Should we be using <paper-dialog> or re-using <settings-dialog>
(https://code.google.com/p/chromium/codesearch#chromium/src/chrome/browser/res...),
instead of implementing a dialog from scratch here?

For example the <settings-dialog> already comes styled and has an 'x' button at
the top right. See example at http://imgur.com/a/7Bree

[Moe, 2016/05/30 18:33:05]

Ah, i didn't know about those other dialog implementations! This is the second
modal dialog in the user manager. Instead of implementing this one in a
different way or redo them both in this CL, I prefer to "duplicate"
implementation of the other one and refactor them both in a follow up CL
re-using <paper-dialog> or <settings-dialog>. I left a todo here which I will
follow up on this week. WDYT?

[dpapad, 2016/05/31 19:11:59]

SG.

+        <div id="dialog">
+          <div id="title-bar" class="horizontal end-justified layout">
+            <paper-icon-button icon="cr:close" on-tap="onCloseTap_">
+            </paper-icon-button>
+          </div>
+          <div id="message">[[message_]]</div>
+        </div>
+      </div>
+    </template>
+  </template>
+  <script src="chrome://md-user-manager/error_dialog.js"></script>
+</dom-module>