1/* Copyright 2013 The Chromium Authors. All rights reserved. 2 * Use of this source code is governed by a BSD-style license that can be 3 * found in the LICENSE file. 4 */ 5 6/* Overrides for the desktop user manager screen. */ 7 8.oobe-display { 9 background-color: #eee; 10} 11 12#outer-container { 13 min-height: 0; 14} 15 16.bubble.faded { 17 opacity: 0; 18} 19 20.pod { 21 box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1); 22 height: 226px; 23 /* On non-retina desktop, the text is blurry if we use the scale3d() 24 inherited from user_pod_row.js */ 25 transform: scale(0.9); 26} 27 28podrow[ncolumns='6'] .pod { 29 transform: scale(0.8); 30} 31 32.pod.faded { 33 opacity: .4; 34} 35 36.pod.hovered:not(.focused) { 37 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); 38} 39 40.pod.focused { 41 box-shadow: 0 16px 21px rgba(0, 0, 0, 0.2); 42 transform: scale(1) !important; 43} 44 45.pod.focused.locked { 46 box-shadow: 0 12px 21px rgba(0, 0, 0, 0.2); 47 height: 220px; 48} 49 50.user-image-pane { 51 border-top-left-radius: 2px; 52 border-top-right-radius: 2px; 53 height: 180px; 54 left: 0; 55 top: 0; 56 width: 180px; 57} 58 59html[dir=rtl] .user-image-pane { 60 right: 0; 61} 62 63.pod .name { 64 margin-top: 12px; 65} 66 67.pod .user-image { 68 height: 180px; 69 width: 180px; 70} 71 72.pod input[type='password'] { 73 height: 45px; /* 1px shorter as to not overlap the pod's rounded corners */ 74 top: 1px; 75} 76 77.pod.locked .locked-indicator { 78 background-image: -webkit-image-set( 79 url('chrome://theme/IDR_ICON_PROFILES_LOCKED') 1x, 80 url('chrome://theme/IDR_ICON_PROFILES_LOCKED@2x') 2x); 81 height: 31px; 82 left: 8px; 83 position: absolute; 84 top: 8px; 85 width: 31px; 86} 87 88html[dir=rtl] .pod.locked .locked-indicator { 89 left: auto; 90 right: 8px; 91} 92 93.pod.supervised-user .supervised-indicator { 94 background-image: -webkit-image-set( 95 url('chrome://theme/IDR_ICON_PROFILES_SUPERVISED') 1x, 96 url('chrome://theme/IDR_ICON_PROFILES_SUPERVISED@2x') 2x); 97 height: 31px; 98 left: 8px; 99 position: absolute; 100 top: 8px; 101 width: 31px; 102} 103 104html[dir=rtl] .pod.supervised-user .supervised-indicator { 105 left: auto; 106 right: 8px; 107} 108 109.main-pane { 110 left: 0; 111 top: 0; 112} 113 114html[dir=rtl] .main-pane { 115 right: 0; 116} 117 118.name-container, 119.pod.focused:not(.multiprofiles-policy-applied) .auth-container { 120 top: 180px; 121 width: 180px; 122} 123 124.pod.focused:not(.locked) .name-container { 125 display: block; 126} 127 128.pod .name { 129 color: #363636; 130 font-size: 15px; 131 margin-top: 11px; 132} 133 134.pod.focused:not(.locked) .auth-container { 135 display: none; 136} 137 138.pod.focused.locked .password-entry-container { 139 display: flex; 140 flex: auto; 141} 142 143.action-box-area { 144 background-color: #f5f5f5; 145 height: 24px; 146 /* Because of crbug.com/406529, the text in the .name div is janky if there's 147 an opacity transition in this div. */ 148 transition: none; 149 width: 24px; 150} 151 152.action-box-button, 153.action-box-button:hover, 154.action-box-area.active .action-box-button { 155 background-image: none; 156 border-left: 6px solid transparent; 157 border-right: 6px solid transparent; 158 border-top: 6px solid #989898; 159 height: 0; 160 left: 6px; 161 margin: 0; 162 position: absolute; 163 top: 9px; 164 width: 0; 165} 166 167.action-box-button:hover, 168.action-box-area.active .action-box-button { 169 border-top: 6px solid #4c4c4c; 170} 171 172.action-box-remove-user-warning .remove-warning-button { 173 height: 30px; 174} 175 176.action-box-remove-user-warning .remove-warning-button:focus { 177 /* Override the default blue border inherited from 178 button.custom-appearance:focus. */ 179 border: 1px solid transparent !important; 180 box-shadow: inset 0 0 0 1px #fff; 181} 182