Upstream version 11.39.250.0

[platform/framework/web/crosswalk.git] / src / ui / login / account_picker / user_pod_row.css

diff --git a/src/ui/login/account_picker/user_pod_row.css b/src/ui/login/account_picker/user_pod_row.css
index 089dc5e..b8c764d 100644 (file)
--- a/src/ui/login/account_picker/user_pod_row.css
+++ b/src/ui/login/account_picker/user_pod_row.css
@@ -214,6 +214,7 @@ html[dir=rtl] .main-pane {
   display: block;
   flex: auto;
   margin-top: 11px;
+  outline: 0;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
@@ -225,6 +226,8 @@ html[dir=rtl] .main-pane {
   background-position: center;
   background-repeat: no-repeat;
   flex: none;
+  height: 27px;
+  width: 27px;
 }
 
 .custom-icon.faded {
@@ -232,6 +235,75 @@ html[dir=rtl] .main-pane {
                       visibility 200ms ease-in-out;
 }
 
+.custom-icon-hardlocked {
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_HARDLOCKED');
+}
+
+.custom-icon-hardlocked.icon-with-tooltip:hover {
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_HARDLOCKED_HOVER');
+}
+
+.custom-icon-hardlocked.interactive-custom-icon:active {
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_HARDLOCKED_PRESSED');
+}
+
+.custom-icon-locked {
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_LOCKED');
+}
+
+.custom-icon-locked.icon-with-tooltip:hover {
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_LOCKED_HOVER');
+}
+
+.custom-icon-locked.interactive-custom-icon:active {
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_LOCKED_PRESSED');
+}
+
+.custom-icon-unlocked {
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_UNLOCKED');
+}
+
+.custom-icon-unlocked.icon-with-tooltip:hover {
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_UNLOCKED_HOVER');
+}
+
+.custom-icon-unlocked.interactive-custom-icon:active {
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_UNLOCKED_PRESSED');
+}
+
+/**
+ * Preloads resources for custom icon. Without this, the resources will be
+ * loaded when CSS properties using them are first applied, which has visible
+ * delay and may cause a short white flash when the icon background changes.
+ */
+.custom-icon::after {
+  content:
+    url('chrome://theme/IDR_EASY_UNLOCK_HARDLOCKED')
+    url('chrome://theme/IDR_EASY_UNLOCK_HARDLOCKED_HOVER')
+    url('chrome://theme/IDR_EASY_UNLOCK_HARDLOCKED_PRESSED')
+    url('chrome://theme/IDR_EASY_UNLOCK_LOCKED')
+    url('chrome://theme/IDR_EASY_UNLOCK_LOCKED_HOVER')
+    url('chrome://theme/IDR_EASY_UNLOCK_LOCKED_PRESSED')
+    url('chrome://theme/IDR_EASY_UNLOCK_UNLOCKED')
+    url('chrome://theme/IDR_EASY_UNLOCK_UNLOCKED_HOVER')
+    url('chrome://theme/IDR_EASY_UNLOCK_UNLOCKED_PRESSED');
+  display: none;
+}
+
+.custom-icon-spinner {
+  -webkit-animation: easy-unlock-spinner-animation 2s steps(45) infinite;
+  background-image: url('chrome://theme/IDR_EASY_UNLOCK_SPINNER');
+}
+
+@-webkit-keyframes easy-unlock-spinner-animation {
+  from { background-position: 0 }
+  to { background-position: -1215px }
+}
+
+.interactive-custom-icon {
+  cursor: pointer;
+}
+
 .custom-icon-container {
   display: flex;
   flex: none;
@@ -344,6 +416,14 @@ html[dir=rtl] .user-type-icon-area {
   width: 220px;
 }
 
+.action-box-area.active ~ .action-box-menu.left-edge-offset {
+  left: 0 !important;
+}
+
+.action-box-area.active ~ .action-box-menu.right-edge-offset {
+  right: 0 !important;
+}
+
 .action-box-area.active ~ .action-box-menu:not(.menu-moved-up) {
   top: 18px;
 }