MD User Manager: Overhaul Urls

chrome/browser/resources/md_user_manager/user_manager_styles.html

-<link rel="import" href="chrome://md-user-manager/shared_styles.html">
-
-<dom-module id="user-manager-styles">
-  <template>
-    <style include="shared-styles">
-      body {
-        background-color: var(--paper-grey-100);
-      }
-
-      user-manager-pages,
-      #login-header-bar {
-        bottom: 0;
-        left: 0;
-        position: absolute;
-        right: 0;
-      }
-
-      user-manager-pages {
-        top: 0;
-      }
-
-      #login-header-bar.shadow {
-        box-shadow: 0 -1px 3px rgba(0, 0, 0, .2);
-      }
-
-      /* Overrides src/ui/login/screen_container.css for the desktop user
-       * manager. */
-
-      #outer-container {
-        min-height: 0;
-        overflow-x: hidden;
-        overflow-y: auto;
-        padding: 40px 0 30px;
-        z-index: initial;
-      }
-
-      .bubble.faded {
-        opacity: 0;
-      }
-
-      .pod {
-        box-shadow: 0 2px 2px 0 rgba(0, 0, 0, .24),
-                    0 0 2px 0 rgba(0, 0, 0, .12);
-        color: var(--primary-text-color);
-        cursor: default;
-        height: auto;
-        transform: none;
-        width: auto;
-      }
-
-      .pod.faded {
-        opacity: .6;
-      }
-
-      .pod.focused {
-        box-shadow: 0 10px 10px 0 rgba(0, 0, 0, .26),
-                    0 14px 28px 0 rgba(0, 0, 0, .25);
-      }
-
-      .pod .user-image-gradient-area,
-      .pod .user-image-pane {
-        border-top-left-radius: 2px;
-        border-top-right-radius: 2px;
-      }
-
-      .pod .user-image-pane {
-        overflow: hidden;
-        position: static;
-      }
-
-      .pod .user-image {
-        height: 160px;
-        width: 160px;
-      }
-
-      .pod .main-pane {
-        line-height: 20px;
-        padding: 10px;
-        position: static;
-      }
-
-      .pod .main-pane .name-container {
-        display: block;
-        position: static;
-        width: auto;
-      }
-
-      .pod .main-pane .name-container .name,
-      .reauth-hint-container .reauth-name-hint {
-        color: inherit;
-        font-size: inherit;
-        margin: 0;
-        padding: 0;
-        text-align: initial;
-        width: 120px;
-      }
-
-      .pod .indicator-container {
-        bottom: 10px;
-        height: 20px;
-        left: auto;
-        position: absolute;
-        right: 10px;
-        top: auto;
-        width: 20px;
-      }
-
-      html[dir='rtl'] .pod .indicator-container {
-        left: 10px;
-        right: auto;
-      }
-
-      /* Using -webkit-mask on the indicators allows us to tweak the color. */
-      .pod .indicator-container > .indicator {
-        -webkit-mask-position: center;
-        -webkit-mask-repeat: no-repeat;
-        -webkit-mask-size: 16px;
-        background: var(--paper-grey-600);
-        display: none;
-        height: 100%;
-      }
-
-      .pod.locked .locked-indicator {
-        -webkit-mask-image: url(../../../../ui/webui/resources/images/lock.svg);
-        display: block;
-      }
-
-      .pod.legacy-supervised .legacy-supervised-indicator {
-        -webkit-mask-image:
-            url(../../../../ui/webui/resources/images/supervisor_account.svg);
-        display: block;
-      }
-
-      .pod.child .child-indicator {
-        -webkit-mask-image:
-            url(../../../../ui/webui/resources/images/account_child_invert.svg);
-        display: block;
-      }
-
-      .action-box-area:focus ~ .user-image-gradient-area,
-      .action-box-area.hovered ~ .user-image-gradient-area {
-        background-image: linear-gradient(rgba(0, 0, 0, .2), transparent 100%);
-        display: initial;
-        height: 40px;
-        position: absolute;
-        top: 0;
-        width: 100%;
-      }
-
-      .action-box-area {
-        background-color: transparent;
-      }
-
-      .action-box-area.menu-moved-up {
-        transform: none;
-      }
-
-      .action-box-area .action-box-button {
-        display: none;
-      }
-
-      .action-box-area .action-box-icon {
-        color: white;
-        display: inline-flex;
-        margin-top: 4px;
-      }
-
-      .pod.focused:not(.locked) .auth-container {
-        display: none;
-      }
-
-      .pod.focused:not(.multiprofiles-policy-applied) .auth-container {
-        left: 0;
-      }
-
-      .pod .auth-container input[type='password'] {
-        font: inherit;
-        line-height: inherit;
-        padding: 10px;
-        top: 0;
-        width: 140px;
-      }
-
-      .pod .auth-container input[type='password']:focus {
-        outline: 0;
-      }
-
-      .pod[auth-type='onlineSignIn'] .reauth-hint-container {
-        flex-direction: row-reverse;
-        margin: 0;
-        padding: 10px;
-      }
-
-      .reauth-hint-container .reauth-warning {
-        -webkit-mask-size: 16px;
-        height: 20px;
-        width: 20px;
-      }
-
-      .action-box-area.active .action-box-button {
-        display: none;
-      }
-
-      .action-box-area.active ~ .action-box-menu:not(.menu-moved-up) {
-        top: 8px;
-      }
-
-      .action-box-area.active ~ .action-box-menu {
-        border: none;
-        box-shadow: 0 10px 20px 0 rgba(0, 0, 0, .19);
-        right: 8px;
-        width: 224px;
-      }
-
-      html[dir=rtl] .action-box-area.active ~ .action-box-menu {
-        left: 8px;
-        right: auto;
-      }
-
-      .action-box-menu-title {
-        color: inherit;
-        padding: 16px 12px;
-      }
-
-      .action-box-menu-title-name,
-      .action-box-menu-title-email {
-        height: auto;
-      }
-
-      .action-box-menu-title-email {
-        color: var(--paper-grey-600);
-      }
-
-      .action-box-menu-remove {
-        border-top: var(--user-manager-separator-line);
-        line-height: 32px;
-        padding: 8px 12px;
-      }
-
-      .action-box-remove-user-warning {
-        align-items: center;
-        border-top: var(--user-manager-separator-line);
-        display: flex;
-        flex-direction: column;
-        font-size: inherit;
-        line-height: 20px;
-        padding: 12px;
-      }
-
-      .action-box-remove-user-warning > * {
-        word-wrap: break-word;
-      }
-
-      .total-count,
-      .pod:not(.synced) .action-box-remove-user-warning-text {
-        font-weight: 500;
-      }
-
-      .action-box-remove-user-warning .remove-warning-button {
-        --paper-button: {
-          background: var(--google-red-700);
-          color: white;
-          font-weight: 500;
-        };
-        --paper-button-flat-keyboard-focus: {
-          background: rgb(173, 50, 36);
-        };
-        @apply(--action-button);
-      }
-    </style>
-  </template>
-</dom-module>